From 52c99887928b43605711061313067db624a771d6 Mon Sep 17 00:00:00 2001
From: LIUeng <LIUeng@users.noreply.github.com>
Date: Fri, 29 Mar 2024 05:55:49 +0000
Subject: [PATCH] deploy: 3b7153d8eb7e26a2d844e0f0d02037a4831867c3

---
 404.html                                      | 12 +++++-----
 CNAME                                         |  1 -
 alogrithm/basic/O.html                        | 18 +++++++-------
 alogrithm/basic/bit.html                      | 18 +++++++-------
 alogrithm/basic/red_black_tree.html           | 20 ++++++++--------
 alogrithm/index.html                          | 18 +++++++-------
 alogrithm/interview/self.html                 | 20 ++++++++--------
 architecture/index.html                       | 18 +++++++-------
 architecture/standard/A-YZ.html               | 18 +++++++-------
 architecture/standard/comp-mod.html           | 18 +++++++-------
 architecture/standard/monitor.html            | 18 +++++++-------
 architecture/standard/performance.html        | 18 +++++++-------
 architecture/standard/project-design.html     | 18 +++++++-------
 architecture/websecure/xss.html               | 18 +++++++-------
 articles/advanced/debounce.html               | 20 ++++++++--------
 articles/advanced/devServer.html              | 20 ++++++++--------
 articles/advanced/docs.html                   | 20 ++++++++--------
 articles/advanced/htmlWebpackPlugin.html      | 20 ++++++++--------
 articles/advanced/knowledge.js.html           | 20 ++++++++--------
 articles/advanced/mutationObserver.html       | 22 ++++++++---------
 articles/advanced/transitionAnimation.html    | 20 ++++++++--------
 articles/advanced/v8-code.html                | 18 +++++++-------
 articles/advanced/virtualList.html            | 20 ++++++++--------
 articles/basic/clipboard.html                 | 20 ++++++++--------
 articles/basic/color_convert.html             | 20 ++++++++--------
 articles/basic/dom_events.html                | 20 ++++++++--------
 articles/basic/eslint.html                    | 20 ++++++++--------
 articles/basic/git.html                       | 20 ++++++++--------
 articles/basic/history.html                   | 20 ++++++++--------
 articles/basic/ieee.html                      | 20 ++++++++--------
 articles/basic/module.html                    | 20 ++++++++--------
 articles/basic/script_link.html               | 18 +++++++-------
 articles/basic/syslink.html                   | 20 ++++++++--------
 articles/index.html                           | 18 +++++++-------
 articles/problem/css.html                     | 20 ++++++++--------
 articles/problem/yarn.html                    | 18 +++++++-------
 articles/servers/ecs.html                     | 18 +++++++-------
 assets/alogrithm_basic_O.md.7641dd85.js       |  1 +
 assets/alogrithm_basic_O.md.7641dd85.lean.js  |  1 +
 assets/alogrithm_basic_O.md.efeb357c.js       |  1 -
 assets/alogrithm_basic_O.md.efeb357c.lean.js  |  1 -
 assets/alogrithm_basic_bit.md.1b0e2756.js     |  1 -
 .../alogrithm_basic_bit.md.1b0e2756.lean.js   |  1 -
 assets/alogrithm_basic_bit.md.f90bc13d.js     |  1 +
 .../alogrithm_basic_bit.md.f90bc13d.lean.js   |  1 +
 ...rithm_basic_red_black_tree.md.55eb2555.js} |  2 +-
 ..._basic_red_black_tree.md.55eb2555.lean.js} |  2 +-
 ...e594.js => alogrithm_index.md.67f8b108.js} |  2 +-
 ...js => alogrithm_index.md.67f8b108.lean.js} |  2 +-
 ...> alogrithm_interview_self.md.c8309eff.js} |  2 +-
 ...grithm_interview_self.md.c8309eff.lean.js} |  2 +-
 assets/{app.eb6611c3.js => app.2b2e5b4f.js}   |  2 +-
 ...d.js => architecture_index.md.678a0502.js} |  2 +-
 ...=> architecture_index.md.678a0502.lean.js} |  2 +-
 ...architecture_standard_A-YZ.md.a0e51b94.js} |  2 +-
 ...tecture_standard_A-YZ.md.a0e51b94.lean.js} |  2 +-
 ...itecture_standard_comp-mod.md.e027bdb0.js} |  2 +-
 ...ure_standard_comp-mod.md.e027bdb0.lean.js} |  2 +-
 ...hitecture_standard_monitor.md.6a6f7341.js} |  2 +-
 ...ture_standard_monitor.md.6a6f7341.lean.js} |  2 +-
 ...cture_standard_performance.md.5df854dc.js} |  2 +-
 ..._standard_performance.md.5df854dc.lean.js} |  2 +-
 ...re_standard_project-design.md.491238a5.js} |  2 +-
 ...andard_project-design.md.491238a5.lean.js} |  2 +-
 ...architecture_websecure_xss.md.b68d323d.js} |  2 +-
 ...tecture_websecure_xss.md.b68d323d.lean.js} |  2 +-
 ...articles_advanced_debounce.md.c37622c0.js} |  2 +-
 ...les_advanced_debounce.md.c37622c0.lean.js} |  2 +-
 ...rticles_advanced_devServer.md.adf19849.js} |  2 +-
 ...es_advanced_devServer.md.adf19849.lean.js} |  2 +-
 ... => articles_advanced_docs.md.501fd43f.js} |  2 +-
 ...rticles_advanced_docs.md.501fd43f.lean.js} |  2 +-
 ...advanced_htmlWebpackPlugin.md.b19e7406.js} |  2 +-
 ...ced_htmlWebpackPlugin.md.b19e7406.lean.js} |  2 +-
 ...cles_advanced_knowledge.js.md.8a7fac43.js} |  2 +-
 ...advanced_knowledge.js.md.8a7fac43.lean.js} |  2 +-
 ..._advanced_mutationObserver.md.1d6f3539.js} |  2 +-
 ...nced_mutationObserver.md.1d6f3539.lean.js} |  2 +-
 ...vanced_transitionAnimation.md.e283b702.js} |  2 +-
 ...ed_transitionAnimation.md.e283b702.lean.js |  1 +
 ...ed_transitionAnimation.md.f629e671.lean.js |  1 -
 .../articles_advanced_v8-code.md.40cd5ff2.js  |  1 -
 ...icles_advanced_v8-code.md.40cd5ff2.lean.js |  1 -
 .../articles_advanced_v8-code.md.aa1e9c3f.js  |  1 +
 ...icles_advanced_v8-code.md.aa1e9c3f.lean.js |  1 +
 ...icles_advanced_virtualList.md.0c9b0049.js} |  2 +-
 ...s_advanced_virtualList.md.0c9b0049.lean.js |  1 +
 ...s_advanced_virtualList.md.6b763d2e.lean.js |  1 -
 ...> articles_basic_clipboard.md.a48ade2d.js} |  2 +-
 ...icles_basic_clipboard.md.a48ade2d.lean.js} |  2 +-
 ...ticles_basic_color_convert.md.2cce2798.js} |  2 +-
 ...s_basic_color_convert.md.2cce2798.lean.js} |  2 +-
 ... articles_basic_dom_events.md.70d1d757.js} |  2 +-
 ...cles_basic_dom_events.md.70d1d757.lean.js} |  2 +-
 ...s => articles_basic_eslint.md.bea7edfe.js} |  2 +-
 ...articles_basic_eslint.md.bea7edfe.lean.js} |  2 +-
 ...6.js => articles_basic_git.md.8f01f6d4.js} |  2 +-
 ...=> articles_basic_git.md.8f01f6d4.lean.js} |  2 +-
 ... => articles_basic_history.md.bb6472e8.js} |  2 +-
 ...rticles_basic_history.md.bb6472e8.lean.js} |  2 +-
 ....js => articles_basic_ieee.md.04dcfb91.js} |  2 +-
 ...> articles_basic_ieee.md.04dcfb91.lean.js} |  2 +-
 ...s => articles_basic_module.md.67706ce5.js} |  2 +-
 ...articles_basic_module.md.67706ce5.lean.js} |  2 +-
 ...articles_basic_script_link.md.eb8f70cc.js} |  2 +-
 ...les_basic_script_link.md.eb8f70cc.lean.js} |  2 +-
 ... => articles_basic_syslink.md.8ff4f41d.js} |  2 +-
 ...rticles_basic_syslink.md.8ff4f41d.lean.js} |  2 +-
 ...5f70b.js => articles_index.md.16646c0c.js} |  2 +-
 ....js => articles_index.md.16646c0c.lean.js} |  2 +-
 ...js => articles_problem_css.md.5cdc7adf.js} |  2 +-
 ... articles_problem_css.md.5cdc7adf.lean.js} |  2 +-
 ...s => articles_problem_yarn.md.6c3a7206.js} |  2 +-
 ...articles_problem_yarn.md.6c3a7206.lean.js} |  2 +-
 ...js => articles_servers_ecs.md.3a2f60fe.js} |  2 +-
 ... articles_servers_ecs.md.3a2f60fe.lean.js} |  2 +-
 .../chunks/@localSearchIndexroot.2339654d.js  |  1 -
 .../chunks/@localSearchIndexroot.a8619f7e.js  |  1 +
 ...7b26d1.js => VPLocalSearchBox.edacac2c.js} |  2 +-
 ...work.7c0fadea.js => framework.0e8ae64e.js} |  2 +-
 assets/chunks/mutationObserver.46371927.js    |  1 +
 assets/chunks/mutationObserver.a5873c86.js    |  1 -
 .../{theme.668a0457.js => theme.c533df5a.js}  |  2 +-
 ...924593a.js => editor_index.md.f69469c7.js} |  2 +-
 ...an.js => editor_index.md.f69469c7.lean.js} |  2 +-
 ...> editor_markdown_vuepress.md.8bf6ae13.js} |  2 +-
 ...tor_markdown_vuepress.md.8bf6ae13.lean.js} |  2 +-
 ...ex.md.d75d9507.js => index.md.43ab226b.js} |  2 +-
 ...9507.lean.js => index.md.43ab226b.lean.js} |  2 +-
 assets/interview_browser.md.007efedd.js       |  1 -
 assets/interview_browser.md.007efedd.lean.js  |  1 -
 assets/interview_browser.md.a89a4d9b.js       |  1 +
 assets/interview_browser.md.a89a4d9b.lean.js  |  1 +
 ...42c988.js => interview_crp.md.20bcf17d.js} |  2 +-
 ...n.js => interview_crp.md.20bcf17d.lean.js} |  2 +-
 ...acc5.js => interview_index.md.d69cf835.js} |  2 +-
 ...js => interview_index.md.d69cf835.lean.js} |  2 +-
 ...6b.js => interview_metrics.md.6cc2fc75.js} |  2 +-
 ... => interview_metrics.md.6cc2fc75.lean.js} |  2 +-
 ...c33fe.js => network_cookie.md.9860852e.js} |  2 +-
 ....js => network_cookie.md.9860852e.lean.js} |  2 +-
 ...74416e8.js => network_cors.md.597b0a96.js} |  2 +-
 ...an.js => network_cors.md.597b0a96.lean.js} |  2 +-
 ...beb2a5b.js => network_dhcp.md.36ba0d0c.js} |  2 +-
 ...an.js => network_dhcp.md.36ba0d0c.lean.js} |  2 +-
 ...3e7452.js => network_index.md.a4ce8b20.js} |  2 +-
 ...n.js => network_index.md.a4ce8b20.lean.js} |  2 +-
 ...2877.js => network_ip_addr.md.7e144e39.js} |  2 +-
 ...js => network_ip_addr.md.7e144e39.lean.js} |  2 +-
 assets/network_layer.md.75f275a2.js           |  1 -
 assets/network_layer.md.75f275a2.lean.js      |  1 -
 assets/network_layer.md.e12ef59e.js           |  1 +
 assets/network_layer.md.e12ef59e.lean.js      |  1 +
 ...8171.js => network_methods.md.a8694107.js} |  2 +-
 ...js => network_methods.md.a8694107.lean.js} |  2 +-
 ...1eac5d1.js => network_noun.md.b1b4cd32.js} |  2 +-
 ...an.js => network_noun.md.b1b4cd32.lean.js} |  2 +-
 ...3b1c2623.js => network_osi.md.021cfe3c.js} |  2 +-
 ...ean.js => network_osi.md.021cfe3c.lean.js} |  2 +-
 ...5c373.js => network_socket.md.a2e885ec.js} |  2 +-
 ....js => network_socket.md.a2e885ec.lean.js} |  2 +-
 ...js => network_special_addr.md.deb0827e.js} |  2 +-
 ... network_special_addr.md.deb0827e.lean.js} |  2 +-
 ....js => network_status_code.md.b6f517ca.js} |  2 +-
 ...> network_status_code.md.b6f517ca.lean.js} |  2 +-
 ....js => network_subnet_mask.md.7a58406b.js} |  2 +-
 ...> network_subnet_mask.md.7a58406b.lean.js} |  2 +-
 ...e38d.js => network_tls_ssl.md.e0605f70.js} |  2 +-
 ...js => network_tls_ssl.md.e0605f70.lean.js} |  2 +-
 ...c7068.js => network_webrtc.md.06b0eb25.js} |  2 +-
 ....js => network_webrtc.md.06b0eb25.lean.js} |  2 +-
 ...27ad88.js => notes_css_bfc.md.d9623d35.js} |  2 +-
 ...n.js => notes_css_bfc.md.d9623d35.lean.js} |  2 +-
 ...1a02c1.js => notes_css_box.md.b1484cf4.js} |  2 +-
 ...n.js => notes_css_box.md.b1484cf4.lean.js} |  2 +-
 ...9380d.js => notes_css_flex.md.d5fb90fd.js} |  2 +-
 ....js => notes_css_flex.md.d5fb90fd.lean.js} |  2 +-
 ...6ca7.js => notes_css_float.md.74e6557b.js} |  2 +-
 ...js => notes_css_float.md.74e6557b.lean.js} |  2 +-
 ...b88b.js => notes_css_index.md.97c1211d.js} |  2 +-
 ...js => notes_css_index.md.97c1211d.lean.js} |  2 +-
 ...657.js => notes_css_inline.md.5f3b894b.js} |  2 +-
 ...s => notes_css_inline.md.5f3b894b.lean.js} |  2 +-
 ...dd8.js => notes_css_pseudo.md.8a522478.js} |  2 +-
 ...s => notes_css_pseudo.md.8a522478.lean.js} |  2 +-
 ...7.js => notes_css_replaced.md.3cd3cdf4.js} |  2 +-
 ...=> notes_css_replaced.md.3cd3cdf4.lean.js} |  2 +-
 ...> notes_css_text-character.md.567549b3.js} |  2 +-
 ...es_css_text-character.md.567549b3.lean.js} |  2 +-
 ...js => notes_css_visibility.md.36af78c5.js} |  2 +-
 ... notes_css_visibility.md.36af78c5.lean.js} |  2 +-
 ...b465ca1.js => notes_es_es6.md.c70b9687.js} |  2 +-
 ...an.js => notes_es_es6.md.c70b9687.lean.js} |  2 +-
 ....js => notes_html_esmodule.md.8d06acba.js} |  2 +-
 ...> notes_html_esmodule.md.8d06acba.lean.js} |  2 +-
 assets/notes_html_seo.md.15c47690.lean.js     |  1 -
 ...47690.js => notes_html_seo.md.17a408c9.js} |  2 +-
 assets/notes_html_seo.md.17a408c9.lean.js     |  1 +
 ...b.js => notes_html_unusual.md.76389d1b.js} |  2 +-
 ...=> notes_html_unusual.md.76389d1b.lean.js} |  2 +-
 ...778f192c.js => notes_index.md.0f4dfe42.js} |  2 +-
 ...ean.js => notes_index.md.0f4dfe42.lean.js} |  2 +-
 ...js => notes_javascript_URI.md.0675aa7b.js} |  2 +-
 ... notes_javascript_URI.md.0675aa7b.lean.js} |  2 +-
 ...avascript_addEventListener.md.6026f065.js} |  2 +-
 ...ript_addEventListener.md.6026f065.lean.js} |  2 +-
 .../notes_javascript_dom.md.00aacf49.lean.js  |  1 -
 ...js => notes_javascript_dom.md.0af651ba.js} |  4 ++--
 .../notes_javascript_dom.md.0af651ba.lean.js  |  1 +
 assets/notes_javascript_equal.md.0278cdef.js  |  9 +++++++
 ...notes_javascript_equal.md.0278cdef.lean.js |  1 +
 assets/notes_javascript_equal.md.392568f0.js  |  9 -------
 ...notes_javascript_equal.md.392568f0.lean.js |  1 -
 ...notes_javascript_event-loop.md.15fccb5b.js |  1 -
 ..._javascript_event-loop.md.15fccb5b.lean.js |  1 -
 ...notes_javascript_event-loop.md.bdac45df.js |  1 +
 ..._javascript_event-loop.md.bdac45df.lean.js |  1 +
 ...s => notes_javascript_jsop.md.a97810f8.js} |  2 +-
 ...notes_javascript_jsop.md.a97810f8.lean.js} |  2 +-
 ...avascript_mutationObserver.md.1d6ee92e.js} |  2 +-
 ...ript_mutationObserver.md.1d6ee92e.lean.js} |  2 +-
 ...notes_javascript_prototype.md.36c69f43.js} |  2 +-
 ..._javascript_prototype.md.36c69f43.lean.js} |  2 +-
 ... => notes_javascript_scope.md.be39322f.js} |  2 +-
 ...otes_javascript_scope.md.be39322f.lean.js} |  2 +-
 ..._javascript_storage-struct.md.0cab0c00.js} |  2 +-
 ...script_storage-struct.md.0cab0c00.lean.js} |  2 +-
 ...s => notes_javascript_this.md.e080543e.js} |  2 +-
 ...notes_javascript_this.md.e080543e.lean.js} |  2 +-
 ...9e.js => notes_nodejs_ansi.md.0e90e8a3.js} |  2 +-
 ... => notes_nodejs_ansi.md.0e90e8a3.lean.js} |  2 +-
 ...=> notes_nodejs_event-loop.md.f5078491.js} |  2 +-
 ...tes_nodejs_event-loop.md.f5078491.lean.js} |  2 +-
 ...498.js => notes_nodejs_npm.md.990b6f83.js} |  2 +-
 ...s => notes_nodejs_npm.md.990b6f83.lean.js} |  2 +-
 ...d0.js => notes_regexp_base.md.80469b71.js} |  2 +-
 ... => notes_regexp_base.md.80469b71.lean.js} |  2 +-
 ...js => notes_regexp_unknown.md.ffcfd74a.js} |  2 +-
 ... notes_regexp_unknown.md.ffcfd74a.lean.js} |  2 +-
 ... notes_typescript_advanced.md.13baaa4d.js} |  2 +-
 ...s_typescript_advanced.md.13baaa4d.lean.js} |  2 +-
 ... => notes_typescript_basic.md.7f81406b.js} |  2 +-
 ...otes_typescript_basic.md.7f81406b.lean.js} |  2 +-
 ...otes_typescript_lib-struct.md.214381a8.js} |  2 +-
 ...typescript_lib-struct.md.214381a8.lean.js} |  2 +-
 ...67.js => source-code_index.md.c3b56127.js} |  2 +-
 ... => source-code_index.md.c3b56127.lean.js} |  2 +-
 ...rce-code_react_api_context.md.cb6576d9.js} |  2 +-
 ...ode_react_api_context.md.cb6576d9.lean.js} |  2 +-
 ... source-code_react_api_ref.md.955d1f79.js} |  2 +-
 ...ce-code_react_api_ref.md.955d1f79.lean.js} |  2 +-
 ...s => source-code_vue_index.md.59347e5f.js} |  2 +-
 ...source-code_vue_index.md.59347e5f.lean.js} |  2 +-
 assets/style.1381d0e1.css                     |  1 -
 assets/style.9a9f46c7.css                     |  1 +
 editor/index.html                             | 18 +++++++-------
 editor/markdown/vuepress.html                 | 20 ++++++++--------
 hashmap.json                                  |  2 +-
 index.html                                    | 18 +++++++-------
 interview/browser.html                        | 18 +++++++-------
 interview/crp.html                            | 18 +++++++-------
 interview/index.html                          | 18 +++++++-------
 interview/metrics.html                        | 20 ++++++++--------
 network/cookie.html                           | 20 ++++++++--------
 network/cors.html                             | 20 ++++++++--------
 network/dhcp.html                             | 20 ++++++++--------
 network/index.html                            | 20 ++++++++--------
 network/ip_addr.html                          | 18 +++++++-------
 network/layer.html                            | 18 +++++++-------
 network/methods.html                          | 18 +++++++-------
 network/noun.html                             | 18 +++++++-------
 network/osi.html                              | 18 +++++++-------
 network/socket.html                           | 20 ++++++++--------
 network/special_addr.html                     | 18 +++++++-------
 network/status_code.html                      | 18 +++++++-------
 network/subnet_mask.html                      | 20 ++++++++--------
 network/tls_ssl.html                          | 18 +++++++-------
 network/webrtc.html                           | 18 +++++++-------
 notes/css/bfc.html                            | 18 +++++++-------
 notes/css/box.html                            | 18 +++++++-------
 notes/css/flex.html                           | 20 ++++++++--------
 notes/css/float.html                          | 20 ++++++++--------
 notes/css/index.html                          | 20 ++++++++--------
 notes/css/inline.html                         | 18 +++++++-------
 notes/css/pseudo.html                         | 18 +++++++-------
 notes/css/replaced.html                       | 18 +++++++-------
 notes/css/text-character.html                 | 20 ++++++++--------
 notes/css/visibility.html                     | 20 ++++++++--------
 notes/es/es6.html                             | 20 ++++++++--------
 notes/html/esmodule.html                      | 20 ++++++++--------
 notes/html/seo.html                           | 20 ++++++++--------
 notes/html/unusual.html                       | 18 +++++++-------
 notes/index.html                              | 18 +++++++-------
 notes/javascript/URI.html                     | 18 +++++++-------
 notes/javascript/addEventListener.html        | 20 ++++++++--------
 notes/javascript/dom.html                     | 24 +++++++++----------
 notes/javascript/equal.html                   | 20 ++++++++--------
 notes/javascript/event-loop.html              | 18 +++++++-------
 notes/javascript/jsop.html                    | 20 ++++++++--------
 notes/javascript/mutationObserver.html        | 22 ++++++++---------
 notes/javascript/prototype.html               | 20 ++++++++--------
 notes/javascript/scope.html                   | 20 ++++++++--------
 notes/javascript/storage-struct.html          | 18 +++++++-------
 notes/javascript/this.html                    | 20 ++++++++--------
 notes/nodejs/ansi.html                        | 18 +++++++-------
 notes/nodejs/event-loop.html                  | 20 ++++++++--------
 notes/nodejs/npm.html                         | 18 +++++++-------
 notes/regexp/base.html                        | 18 +++++++-------
 notes/regexp/unknown.html                     | 20 ++++++++--------
 notes/typescript/advanced.html                | 20 ++++++++--------
 notes/typescript/basic.html                   | 20 ++++++++--------
 notes/typescript/lib-struct.html              | 20 ++++++++--------
 source-code/index.html                        | 18 +++++++-------
 source-code/react/api/context.html            | 20 ++++++++--------
 source-code/react/api/ref.html                | 20 ++++++++--------
 source-code/vue/index.html                    | 18 +++++++-------
 316 files changed, 1123 insertions(+), 1124 deletions(-)
 delete mode 100644 CNAME
 create mode 100644 assets/alogrithm_basic_O.md.7641dd85.js
 create mode 100644 assets/alogrithm_basic_O.md.7641dd85.lean.js
 delete mode 100644 assets/alogrithm_basic_O.md.efeb357c.js
 delete mode 100644 assets/alogrithm_basic_O.md.efeb357c.lean.js
 delete mode 100644 assets/alogrithm_basic_bit.md.1b0e2756.js
 delete mode 100644 assets/alogrithm_basic_bit.md.1b0e2756.lean.js
 create mode 100644 assets/alogrithm_basic_bit.md.f90bc13d.js
 create mode 100644 assets/alogrithm_basic_bit.md.f90bc13d.lean.js
 rename assets/{alogrithm_basic_red_black_tree.md.1fb89df7.js => alogrithm_basic_red_black_tree.md.55eb2555.js} (96%)
 rename assets/{alogrithm_basic_red_black_tree.md.1fb89df7.lean.js => alogrithm_basic_red_black_tree.md.55eb2555.lean.js} (72%)
 rename assets/{alogrithm_index.md.2b9ae594.js => alogrithm_index.md.67f8b108.js} (91%)
 rename assets/{alogrithm_index.md.2b9ae594.lean.js => alogrithm_index.md.67f8b108.lean.js} (91%)
 rename assets/{alogrithm_interview_self.md.f2953867.js => alogrithm_interview_self.md.c8309eff.js} (99%)
 rename assets/{alogrithm_interview_self.md.f2953867.lean.js => alogrithm_interview_self.md.c8309eff.lean.js} (72%)
 rename assets/{app.eb6611c3.js => app.2b2e5b4f.js} (90%)
 rename assets/{architecture_index.md.d9230efd.js => architecture_index.md.678a0502.js} (91%)
 rename assets/{architecture_index.md.d9230efd.lean.js => architecture_index.md.678a0502.lean.js} (91%)
 rename assets/{architecture_standard_A-YZ.md.bd642461.js => architecture_standard_A-YZ.md.a0e51b94.js} (95%)
 rename assets/{architecture_standard_A-YZ.md.bd642461.lean.js => architecture_standard_A-YZ.md.a0e51b94.lean.js} (71%)
 rename assets/{architecture_standard_comp-mod.md.f6f9cedd.js => architecture_standard_comp-mod.md.e027bdb0.js} (96%)
 rename assets/{architecture_standard_comp-mod.md.f6f9cedd.lean.js => architecture_standard_comp-mod.md.e027bdb0.lean.js} (73%)
 rename assets/{architecture_standard_monitor.md.ff5a8411.js => architecture_standard_monitor.md.6a6f7341.js} (96%)
 rename assets/{architecture_standard_monitor.md.ff5a8411.lean.js => architecture_standard_monitor.md.6a6f7341.lean.js} (72%)
 rename assets/{architecture_standard_performance.md.c952558a.js => architecture_standard_performance.md.5df854dc.js} (97%)
 rename assets/{architecture_standard_performance.md.c952558a.lean.js => architecture_standard_performance.md.5df854dc.lean.js} (73%)
 rename assets/{architecture_standard_project-design.md.1e6aae9a.js => architecture_standard_project-design.md.491238a5.js} (97%)
 rename assets/{architecture_standard_project-design.md.1e6aae9a.lean.js => architecture_standard_project-design.md.491238a5.lean.js} (73%)
 rename assets/{architecture_websecure_xss.md.63b7ea5b.js => architecture_websecure_xss.md.b68d323d.js} (90%)
 rename assets/{architecture_websecure_xss.md.63b7ea5b.lean.js => architecture_websecure_xss.md.b68d323d.lean.js} (71%)
 rename assets/{articles_advanced_debounce.md.5bbfcaa3.js => articles_advanced_debounce.md.c37622c0.js} (99%)
 rename assets/{articles_advanced_debounce.md.5bbfcaa3.lean.js => articles_advanced_debounce.md.c37622c0.lean.js} (72%)
 rename assets/{articles_advanced_devServer.md.7df25eb4.js => articles_advanced_devServer.md.adf19849.js} (99%)
 rename assets/{articles_advanced_devServer.md.7df25eb4.lean.js => articles_advanced_devServer.md.adf19849.lean.js} (73%)
 rename assets/{articles_advanced_docs.md.74a9328e.js => articles_advanced_docs.md.501fd43f.js} (99%)
 rename assets/{articles_advanced_docs.md.74a9328e.lean.js => articles_advanced_docs.md.501fd43f.lean.js} (71%)
 rename assets/{articles_advanced_htmlWebpackPlugin.md.4a93efb9.js => articles_advanced_htmlWebpackPlugin.md.b19e7406.js} (99%)
 rename assets/{articles_advanced_htmlWebpackPlugin.md.4a93efb9.lean.js => articles_advanced_htmlWebpackPlugin.md.b19e7406.lean.js} (74%)
 rename assets/{articles_advanced_knowledge.js.md.4f4856e0.js => articles_advanced_knowledge.js.md.8a7fac43.js} (96%)
 rename assets/{articles_advanced_knowledge.js.md.4f4856e0.lean.js => articles_advanced_knowledge.js.md.8a7fac43.lean.js} (73%)
 rename assets/{articles_advanced_mutationObserver.md.cb0eb7f3.js => articles_advanced_mutationObserver.md.1d6f3539.js} (99%)
 rename assets/{articles_advanced_mutationObserver.md.cb0eb7f3.lean.js => articles_advanced_mutationObserver.md.1d6f3539.lean.js} (76%)
 rename assets/{articles_advanced_transitionAnimation.md.f629e671.js => articles_advanced_transitionAnimation.md.e283b702.js} (92%)
 create mode 100644 assets/articles_advanced_transitionAnimation.md.e283b702.lean.js
 delete mode 100644 assets/articles_advanced_transitionAnimation.md.f629e671.lean.js
 delete mode 100644 assets/articles_advanced_v8-code.md.40cd5ff2.js
 delete mode 100644 assets/articles_advanced_v8-code.md.40cd5ff2.lean.js
 create mode 100644 assets/articles_advanced_v8-code.md.aa1e9c3f.js
 create mode 100644 assets/articles_advanced_v8-code.md.aa1e9c3f.lean.js
 rename assets/{articles_advanced_virtualList.md.6b763d2e.js => articles_advanced_virtualList.md.0c9b0049.js} (96%)
 create mode 100644 assets/articles_advanced_virtualList.md.0c9b0049.lean.js
 delete mode 100644 assets/articles_advanced_virtualList.md.6b763d2e.lean.js
 rename assets/{articles_basic_clipboard.md.b53c3e95.js => articles_basic_clipboard.md.a48ade2d.js} (99%)
 rename assets/{articles_basic_clipboard.md.b53c3e95.lean.js => articles_basic_clipboard.md.a48ade2d.lean.js} (93%)
 rename assets/{articles_basic_color_convert.md.8302e80d.js => articles_basic_color_convert.md.2cce2798.js} (99%)
 rename assets/{articles_basic_color_convert.md.8302e80d.lean.js => articles_basic_color_convert.md.2cce2798.lean.js} (72%)
 rename assets/{articles_basic_dom_events.md.6bad1c68.js => articles_basic_dom_events.md.70d1d757.js} (99%)
 rename assets/{articles_basic_dom_events.md.6bad1c68.lean.js => articles_basic_dom_events.md.70d1d757.lean.js} (72%)
 rename assets/{articles_basic_eslint.md.8aa0db41.js => articles_basic_eslint.md.bea7edfe.js} (99%)
 rename assets/{articles_basic_eslint.md.8aa0db41.lean.js => articles_basic_eslint.md.bea7edfe.lean.js} (70%)
 rename assets/{articles_basic_git.md.abbfc6c6.js => articles_basic_git.md.8f01f6d4.js} (99%)
 rename assets/{articles_basic_git.md.abbfc6c6.lean.js => articles_basic_git.md.8f01f6d4.lean.js} (69%)
 rename assets/{articles_basic_history.md.4e7d878f.js => articles_basic_history.md.bb6472e8.js} (98%)
 rename assets/{articles_basic_history.md.4e7d878f.lean.js => articles_basic_history.md.bb6472e8.lean.js} (71%)
 rename assets/{articles_basic_ieee.md.f4f18348.js => articles_basic_ieee.md.04dcfb91.js} (98%)
 rename assets/{articles_basic_ieee.md.f4f18348.lean.js => articles_basic_ieee.md.04dcfb91.lean.js} (70%)
 rename assets/{articles_basic_module.md.e77ca7a2.js => articles_basic_module.md.67706ce5.js} (99%)
 rename assets/{articles_basic_module.md.e77ca7a2.lean.js => articles_basic_module.md.67706ce5.lean.js} (71%)
 rename assets/{articles_basic_script_link.md.78aa867d.js => articles_basic_script_link.md.eb8f70cc.js} (92%)
 rename assets/{articles_basic_script_link.md.78aa867d.lean.js => articles_basic_script_link.md.eb8f70cc.lean.js} (72%)
 rename assets/{articles_basic_syslink.md.ba8c5ece.js => articles_basic_syslink.md.8ff4f41d.js} (98%)
 rename assets/{articles_basic_syslink.md.ba8c5ece.lean.js => articles_basic_syslink.md.8ff4f41d.lean.js} (71%)
 rename assets/{articles_index.md.2805f70b.js => articles_index.md.16646c0c.js} (93%)
 rename assets/{articles_index.md.2805f70b.lean.js => articles_index.md.16646c0c.lean.js} (70%)
 rename assets/{articles_problem_css.md.d109b0e6.js => articles_problem_css.md.5cdc7adf.js} (98%)
 rename assets/{articles_problem_css.md.d109b0e6.lean.js => articles_problem_css.md.5cdc7adf.lean.js} (71%)
 rename assets/{articles_problem_yarn.md.3bf099db.js => articles_problem_yarn.md.6c3a7206.js} (95%)
 rename assets/{articles_problem_yarn.md.3bf099db.lean.js => articles_problem_yarn.md.6c3a7206.lean.js} (71%)
 rename assets/{articles_servers_ecs.md.f94f1bda.js => articles_servers_ecs.md.3a2f60fe.js} (93%)
 rename assets/{articles_servers_ecs.md.f94f1bda.lean.js => articles_servers_ecs.md.3a2f60fe.lean.js} (71%)
 delete mode 100644 assets/chunks/@localSearchIndexroot.2339654d.js
 create mode 100644 assets/chunks/@localSearchIndexroot.a8619f7e.js
 rename assets/chunks/{VPLocalSearchBox.527b26d1.js => VPLocalSearchBox.edacac2c.js} (99%)
 rename assets/chunks/{framework.7c0fadea.js => framework.0e8ae64e.js} (79%)
 create mode 100644 assets/chunks/mutationObserver.46371927.js
 delete mode 100644 assets/chunks/mutationObserver.a5873c86.js
 rename assets/chunks/{theme.668a0457.js => theme.c533df5a.js} (99%)
 rename assets/{editor_index.md.b924593a.js => editor_index.md.f69469c7.js} (90%)
 rename assets/{editor_index.md.b924593a.lean.js => editor_index.md.f69469c7.lean.js} (90%)
 rename assets/{editor_markdown_vuepress.md.95e9a581.js => editor_markdown_vuepress.md.8bf6ae13.js} (99%)
 rename assets/{editor_markdown_vuepress.md.95e9a581.lean.js => editor_markdown_vuepress.md.8bf6ae13.lean.js} (72%)
 rename assets/{index.md.d75d9507.js => index.md.43ab226b.js} (94%)
 rename assets/{index.md.d75d9507.lean.js => index.md.43ab226b.lean.js} (94%)
 delete mode 100644 assets/interview_browser.md.007efedd.js
 delete mode 100644 assets/interview_browser.md.007efedd.lean.js
 create mode 100644 assets/interview_browser.md.a89a4d9b.js
 create mode 100644 assets/interview_browser.md.a89a4d9b.lean.js
 rename assets/{interview_crp.md.7942c988.js => interview_crp.md.20bcf17d.js} (93%)
 rename assets/{interview_crp.md.7942c988.lean.js => interview_crp.md.20bcf17d.lean.js} (69%)
 rename assets/{interview_index.md.e4e6acc5.js => interview_index.md.d69cf835.js} (90%)
 rename assets/{interview_index.md.e4e6acc5.lean.js => interview_index.md.d69cf835.lean.js} (90%)
 rename assets/{interview_metrics.md.e083096b.js => interview_metrics.md.6cc2fc75.js} (98%)
 rename assets/{interview_metrics.md.e083096b.lean.js => interview_metrics.md.6cc2fc75.lean.js} (70%)
 rename assets/{network_cookie.md.14ec33fe.js => network_cookie.md.9860852e.js} (98%)
 rename assets/{network_cookie.md.14ec33fe.lean.js => network_cookie.md.9860852e.lean.js} (69%)
 rename assets/{network_cors.md.974416e8.js => network_cors.md.597b0a96.js} (99%)
 rename assets/{network_cors.md.974416e8.lean.js => network_cors.md.597b0a96.lean.js} (68%)
 rename assets/{network_dhcp.md.2beb2a5b.js => network_dhcp.md.36ba0d0c.js} (99%)
 rename assets/{network_dhcp.md.2beb2a5b.lean.js => network_dhcp.md.36ba0d0c.lean.js} (68%)
 rename assets/{network_index.md.ac3e7452.js => network_index.md.a4ce8b20.js} (99%)
 rename assets/{network_index.md.ac3e7452.lean.js => network_index.md.a4ce8b20.lean.js} (69%)
 rename assets/{network_ip_addr.md.c87e2877.js => network_ip_addr.md.7e144e39.js} (97%)
 rename assets/{network_ip_addr.md.c87e2877.lean.js => network_ip_addr.md.7e144e39.lean.js} (69%)
 delete mode 100644 assets/network_layer.md.75f275a2.js
 delete mode 100644 assets/network_layer.md.75f275a2.lean.js
 create mode 100644 assets/network_layer.md.e12ef59e.js
 create mode 100644 assets/network_layer.md.e12ef59e.lean.js
 rename assets/{network_methods.md.d5348171.js => network_methods.md.a8694107.js} (97%)
 rename assets/{network_methods.md.d5348171.lean.js => network_methods.md.a8694107.lean.js} (70%)
 rename assets/{network_noun.md.e1eac5d1.js => network_noun.md.b1b4cd32.js} (95%)
 rename assets/{network_noun.md.e1eac5d1.lean.js => network_noun.md.b1b4cd32.lean.js} (69%)
 rename assets/{network_osi.md.3b1c2623.js => network_osi.md.021cfe3c.js} (98%)
 rename assets/{network_osi.md.3b1c2623.lean.js => network_osi.md.021cfe3c.lean.js} (69%)
 rename assets/{network_socket.md.5f45c373.js => network_socket.md.a2e885ec.js} (98%)
 rename assets/{network_socket.md.5f45c373.lean.js => network_socket.md.a2e885ec.lean.js} (69%)
 rename assets/{network_special_addr.md.8b6962a9.js => network_special_addr.md.deb0827e.js} (92%)
 rename assets/{network_special_addr.md.8b6962a9.lean.js => network_special_addr.md.deb0827e.lean.js} (71%)
 rename assets/{network_status_code.md.3f54f40a.js => network_status_code.md.b6f517ca.js} (99%)
 rename assets/{network_status_code.md.3f54f40a.lean.js => network_status_code.md.b6f517ca.lean.js} (70%)
 rename assets/{network_subnet_mask.md.9eb6788c.js => network_subnet_mask.md.7a58406b.js} (97%)
 rename assets/{network_subnet_mask.md.9eb6788c.lean.js => network_subnet_mask.md.7a58406b.lean.js} (70%)
 rename assets/{network_tls_ssl.md.1b14e38d.js => network_tls_ssl.md.e0605f70.js} (98%)
 rename assets/{network_tls_ssl.md.1b14e38d.lean.js => network_tls_ssl.md.e0605f70.lean.js} (70%)
 rename assets/{network_webrtc.md.5adc7068.js => network_webrtc.md.06b0eb25.js} (91%)
 rename assets/{network_webrtc.md.5adc7068.lean.js => network_webrtc.md.06b0eb25.lean.js} (69%)
 rename assets/{notes_css_bfc.md.cf27ad88.js => notes_css_bfc.md.d9623d35.js} (97%)
 rename assets/{notes_css_bfc.md.cf27ad88.lean.js => notes_css_bfc.md.d9623d35.lean.js} (70%)
 rename assets/{notes_css_box.md.b41a02c1.js => notes_css_box.md.b1484cf4.js} (96%)
 rename assets/{notes_css_box.md.b41a02c1.lean.js => notes_css_box.md.b1484cf4.lean.js} (84%)
 rename assets/{notes_css_flex.md.2119380d.js => notes_css_flex.md.d5fb90fd.js} (99%)
 rename assets/{notes_css_flex.md.2119380d.lean.js => notes_css_flex.md.d5fb90fd.lean.js} (69%)
 rename assets/{notes_css_float.md.88996ca7.js => notes_css_float.md.74e6557b.js} (98%)
 rename assets/{notes_css_float.md.88996ca7.lean.js => notes_css_float.md.74e6557b.lean.js} (70%)
 rename assets/{notes_css_index.md.9165b88b.js => notes_css_index.md.97c1211d.js} (98%)
 rename assets/{notes_css_index.md.9165b88b.lean.js => notes_css_index.md.97c1211d.lean.js} (70%)
 rename assets/{notes_css_inline.md.ed702657.js => notes_css_inline.md.5f3b894b.js} (91%)
 rename assets/{notes_css_inline.md.ed702657.lean.js => notes_css_inline.md.5f3b894b.lean.js} (70%)
 rename assets/{notes_css_pseudo.md.65d61dd8.js => notes_css_pseudo.md.8a522478.js} (96%)
 rename assets/{notes_css_pseudo.md.65d61dd8.lean.js => notes_css_pseudo.md.8a522478.lean.js} (70%)
 rename assets/{notes_css_replaced.md.ceaac847.js => notes_css_replaced.md.3cd3cdf4.js} (96%)
 rename assets/{notes_css_replaced.md.ceaac847.lean.js => notes_css_replaced.md.3cd3cdf4.lean.js} (70%)
 rename assets/{notes_css_text-character.md.ab74a92c.js => notes_css_text-character.md.567549b3.js} (99%)
 rename assets/{notes_css_text-character.md.ab74a92c.lean.js => notes_css_text-character.md.567549b3.lean.js} (71%)
 rename assets/{notes_css_visibility.md.4ed2886f.js => notes_css_visibility.md.36af78c5.js} (97%)
 rename assets/{notes_css_visibility.md.4ed2886f.lean.js => notes_css_visibility.md.36af78c5.lean.js} (70%)
 rename assets/{notes_es_es6.md.cb465ca1.js => notes_es_es6.md.c70b9687.js} (99%)
 rename assets/{notes_es_es6.md.cb465ca1.lean.js => notes_es_es6.md.c70b9687.lean.js} (68%)
 rename assets/{notes_html_esmodule.md.ddda8566.js => notes_html_esmodule.md.8d06acba.js} (99%)
 rename assets/{notes_html_esmodule.md.ddda8566.lean.js => notes_html_esmodule.md.8d06acba.lean.js} (71%)
 delete mode 100644 assets/notes_html_seo.md.15c47690.lean.js
 rename assets/{notes_html_seo.md.15c47690.js => notes_html_seo.md.17a408c9.js} (67%)
 create mode 100644 assets/notes_html_seo.md.17a408c9.lean.js
 rename assets/{notes_html_unusual.md.a78f96eb.js => notes_html_unusual.md.76389d1b.js} (91%)
 rename assets/{notes_html_unusual.md.a78f96eb.lean.js => notes_html_unusual.md.76389d1b.lean.js} (71%)
 rename assets/{notes_index.md.778f192c.js => notes_index.md.0f4dfe42.js} (91%)
 rename assets/{notes_index.md.778f192c.lean.js => notes_index.md.0f4dfe42.lean.js} (91%)
 rename assets/{notes_javascript_URI.md.aa38219c.js => notes_javascript_URI.md.0675aa7b.js} (93%)
 rename assets/{notes_javascript_URI.md.aa38219c.lean.js => notes_javascript_URI.md.0675aa7b.lean.js} (70%)
 rename assets/{notes_javascript_addEventListener.md.1f4fe8a5.js => notes_javascript_addEventListener.md.6026f065.js} (99%)
 rename assets/{notes_javascript_addEventListener.md.1f4fe8a5.lean.js => notes_javascript_addEventListener.md.6026f065.lean.js} (73%)
 delete mode 100644 assets/notes_javascript_dom.md.00aacf49.lean.js
 rename assets/{notes_javascript_dom.md.00aacf49.js => notes_javascript_dom.md.0af651ba.js} (96%)
 create mode 100644 assets/notes_javascript_dom.md.0af651ba.lean.js
 create mode 100644 assets/notes_javascript_equal.md.0278cdef.js
 create mode 100644 assets/notes_javascript_equal.md.0278cdef.lean.js
 delete mode 100644 assets/notes_javascript_equal.md.392568f0.js
 delete mode 100644 assets/notes_javascript_equal.md.392568f0.lean.js
 delete mode 100644 assets/notes_javascript_event-loop.md.15fccb5b.js
 delete mode 100644 assets/notes_javascript_event-loop.md.15fccb5b.lean.js
 create mode 100644 assets/notes_javascript_event-loop.md.bdac45df.js
 create mode 100644 assets/notes_javascript_event-loop.md.bdac45df.lean.js
 rename assets/{notes_javascript_jsop.md.2e56b764.js => notes_javascript_jsop.md.a97810f8.js} (99%)
 rename assets/{notes_javascript_jsop.md.2e56b764.lean.js => notes_javascript_jsop.md.a97810f8.lean.js} (71%)
 rename assets/{notes_javascript_mutationObserver.md.a535a188.js => notes_javascript_mutationObserver.md.1d6ee92e.js} (99%)
 rename assets/{notes_javascript_mutationObserver.md.a535a188.lean.js => notes_javascript_mutationObserver.md.1d6ee92e.lean.js} (76%)
 rename assets/{notes_javascript_prototype.md.b24cb541.js => notes_javascript_prototype.md.36c69f43.js} (99%)
 rename assets/{notes_javascript_prototype.md.b24cb541.lean.js => notes_javascript_prototype.md.36c69f43.lean.js} (96%)
 rename assets/{notes_javascript_scope.md.9b63d680.js => notes_javascript_scope.md.be39322f.js} (99%)
 rename assets/{notes_javascript_scope.md.9b63d680.lean.js => notes_javascript_scope.md.be39322f.lean.js} (71%)
 rename assets/{notes_javascript_storage-struct.md.43266820.js => notes_javascript_storage-struct.md.0cab0c00.js} (96%)
 rename assets/{notes_javascript_storage-struct.md.43266820.lean.js => notes_javascript_storage-struct.md.0cab0c00.lean.js} (73%)
 rename assets/{notes_javascript_this.md.532a6f9a.js => notes_javascript_this.md.e080543e.js} (99%)
 rename assets/{notes_javascript_this.md.532a6f9a.lean.js => notes_javascript_this.md.e080543e.lean.js} (71%)
 rename assets/{notes_nodejs_ansi.md.b4c1b09e.js => notes_nodejs_ansi.md.0e90e8a3.js} (96%)
 rename assets/{notes_nodejs_ansi.md.b4c1b09e.lean.js => notes_nodejs_ansi.md.0e90e8a3.lean.js} (70%)
 rename assets/{notes_nodejs_event-loop.md.95affbd8.js => notes_nodejs_event-loop.md.f5078491.js} (98%)
 rename assets/{notes_nodejs_event-loop.md.95affbd8.lean.js => notes_nodejs_event-loop.md.f5078491.lean.js} (71%)
 rename assets/{notes_nodejs_npm.md.794dc498.js => notes_nodejs_npm.md.990b6f83.js} (93%)
 rename assets/{notes_nodejs_npm.md.794dc498.lean.js => notes_nodejs_npm.md.990b6f83.lean.js} (70%)
 rename assets/{notes_regexp_base.md.5f3b85d0.js => notes_regexp_base.md.80469b71.js} (92%)
 rename assets/{notes_regexp_base.md.5f3b85d0.lean.js => notes_regexp_base.md.80469b71.lean.js} (92%)
 rename assets/{notes_regexp_unknown.md.40d387f2.js => notes_regexp_unknown.md.ffcfd74a.js} (96%)
 rename assets/{notes_regexp_unknown.md.40d387f2.lean.js => notes_regexp_unknown.md.ffcfd74a.lean.js} (72%)
 rename assets/{notes_typescript_advanced.md.d0ace6b6.js => notes_typescript_advanced.md.13baaa4d.js} (99%)
 rename assets/{notes_typescript_advanced.md.d0ace6b6.lean.js => notes_typescript_advanced.md.13baaa4d.lean.js} (72%)
 rename assets/{notes_typescript_basic.md.75a51f21.js => notes_typescript_basic.md.7f81406b.js} (99%)
 rename assets/{notes_typescript_basic.md.75a51f21.lean.js => notes_typescript_basic.md.7f81406b.lean.js} (71%)
 rename assets/{notes_typescript_lib-struct.md.04de5da6.js => notes_typescript_lib-struct.md.214381a8.js} (99%)
 rename assets/{notes_typescript_lib-struct.md.04de5da6.lean.js => notes_typescript_lib-struct.md.214381a8.lean.js} (73%)
 rename assets/{source-code_index.md.3b974e67.js => source-code_index.md.c3b56127.js} (88%)
 rename assets/{source-code_index.md.3b974e67.lean.js => source-code_index.md.c3b56127.lean.js} (88%)
 rename assets/{source-code_react_api_context.md.f71ef236.js => source-code_react_api_context.md.cb6576d9.js} (99%)
 rename assets/{source-code_react_api_context.md.f71ef236.lean.js => source-code_react_api_context.md.cb6576d9.lean.js} (72%)
 rename assets/{source-code_react_api_ref.md.041146b3.js => source-code_react_api_ref.md.955d1f79.js} (98%)
 rename assets/{source-code_react_api_ref.md.041146b3.lean.js => source-code_react_api_ref.md.955d1f79.lean.js} (71%)
 rename assets/{source-code_vue_index.md.55141804.lean.js => source-code_vue_index.md.59347e5f.js} (88%)
 rename assets/{source-code_vue_index.md.55141804.js => source-code_vue_index.md.59347e5f.lean.js} (88%)
 delete mode 100644 assets/style.1381d0e1.css
 create mode 100644 assets/style.9a9f46c7.css

diff --git a/404.html b/404.html
index d43a903..0c78d08 100644
--- a/404.html
+++ b/404.html
@@ -5,17 +5,17 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>404 | LEARNING DOCS</title>
     <meta name="description" content="Not Found">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav fixed reached-top" data-v-5a346dfe data-v-79c8c1df><!----><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><!----><div class="VPContent" id="VPContent" data-v-5a346dfe data-v-669faec9><!--[--><div class="NotFound" data-v-669faec9 data-v-f87ff6e4><p class="code" data-v-f87ff6e4>404</p><h1 class="title" data-v-f87ff6e4>PAGE NOT FOUND</h1><div class="divider" data-v-f87ff6e4></div><blockquote class="quote" data-v-f87ff6e4>But if you don&#39;t change your direction, and if you keep looking, you may end up where you are heading.</blockquote><div class="action" data-v-f87ff6e4><a class="link" href="/learning-docs2/" aria-label="go to home" data-v-f87ff6e4>Take me home</a></div></div><!--]--></div><footer class="VPFooter" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav fixed reached-top" data-v-5a346dfe data-v-79c8c1df><!----><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><!----><div class="VPContent" id="VPContent" data-v-5a346dfe data-v-669faec9><!--[--><div class="NotFound" data-v-669faec9 data-v-f87ff6e4><p class="code" data-v-f87ff6e4>404</p><h1 class="title" data-v-f87ff6e4>PAGE NOT FOUND</h1><div class="divider" data-v-f87ff6e4></div><blockquote class="quote" data-v-f87ff6e4>But if you don&#39;t change your direction, and if you keep looking, you may end up where you are heading.</blockquote><div class="action" data-v-f87ff6e4><a class="link" href="/" aria-label="go to home" data-v-f87ff6e4>Take me home</a></div></div><!--]--></div><footer class="VPFooter" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/CNAME b/CNAME
deleted file mode 100644
index 6b8ed76..0000000
--- a/CNAME
+++ /dev/null
@@ -1 +0,0 @@
-liueng.fun
\ No newline at end of file
diff --git a/alogrithm/basic/O.html b/alogrithm/basic/O.html
index 0c7a297..6689d53 100644
--- a/alogrithm/basic/O.html
+++ b/alogrithm/basic/O.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>大 O 表示法 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/alogrithm_basic_O.md.efeb357c.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/alogrithm_basic_O.md.7641dd85.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_alogrithm_basic_O" data-v-6b87e69f><div><h1 id="大-o-表示法" tabindex="-1">大 O 表示法 <a class="header-anchor" href="#大-o-表示法" aria-label="Permalink to &quot;大 O 表示法&quot;">​</a></h1><ul><li><p>所有代码执行的时间 T(n)与每行代码执行次数 n 成正比</p><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">T(n) = O(f(n))</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">T(n) = O(f(n))</span></span></code></pre></div></li></ul><h2 id="时间复杂度" tabindex="-1">时间复杂度 <a class="header-anchor" href="#时间复杂度" aria-label="Permalink to &quot;时间复杂度&quot;">​</a></h2><p><code>大O表示的并不是程序执行的时间，而是代码执行时间随着数据增长的变化趋势，渐进时间复杂度</code></p><ol><li>只关注循环最多的那一段代码</li><li>加法法则：总复杂度等于量级最大的那段代码的复杂度</li><li>乘法法则：嵌套代码的复杂度等于嵌套内外复杂度的乘积</li></ol><img src="/learning-docs2/assets/images/time-complex.jpg" alt="时间复杂度图"><h2 id="空间复杂度" tabindex="-1">空间复杂度 <a class="header-anchor" href="#空间复杂度" aria-label="Permalink to &quot;空间复杂度&quot;">​</a></h2><p><code>算法的执行时间与数据规模之间的增长关系，渐进空间复杂度</code></p><img src="/learning-docs2/assets/images/f(n).jpg" alt="时间复杂度图"><ul><li>最好情况时间复杂度</li><li>最坏情况时间复杂度</li><li>平均情况时间复杂度</li><li>均摊时间复杂度</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/alogrithm/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前言</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/alogrithm/basic/bit.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>位运算</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _alogrithm_basic_O" data-v-6b87e69f><div><h1 id="大-o-表示法" tabindex="-1">大 O 表示法 <a class="header-anchor" href="#大-o-表示法" aria-label="Permalink to &quot;大 O 表示法&quot;">​</a></h1><ul><li><p>所有代码执行的时间 T(n)与每行代码执行次数 n 成正比</p><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">T(n) = O(f(n))</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">T(n) = O(f(n))</span></span></code></pre></div></li></ul><h2 id="时间复杂度" tabindex="-1">时间复杂度 <a class="header-anchor" href="#时间复杂度" aria-label="Permalink to &quot;时间复杂度&quot;">​</a></h2><p><code>大O表示的并不是程序执行的时间，而是代码执行时间随着数据增长的变化趋势，渐进时间复杂度</code></p><ol><li>只关注循环最多的那一段代码</li><li>加法法则：总复杂度等于量级最大的那段代码的复杂度</li><li>乘法法则：嵌套代码的复杂度等于嵌套内外复杂度的乘积</li></ol><img src="/assets/images/time-complex.jpg" alt="时间复杂度图"><h2 id="空间复杂度" tabindex="-1">空间复杂度 <a class="header-anchor" href="#空间复杂度" aria-label="Permalink to &quot;空间复杂度&quot;">​</a></h2><p><code>算法的执行时间与数据规模之间的增长关系，渐进空间复杂度</code></p><img src="/assets/images/f(n).jpg" alt="时间复杂度图"><ul><li>最好情况时间复杂度</li><li>最坏情况时间复杂度</li><li>平均情况时间复杂度</li><li>均摊时间复杂度</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/alogrithm/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前言</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/alogrithm/basic/bit.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>位运算</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/alogrithm/basic/bit.html b/alogrithm/basic/bit.html
index 24f16b3..47b2f07 100644
--- a/alogrithm/basic/bit.html
+++ b/alogrithm/basic/bit.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>位运算 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/alogrithm_basic_bit.md.1b0e2756.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/alogrithm_basic_bit.md.f90bc13d.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_alogrithm_basic_bit" data-v-6b87e69f><div><h1 id="位运算" tabindex="-1">位运算 <a class="header-anchor" href="#位运算" aria-label="Permalink to &quot;位运算&quot;">​</a></h1><p>计算内存中二进制处理运算</p><h2 id="常用的位运算操作" tabindex="-1">常用的位运算操作 <a class="header-anchor" href="#常用的位运算操作" aria-label="Permalink to &quot;常用的位运算操作&quot;">​</a></h2><ul><li>x &amp; 1 == 1 OR 0 (判断奇偶)</li><li>x = x &amp; (x - 1) (清零最低位的 1)</li><li>x &amp; -x (得到最低位的 1)</li></ul><h2 id="复杂的位运算操作" tabindex="-1">复杂的位运算操作 <a class="header-anchor" href="#复杂的位运算操作" aria-label="Permalink to &quot;复杂的位运算操作&quot;">​</a></h2><img src="/learning-docs2/assets/images/bit_complex.jpg" alt="复杂的位运算操作图"></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/alogrithm/basic/O.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>大(O)表示法</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/alogrithm/basic/red_black_tree.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>红黑树</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _alogrithm_basic_bit" data-v-6b87e69f><div><h1 id="位运算" tabindex="-1">位运算 <a class="header-anchor" href="#位运算" aria-label="Permalink to &quot;位运算&quot;">​</a></h1><p>计算内存中二进制处理运算</p><h2 id="常用的位运算操作" tabindex="-1">常用的位运算操作 <a class="header-anchor" href="#常用的位运算操作" aria-label="Permalink to &quot;常用的位运算操作&quot;">​</a></h2><ul><li>x &amp; 1 == 1 OR 0 (判断奇偶)</li><li>x = x &amp; (x - 1) (清零最低位的 1)</li><li>x &amp; -x (得到最低位的 1)</li></ul><h2 id="复杂的位运算操作" tabindex="-1">复杂的位运算操作 <a class="header-anchor" href="#复杂的位运算操作" aria-label="Permalink to &quot;复杂的位运算操作&quot;">​</a></h2><img src="/assets/images/bit_complex.jpg" alt="复杂的位运算操作图"></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/alogrithm/basic/O.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>大(O)表示法</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/alogrithm/basic/red_black_tree.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>红黑树</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/alogrithm/basic/red_black_tree.html b/alogrithm/basic/red_black_tree.html
index 388d1a1..a5c7cb7 100644
--- a/alogrithm/basic/red_black_tree.html
+++ b/alogrithm/basic/red_black_tree.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>红黑树 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/alogrithm_basic_red_black_tree.md.1fb89df7.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/alogrithm_basic_red_black_tree.md.55eb2555.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_alogrithm_basic_red_black_tree" data-v-6b87e69f><div><h1 id="红黑树" tabindex="-1">红黑树 <a class="header-anchor" href="#红黑树" aria-label="Permalink to &quot;红黑树&quot;">​</a></h1><p>红黑树（Red-Black-Tree）</p><h2 id="特点" tabindex="-1">特点 <a class="header-anchor" href="#特点" aria-label="Permalink to &quot;特点&quot;">​</a></h2><ol><li>根节点必须是黑色的</li><li>每个叶子节点都是黑色的空节点</li><li>红色节点不能相邻</li><li>从该节点到可达节点的路径上的黑色节点数量相等</li></ol><h2 id="实现" tabindex="-1">实现 <a class="header-anchor" href="#实现" aria-label="Permalink to &quot;实现&quot;">​</a></h2><p>左旋、右旋（四种情况）</p><ol><li>三个节点呈右节点形式 right right 着色</li></ol><div class="language-md vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">1</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _alogrithm_basic_red_black_tree" data-v-6b87e69f><div><h1 id="红黑树" tabindex="-1">红黑树 <a class="header-anchor" href="#红黑树" aria-label="Permalink to &quot;红黑树&quot;">​</a></h1><p>红黑树（Red-Black-Tree）</p><h2 id="特点" tabindex="-1">特点 <a class="header-anchor" href="#特点" aria-label="Permalink to &quot;特点&quot;">​</a></h2><ol><li>根节点必须是黑色的</li><li>每个叶子节点都是黑色的空节点</li><li>红色节点不能相邻</li><li>从该节点到可达节点的路径上的黑色节点数量相等</li></ol><h2 id="实现" tabindex="-1">实现 <a class="header-anchor" href="#实现" aria-label="Permalink to &quot;实现&quot;">​</a></h2><p>左旋、右旋（四种情况）</p><ol><li>三个节点呈右节点形式 right right 着色</li></ol><div class="language-md vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">1</span></span>
 <span class="line"><span style="color:#E1E4E8;">  2</span></span>
 <span class="line"><span style="color:#E1E4E8;">    3</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">1</span></span>
 <span class="line"><span style="color:#24292E;">  2</span></span>
@@ -33,8 +33,8 @@
 <span class="line"><span style="color:#E1E4E8;">1</span></span>
 <span class="line"><span style="color:#E1E4E8;">  2</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">  3</span></span>
 <span class="line"><span style="color:#24292E;">1</span></span>
-<span class="line"><span style="color:#24292E;">  2</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-04-14T08:34:55.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/alogrithm/basic/bit.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>位运算</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/alogrithm/interview/self.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>数据结构辅助记忆</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">  2</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-04-14T08:34:55.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/alogrithm/basic/bit.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>位运算</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/alogrithm/interview/self.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>数据结构辅助记忆</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/alogrithm/index.html b/alogrithm/index.html
index b727da7..d6c5e18 100644
--- a/alogrithm/index.html
+++ b/alogrithm/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>开启之路 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/alogrithm_index.md.2b9ae594.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/alogrithm_index.md.67f8b108.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_alogrithm_" data-v-6b87e69f><div><h1 id="开启之路" tabindex="-1">开启之路 <a class="header-anchor" href="#开启之路" aria-label="Permalink to &quot;开启之路&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">算法</p><p>数据结构有限，算法无限</p></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/alogrithm/basic/O.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>大(O)表示法</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _alogrithm_" data-v-6b87e69f><div><h1 id="开启之路" tabindex="-1">开启之路 <a class="header-anchor" href="#开启之路" aria-label="Permalink to &quot;开启之路&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">算法</p><p>数据结构有限，算法无限</p></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/alogrithm/basic/O.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>大(O)表示法</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/alogrithm/interview/self.html b/alogrithm/interview/self.html
index b4911e8..5b784e1 100644
--- a/alogrithm/interview/self.html
+++ b/alogrithm/interview/self.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>数据结构辅助记忆 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/alogrithm_interview_self.md.f2953867.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/alogrithm_interview_self.md.c8309eff.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_alogrithm_interview_self" data-v-6b87e69f><div><h1 id="数据结构辅助记忆" tabindex="-1">数据结构辅助记忆 <a class="header-anchor" href="#数据结构辅助记忆" aria-label="Permalink to &quot;数据结构辅助记忆&quot;">​</a></h1><blockquote><p>适合自己的数据结构与算法的记忆方法</p></blockquote><h2 id="常见的数据结构" tabindex="-1">常见的数据结构 <a class="header-anchor" href="#常见的数据结构" aria-label="Permalink to &quot;常见的数据结构&quot;">​</a></h2><h3 id="堆" tabindex="-1">堆 <a class="header-anchor" href="#堆" aria-label="Permalink to &quot;堆&quot;">​</a></h3><p>小顶堆 大顶堆</p><ul><li>数组存储</li><li>左字节点下标 i 对应的父节点为 2 * i + 1</li><li>右字节点下标 i 对应的父节点为 2 * i + 2</li><li>建堆 <ul><li>自下向顶（递归父节点）</li><li>自顶向下（递归左右子节点）</li></ul></li><li>删除 <ul><li>删除的元素（相同的元素）</li><li>最后一个元素替换删除元素</li><li>重新建堆 <ul><li>没有左节点 自下向顶</li><li>有左节点且（没有父节点或者当前删除的节点与父节点比较）自顶向下</li></ul></li></ul></li><li>实例方法 <ul><li>insert</li><li>delete</li><li>find</li></ul></li><li>堆排序 <ul><li>每次取堆顶元素，重新向下建堆</li><li>直到堆为空</li></ul></li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 建堆</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>算法篇</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前言</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/O.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>大(O)表示法</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/bit.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>位运算</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/basic/red_black_tree.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>红黑树</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试算法</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/alogrithm/interview/self.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>数据结构辅助记忆</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _alogrithm_interview_self" data-v-6b87e69f><div><h1 id="数据结构辅助记忆" tabindex="-1">数据结构辅助记忆 <a class="header-anchor" href="#数据结构辅助记忆" aria-label="Permalink to &quot;数据结构辅助记忆&quot;">​</a></h1><blockquote><p>适合自己的数据结构与算法的记忆方法</p></blockquote><h2 id="常见的数据结构" tabindex="-1">常见的数据结构 <a class="header-anchor" href="#常见的数据结构" aria-label="Permalink to &quot;常见的数据结构&quot;">​</a></h2><h3 id="堆" tabindex="-1">堆 <a class="header-anchor" href="#堆" aria-label="Permalink to &quot;堆&quot;">​</a></h3><p>小顶堆 大顶堆</p><ul><li>数组存储</li><li>左字节点下标 i 对应的父节点为 2 * i + 1</li><li>右字节点下标 i 对应的父节点为 2 * i + 2</li><li>建堆 <ul><li>自下向顶（递归父节点）</li><li>自顶向下（递归左右子节点）</li></ul></li><li>删除 <ul><li>删除的元素（相同的元素）</li><li>最后一个元素替换删除元素</li><li>重新建堆 <ul><li>没有左节点 自下向顶</li><li>有左节点且（没有父节点或者当前删除的节点与父节点比较）自顶向下</li></ul></li></ul></li><li>实例方法 <ul><li>insert</li><li>delete</li><li>find</li></ul></li><li>堆排序 <ul><li>每次取堆顶元素，重新向下建堆</li><li>直到堆为空</li></ul></li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 建堆</span></span>
 <span class="line"><span style="color:#F97583;">class</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">Heap</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">add</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">v</span><span style="color:#E1E4E8;">) {}</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">remove</span><span style="color:#E1E4E8;">() {},</span></span>
@@ -63,8 +63,8 @@
 <span class="line"></span>
 <span class="line"><span style="color:#24292E;">  prevNode </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> currNode;</span></span>
 <span class="line"><span style="color:#24292E;">  currNode </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> nextNode;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h3 id="树" tabindex="-1">树 <a class="header-anchor" href="#树" aria-label="Permalink to &quot;树&quot;">​</a></h3><p>二叉树</p><ul><li>BinarySearchTree <ul><li>insert</li><li>contains</li><li>remove</li><li>toString</li></ul></li><li>BinarySearchTreeNode <ul><li>insert</li><li>find</li><li>contains</li><li>remove</li><li>findMin</li></ul></li><li>BinaryTreeNode <ul><li>get leftHeight</li><li>get rightHeight</li><li>get height</li><li>get balanceFactor</li><li>get uncle</li><li>setValue</li><li>setLeft</li><li>setRight</li><li>removeChild</li><li>replaceChild</li><li>static copyNode</li><li>traverseInOrder</li><li>toString</li></ul></li></ul><h4 id="注意点" tabindex="-1">注意点 <a class="header-anchor" href="#注意点" aria-label="Permalink to &quot;注意点&quot;">​</a></h4><ul><li>删除节点 <ul><li>存在左右节点 <ul><li>右节点需要寻找最小节点作为当前删除节点</li></ul></li><li>不存在左右节点</li><li>存在其中一个节点（左右）</li></ul></li><li>遍历 <ul><li>前序遍历（根 左 右）</li><li>中序遍历（左 根 右）</li><li>后续遍历（左 右 根）</li></ul></li><li>计算当前节点的高度 <ul><li>递归寻找</li></ul></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-09-12T03:45:11.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/alogrithm/basic/red_black_tree.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>红黑树</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h3 id="树" tabindex="-1">树 <a class="header-anchor" href="#树" aria-label="Permalink to &quot;树&quot;">​</a></h3><p>二叉树</p><ul><li>BinarySearchTree <ul><li>insert</li><li>contains</li><li>remove</li><li>toString</li></ul></li><li>BinarySearchTreeNode <ul><li>insert</li><li>find</li><li>contains</li><li>remove</li><li>findMin</li></ul></li><li>BinaryTreeNode <ul><li>get leftHeight</li><li>get rightHeight</li><li>get height</li><li>get balanceFactor</li><li>get uncle</li><li>setValue</li><li>setLeft</li><li>setRight</li><li>removeChild</li><li>replaceChild</li><li>static copyNode</li><li>traverseInOrder</li><li>toString</li></ul></li></ul><h4 id="注意点" tabindex="-1">注意点 <a class="header-anchor" href="#注意点" aria-label="Permalink to &quot;注意点&quot;">​</a></h4><ul><li>删除节点 <ul><li>存在左右节点 <ul><li>右节点需要寻找最小节点作为当前删除节点</li></ul></li><li>不存在左右节点</li><li>存在其中一个节点（左右）</li></ul></li><li>遍历 <ul><li>前序遍历（根 左 右）</li><li>中序遍历（左 根 右）</li><li>后续遍历（左 右 根）</li></ul></li><li>计算当前节点的高度 <ul><li>递归寻找</li></ul></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-09-12T03:45:11.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/alogrithm/basic/red_black_tree.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>红黑树</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/architecture/index.html b/architecture/index.html
index e04e7cf..c3ff800 100644
--- a/architecture/index.html
+++ b/architecture/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>架构 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/architecture_index.md.d9230efd.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/architecture_index.md.678a0502.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_architecture_" data-v-6b87e69f><div><h1 id="架构" tabindex="-1">架构 <a class="header-anchor" href="#架构" aria-label="Permalink to &quot;架构&quot;">​</a></h1><blockquote><p>开始对前端架构的思考</p></blockquote><p><code>前端不止于技术，如何系统化，全方位串联起来，需要认真的思考。</code></p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>标准 - 模板1</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _architecture_" data-v-6b87e69f><div><h1 id="架构" tabindex="-1">架构 <a class="header-anchor" href="#架构" aria-label="Permalink to &quot;架构&quot;">​</a></h1><blockquote><p>开始对前端架构的思考</p></blockquote><p><code>前端不止于技术，如何系统化，全方位串联起来，需要认真的思考。</code></p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/architecture/standard/A-YZ.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>标准 - 模板1</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/architecture/standard/A-YZ.html b/architecture/standard/A-YZ.html
index f198bac..3185d2b 100644
--- a/architecture/standard/A-YZ.html
+++ b/architecture/standard/A-YZ.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>A-YZ | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/architecture_standard_A-YZ.md.bd642461.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/architecture_standard_A-YZ.md.a0e51b94.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_architecture_standard_A-YZ" data-v-6b87e69f><div><h1 id="a-yz" tabindex="-1">A-YZ <a class="header-anchor" href="#a-yz" aria-label="Permalink to &quot;A-YZ&quot;">​</a></h1><p><strong>Node 技术框架：业务层、基础框架层、通用组件、基础服务组件</strong></p><ol><li>针对整个业务层的 UI 自动化，核心接口，页面检测</li><li>针对 client 层的 sentry 报警</li><li>针对 server 层的接口测试、业务报警</li><li>针对基础框架和通用组件的单元测试</li><li>针对通用组件变更的版本变更报警</li><li>针对线上发布的流程规范、用例维护</li></ol><h3 id="ui-自动化" tabindex="-1">UI 自动化 <a class="header-anchor" href="#ui-自动化" aria-label="Permalink to &quot;UI 自动化&quot;">​</a></h3><p>[1] 框架选择</p><p><code>puppeteer + mocha + mochawesome</code></p><p>[2] 脚本编写</p><p><code>封装基础库 + 业务用例</code></p><p>[3] 执行逻辑</p><p><code>分环境执行 + 监控源码变更（gitlab webhook） + 每日定时执行</code></p><h3 id="接口测试" tabindex="-1">接口测试 <a class="header-anchor" href="#接口测试" aria-label="Permalink to &quot;接口测试&quot;">​</a></h3><p><code>istanbul jenkins 持续集成自动构建</code></p><h3 id="单元测试" tabindex="-1">单元测试 <a class="header-anchor" href="#单元测试" aria-label="Permalink to &quot;单元测试&quot;">​</a></h3><p><code>jest</code></p><h3 id="基础库变更报警" tabindex="-1">基础库变更报警 <a class="header-anchor" href="#基础库变更报警" aria-label="Permalink to &quot;基础库变更报警&quot;">​</a></h3><p><code>邮件发送变更</code></p><h3 id="sentry-报警" tabindex="-1">sentry 报警 <a class="header-anchor" href="#sentry-报警" aria-label="Permalink to &quot;sentry 报警&quot;">​</a></h3><h3 id="业务报警" tabindex="-1">业务报警 <a class="header-anchor" href="#业务报警" aria-label="Permalink to &quot;业务报警&quot;">​</a></h3><h3 id="约定规范" tabindex="-1">约定规范 <a class="header-anchor" href="#约定规范" aria-label="Permalink to &quot;约定规范&quot;">​</a></h3></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/architecture/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>思考</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>组件化与模块化</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _architecture_standard_A-YZ" data-v-6b87e69f><div><h1 id="a-yz" tabindex="-1">A-YZ <a class="header-anchor" href="#a-yz" aria-label="Permalink to &quot;A-YZ&quot;">​</a></h1><p><strong>Node 技术框架：业务层、基础框架层、通用组件、基础服务组件</strong></p><ol><li>针对整个业务层的 UI 自动化，核心接口，页面检测</li><li>针对 client 层的 sentry 报警</li><li>针对 server 层的接口测试、业务报警</li><li>针对基础框架和通用组件的单元测试</li><li>针对通用组件变更的版本变更报警</li><li>针对线上发布的流程规范、用例维护</li></ol><h3 id="ui-自动化" tabindex="-1">UI 自动化 <a class="header-anchor" href="#ui-自动化" aria-label="Permalink to &quot;UI 自动化&quot;">​</a></h3><p>[1] 框架选择</p><p><code>puppeteer + mocha + mochawesome</code></p><p>[2] 脚本编写</p><p><code>封装基础库 + 业务用例</code></p><p>[3] 执行逻辑</p><p><code>分环境执行 + 监控源码变更（gitlab webhook） + 每日定时执行</code></p><h3 id="接口测试" tabindex="-1">接口测试 <a class="header-anchor" href="#接口测试" aria-label="Permalink to &quot;接口测试&quot;">​</a></h3><p><code>istanbul jenkins 持续集成自动构建</code></p><h3 id="单元测试" tabindex="-1">单元测试 <a class="header-anchor" href="#单元测试" aria-label="Permalink to &quot;单元测试&quot;">​</a></h3><p><code>jest</code></p><h3 id="基础库变更报警" tabindex="-1">基础库变更报警 <a class="header-anchor" href="#基础库变更报警" aria-label="Permalink to &quot;基础库变更报警&quot;">​</a></h3><p><code>邮件发送变更</code></p><h3 id="sentry-报警" tabindex="-1">sentry 报警 <a class="header-anchor" href="#sentry-报警" aria-label="Permalink to &quot;sentry 报警&quot;">​</a></h3><h3 id="业务报警" tabindex="-1">业务报警 <a class="header-anchor" href="#业务报警" aria-label="Permalink to &quot;业务报警&quot;">​</a></h3><h3 id="约定规范" tabindex="-1">约定规范 <a class="header-anchor" href="#约定规范" aria-label="Permalink to &quot;约定规范&quot;">​</a></h3></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/architecture/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>思考</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/architecture/standard/comp-mod.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>组件化与模块化</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/architecture/standard/comp-mod.html b/architecture/standard/comp-mod.html
index 9db0781..f798537 100644
--- a/architecture/standard/comp-mod.html
+++ b/architecture/standard/comp-mod.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>组件化与模块化设计 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/architecture_standard_comp-mod.md.f6f9cedd.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/architecture_standard_comp-mod.md.e027bdb0.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_architecture_standard_comp-mod" data-v-6b87e69f><div><h1 id="组件化与模块化设计" tabindex="-1">组件化与模块化设计 <a class="header-anchor" href="#组件化与模块化设计" aria-label="Permalink to &quot;组件化与模块化设计&quot;">​</a></h1><h2 id="模块化设计" tabindex="-1">模块化设计 <a class="header-anchor" href="#模块化设计" aria-label="Permalink to &quot;模块化设计&quot;">​</a></h2><h3 id="应用的模块与层级划分" tabindex="-1">应用的模块与层级划分 <a class="header-anchor" href="#应用的模块与层级划分" aria-label="Permalink to &quot;应用的模块与层级划分&quot;">​</a></h3><ul><li>对于简单的管理端应用，可以采用类似MVC结构进行拆分（视图模块、数据模块、逻辑控制模块）</li><li>对于页面内容丰富的应用，可以结合业务进行细分和组件拆分（核心模块、功能模块、公共组件）</li><li>对于交互和逻辑复杂的应用，可以根据系统架构将应用进行模块和层级的划分（渲染层、数据层、网络层）</li></ul><h3 id="模块划分与设计原则" tabindex="-1">模块划分与设计原则 <a class="header-anchor" href="#模块划分与设计原则" aria-label="Permalink to &quot;模块划分与设计原则&quot;">​</a></h3><ul><li>领域驱动设计（Domain-Driven Design DDD）：从业务领域的角度来对系统进行领域划分和建模</li><li>职责驱动设计（Responsibility-Driven Design RDD）：从系统内部的角度来进行职责划分，模块拆分以及协作方式</li></ul><h3 id="如何进行模块间依赖的解耦" tabindex="-1">如何进行模块间依赖的解耦 <a class="header-anchor" href="#如何进行模块间依赖的解耦" aria-label="Permalink to &quot;如何进行模块间依赖的解耦&quot;">​</a></h3><p><code>高内聚 低耦合</code></p><ul><li>低耦合基于抽象，使系统更具模块化，不相关的事物不应相互依赖</li><li>高内聚则意味着对象专注于单一职责</li></ul><p><code>依赖倒置</code></p><ul><li>高层次的模块不应该依赖低层次的模块，两者都应该依赖于抽象接口</li><li>抽象接口不应该依赖于具体实现，而具体实现则依赖于抽象接口</li></ul><p><code>事件驱动</code></p><ul><li>Nodejs 的 Event/Emitter</li></ul><h2 id="组件化设计" tabindex="-1">组件化设计 <a class="header-anchor" href="#组件化设计" aria-label="Permalink to &quot;组件化设计&quot;">​</a></h2><h3 id="组件划分" tabindex="-1">组件划分 <a class="header-anchor" href="#组件划分" aria-label="Permalink to &quot;组件划分&quot;">​</a></h3><ul><li>代码复用划分</li><li>视觉和交互划分</li></ul><h3 id="组件封装" tabindex="-1">组件封装 <a class="header-anchor" href="#组件封装" aria-label="Permalink to &quot;组件封装&quot;">​</a></h3><ul><li>组件内维护自身的数据和状态</li><li>组件内维护自身的事件</li><li>对外提供配置接口，控制展示以及具体功能</li><li>对外提供查询接口，获取组件的状态和数据</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>标准 - 模板1</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/architecture/standard/monitor.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>前端监控</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _architecture_standard_comp-mod" data-v-6b87e69f><div><h1 id="组件化与模块化设计" tabindex="-1">组件化与模块化设计 <a class="header-anchor" href="#组件化与模块化设计" aria-label="Permalink to &quot;组件化与模块化设计&quot;">​</a></h1><h2 id="模块化设计" tabindex="-1">模块化设计 <a class="header-anchor" href="#模块化设计" aria-label="Permalink to &quot;模块化设计&quot;">​</a></h2><h3 id="应用的模块与层级划分" tabindex="-1">应用的模块与层级划分 <a class="header-anchor" href="#应用的模块与层级划分" aria-label="Permalink to &quot;应用的模块与层级划分&quot;">​</a></h3><ul><li>对于简单的管理端应用，可以采用类似MVC结构进行拆分（视图模块、数据模块、逻辑控制模块）</li><li>对于页面内容丰富的应用，可以结合业务进行细分和组件拆分（核心模块、功能模块、公共组件）</li><li>对于交互和逻辑复杂的应用，可以根据系统架构将应用进行模块和层级的划分（渲染层、数据层、网络层）</li></ul><h3 id="模块划分与设计原则" tabindex="-1">模块划分与设计原则 <a class="header-anchor" href="#模块划分与设计原则" aria-label="Permalink to &quot;模块划分与设计原则&quot;">​</a></h3><ul><li>领域驱动设计（Domain-Driven Design DDD）：从业务领域的角度来对系统进行领域划分和建模</li><li>职责驱动设计（Responsibility-Driven Design RDD）：从系统内部的角度来进行职责划分，模块拆分以及协作方式</li></ul><h3 id="如何进行模块间依赖的解耦" tabindex="-1">如何进行模块间依赖的解耦 <a class="header-anchor" href="#如何进行模块间依赖的解耦" aria-label="Permalink to &quot;如何进行模块间依赖的解耦&quot;">​</a></h3><p><code>高内聚 低耦合</code></p><ul><li>低耦合基于抽象，使系统更具模块化，不相关的事物不应相互依赖</li><li>高内聚则意味着对象专注于单一职责</li></ul><p><code>依赖倒置</code></p><ul><li>高层次的模块不应该依赖低层次的模块，两者都应该依赖于抽象接口</li><li>抽象接口不应该依赖于具体实现，而具体实现则依赖于抽象接口</li></ul><p><code>事件驱动</code></p><ul><li>Nodejs 的 Event/Emitter</li></ul><h2 id="组件化设计" tabindex="-1">组件化设计 <a class="header-anchor" href="#组件化设计" aria-label="Permalink to &quot;组件化设计&quot;">​</a></h2><h3 id="组件划分" tabindex="-1">组件划分 <a class="header-anchor" href="#组件划分" aria-label="Permalink to &quot;组件划分&quot;">​</a></h3><ul><li>代码复用划分</li><li>视觉和交互划分</li></ul><h3 id="组件封装" tabindex="-1">组件封装 <a class="header-anchor" href="#组件封装" aria-label="Permalink to &quot;组件封装&quot;">​</a></h3><ul><li>组件内维护自身的数据和状态</li><li>组件内维护自身的事件</li><li>对外提供配置接口，控制展示以及具体功能</li><li>对外提供查询接口，获取组件的状态和数据</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/architecture/standard/A-YZ.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>标准 - 模板1</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/architecture/standard/monitor.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>前端监控</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/architecture/standard/monitor.html b/architecture/standard/monitor.html
index ef7f9e0..68cb7c0 100644
--- a/architecture/standard/monitor.html
+++ b/architecture/standard/monitor.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>前端监控体系 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/architecture_standard_monitor.md.ff5a8411.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/architecture_standard_monitor.md.6a6f7341.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_architecture_standard_monitor" data-v-6b87e69f><div><h1 id="前端监控体系" tabindex="-1">前端监控体系 <a class="header-anchor" href="#前端监控体系" aria-label="Permalink to &quot;前端监控体系&quot;">​</a></h1><p>如何搭建一个前端监控体系</p><h2 id="为什么" tabindex="-1">为什么 <a class="header-anchor" href="#为什么" aria-label="Permalink to &quot;为什么&quot;">​</a></h2><ol><li>如何及时发现问题</li><li>如何快速定位并解决问题</li></ol><h2 id="监控内容" tabindex="-1">监控内容 <a class="header-anchor" href="#监控内容" aria-label="Permalink to &quot;监控内容&quot;">​</a></h2><ul><li>页面的整体访问情况，包括常见的 PV（page view）、UV（user view）、用户操作行为</li><li>页面的性能情况，包括页面加载耗时、接口耗时等各项数据统计</li></ul><h2 id="数据埋点与收集" tabindex="-1">数据埋点与收集 <a class="header-anchor" href="#数据埋点与收集" aria-label="Permalink to &quot;数据埋点与收集&quot;">​</a></h2><p>页面访问速度、页面稳定性/异常、外部调用服务情况</p><ol><li>系统的生命周期数据，（页面性能、整体访问）</li><li>HTTP 测试数据（外部服务调用、页面性能优化）</li><li>系统异常（系统稳定性、系统异常）</li><li>用户行为数据（页面稳定性、整体访问）</li><li>用户日志（反馈问题排查）</li></ol><h3 id="系统生命周期" tabindex="-1">系统生命周期 <a class="header-anchor" href="#系统生命周期" aria-label="Permalink to &quot;系统生命周期&quot;">​</a></h3><p><code>PerformanceTiming</code></p><ul><li>navigationstart、unloadEventStart/unloadEventEnd</li><li>domLoading、domInteractive、domContentLoadedEventStart/domContentLoadedEventEnd、loadEventStart/loadEventEnd</li></ul><p><code>document</code> 监听事件</p><ul><li>DOMContentLoaded</li><li>readystatechange</li><li>MutationObserver</li></ul><p><code>框架带有自身的生命周期</code></p><h3 id="系统异常" tabindex="-1">系统异常 <a class="header-anchor" href="#系统异常" aria-label="Permalink to &quot;系统异常&quot;">​</a></h3><ul><li>window.onerror</li><li>document.addEventListener(&#39;error&#39;)</li><li>xhr status</li></ul><h3 id="用户日志" tabindex="-1">用户日志 <a class="header-anchor" href="#用户日志" aria-label="Permalink to &quot;用户日志&quot;">​</a></h3><ul><li>类装饰器</li><li>类方法劫持</li></ul><h3 id="数据上报" tabindex="-1">数据上报 <a class="header-anchor" href="#数据上报" aria-label="Permalink to &quot;数据上报&quot;">​</a></h3><ul><li>定期/定量上报</li><li>关键生命周期上报</li><li>用户主动提交</li></ul><h3 id="数据监控" tabindex="-1">数据监控 <a class="header-anchor" href="#数据监控" aria-label="Permalink to &quot;数据监控&quot;">​</a></h3><ul><li>错误告警是否有新增错误，可通过报错内容找到报错位置修复</li><li>全版本监控观察：整体的功能点覆盖曲线是否正常，已否有异常涨跌</li><li>分版本监控观察：新版本是否所有功都能正常访问、灰度占比是否正常、新旧版本的转化率是否一致</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>组件化与模块化</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/architecture/standard/performance.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>前端性能</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _architecture_standard_monitor" data-v-6b87e69f><div><h1 id="前端监控体系" tabindex="-1">前端监控体系 <a class="header-anchor" href="#前端监控体系" aria-label="Permalink to &quot;前端监控体系&quot;">​</a></h1><p>如何搭建一个前端监控体系</p><h2 id="为什么" tabindex="-1">为什么 <a class="header-anchor" href="#为什么" aria-label="Permalink to &quot;为什么&quot;">​</a></h2><ol><li>如何及时发现问题</li><li>如何快速定位并解决问题</li></ol><h2 id="监控内容" tabindex="-1">监控内容 <a class="header-anchor" href="#监控内容" aria-label="Permalink to &quot;监控内容&quot;">​</a></h2><ul><li>页面的整体访问情况，包括常见的 PV（page view）、UV（user view）、用户操作行为</li><li>页面的性能情况，包括页面加载耗时、接口耗时等各项数据统计</li></ul><h2 id="数据埋点与收集" tabindex="-1">数据埋点与收集 <a class="header-anchor" href="#数据埋点与收集" aria-label="Permalink to &quot;数据埋点与收集&quot;">​</a></h2><p>页面访问速度、页面稳定性/异常、外部调用服务情况</p><ol><li>系统的生命周期数据，（页面性能、整体访问）</li><li>HTTP 测试数据（外部服务调用、页面性能优化）</li><li>系统异常（系统稳定性、系统异常）</li><li>用户行为数据（页面稳定性、整体访问）</li><li>用户日志（反馈问题排查）</li></ol><h3 id="系统生命周期" tabindex="-1">系统生命周期 <a class="header-anchor" href="#系统生命周期" aria-label="Permalink to &quot;系统生命周期&quot;">​</a></h3><p><code>PerformanceTiming</code></p><ul><li>navigationstart、unloadEventStart/unloadEventEnd</li><li>domLoading、domInteractive、domContentLoadedEventStart/domContentLoadedEventEnd、loadEventStart/loadEventEnd</li></ul><p><code>document</code> 监听事件</p><ul><li>DOMContentLoaded</li><li>readystatechange</li><li>MutationObserver</li></ul><p><code>框架带有自身的生命周期</code></p><h3 id="系统异常" tabindex="-1">系统异常 <a class="header-anchor" href="#系统异常" aria-label="Permalink to &quot;系统异常&quot;">​</a></h3><ul><li>window.onerror</li><li>document.addEventListener(&#39;error&#39;)</li><li>xhr status</li></ul><h3 id="用户日志" tabindex="-1">用户日志 <a class="header-anchor" href="#用户日志" aria-label="Permalink to &quot;用户日志&quot;">​</a></h3><ul><li>类装饰器</li><li>类方法劫持</li></ul><h3 id="数据上报" tabindex="-1">数据上报 <a class="header-anchor" href="#数据上报" aria-label="Permalink to &quot;数据上报&quot;">​</a></h3><ul><li>定期/定量上报</li><li>关键生命周期上报</li><li>用户主动提交</li></ul><h3 id="数据监控" tabindex="-1">数据监控 <a class="header-anchor" href="#数据监控" aria-label="Permalink to &quot;数据监控&quot;">​</a></h3><ul><li>错误告警是否有新增错误，可通过报错内容找到报错位置修复</li><li>全版本监控观察：整体的功能点覆盖曲线是否正常，已否有异常涨跌</li><li>分版本监控观察：新版本是否所有功都能正常访问、灰度占比是否正常、新旧版本的转化率是否一致</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/architecture/standard/comp-mod.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>组件化与模块化</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/architecture/standard/performance.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>前端性能</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/architecture/standard/performance.html b/architecture/standard/performance.html
index 2682576..c145c22 100644
--- a/architecture/standard/performance.html
+++ b/architecture/standard/performance.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>前端性能优化 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/architecture_standard_performance.md.c952558a.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/architecture_standard_performance.md.5df854dc.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_architecture_standard_performance" data-v-6b87e69f><div><h1 id="前端性能优化" tabindex="-1">前端性能优化 <a class="header-anchor" href="#前端性能优化" aria-label="Permalink to &quot;前端性能优化&quot;">​</a></h1><p>时间和空间</p><div class="warning custom-block"><p class="custom-block-title">性能分析指标</p><p><code>加载耗时、渲染耗时、网络耗时、脚本执行耗时</code> &amp; <code>CPU 占用、资源占用、本地缓存占用</code></p></div><h2 id="时间角度" tabindex="-1">时间角度 <a class="header-anchor" href="#时间角度" aria-label="Permalink to &quot;时间角度&quot;">​</a></h2><p>减少耗时</p><h3 id="网络请求优化" tabindex="-1">网络请求优化 <a class="header-anchor" href="#网络请求优化" aria-label="Permalink to &quot;网络请求优化&quot;">​</a></h3><ul><li>减少 DNS 查询时间，使用浏览器 DNS 缓存、计算机 DNS 缓存、服务器 DNS 缓存</li><li>合理地使用 CDN，有效的减少网络请求耗时</li><li>对请求资源进行缓存（浏览器缓存、HTTP 缓存、后台缓存）Service Worker、PWA 技术</li><li>Tree-shaking 代码分割</li><li>对请求资源进行合理的拆分，减少请求资源的体积</li><li>对资源进行压缩，减少传输数据大小</li><li>使用 HTTP2、HTTP3 提升资源请求速度</li><li>对请求进行优化（多个请求合并，减少通信次数；请求进行域名拆分，提升并发请求数量）</li></ul><h3 id="首屏加载优化" tabindex="-1">首屏加载优化 <a class="header-anchor" href="#首屏加载优化" aria-label="Permalink to &quot;首屏加载优化&quot;">​</a></h3><p>将页面尽快展示给用户看，减少白屏时间</p><ul><li>对页面进行分片/分屏加载，将页面可见/可交互时间提前</li><li>优化资源加载的顺序和粒度，仅加载需要的资源，采用异步加载的方式加载其他资源</li><li>按需加载（差异化服务，读写分离）</li><li>使用服务端渲染，减少页面二次请求和渲染的耗时</li><li>使用秒看技术，通过预览的方式提前给用户观看（图片）</li><li>配合客户端进行资源预请求和预加载（预热 Web 容器）</li><li>配合客户端将资源和数据进行离线，可用于下一次的页面快速渲染</li></ul><h3 id="渲染过程优化" tabindex="-1">渲染过程优化 <a class="header-anchor" href="#渲染过程优化" aria-label="Permalink to &quot;渲染过程优化&quot;">​</a></h3><ul><li>使用资源预加载，空闲时间将用户可能需要用到的资源进行获取并加载</li><li>减少 DOM 数量、减少/合并 DOM 操作，减少浏览器渲染过程中的计算耗时</li><li>通过合理使用浏览器 GPU 进程合成，提升浏览器渲染效率</li><li>使用离屏渲染，在页面不可见的地方进行提前渲染（Canvas 渲染）</li><li>通过将浏览帧率保持在 60FPS，提升页面交互和渲染的流畅度</li></ul><h3 id="计算-逻辑提速" tabindex="-1">计算/逻辑提速 <a class="header-anchor" href="#计算-逻辑提速" aria-label="Permalink to &quot;计算/逻辑提速&quot;">​</a></h3><ul><li>将 JavaScript 大任务拆解 + 并行计算的方式，有效的降低整体计算耗时（Web Worker)</li><li>使用更高运行效率的方式，减少计算耗时（Webassembly）</li><li>将计算过程提前，减少计算等待时长（AOT 技术）</li><li>使用更优的算法或数据结构，提升计算效率（红黑树）</li><li>将结果缓存，减少运行次数</li></ul><h2 id="空间角度" tabindex="-1">空间角度 <a class="header-anchor" href="#空间角度" aria-label="Permalink to &quot;空间角度&quot;">​</a></h2><h3 id="降低资源占用" tabindex="-1">降低资源占用 <a class="header-anchor" href="#降低资源占用" aria-label="Permalink to &quot;降低资源占用&quot;">​</a></h3><ul><li>合理使用缓存，不滥用用户的缓存资源（浏览器缓存，IndexDB）及时进行缓存清理</li><li>通过使用数据结构享元的方式，减少对象的创建，从而减少内存占用</li><li>避免存在内存泄漏（避免全局变量的使用，及时解除引用）</li><li>避免复杂/异常的递归调用，防止栈溢出</li></ul><h2 id="性能数据" tabindex="-1">性能数据 <a class="header-anchor" href="#性能数据" aria-label="Permalink to &quot;性能数据&quot;">​</a></h2><ul><li>网络资源请求时间。</li><li>Time To Start Render(TTSR)：浏览器开始渲染的时间。</li><li>Dom Ready：页面解析完成的时间。</li><li>Time To Interact(TTI))：页面可交互时间。</li><li>Total Blocking Time (TBT)：总阻塞时间，代表页面处于不可交互状态的耗时。</li><li>First Input Delay(FID)：从用户首次交互，到浏览器响应的时间。</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/architecture/standard/monitor.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前端监控</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/architecture/standard/project-design.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>项目设计</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _architecture_standard_performance" data-v-6b87e69f><div><h1 id="前端性能优化" tabindex="-1">前端性能优化 <a class="header-anchor" href="#前端性能优化" aria-label="Permalink to &quot;前端性能优化&quot;">​</a></h1><p>时间和空间</p><div class="warning custom-block"><p class="custom-block-title">性能分析指标</p><p><code>加载耗时、渲染耗时、网络耗时、脚本执行耗时</code> &amp; <code>CPU 占用、资源占用、本地缓存占用</code></p></div><h2 id="时间角度" tabindex="-1">时间角度 <a class="header-anchor" href="#时间角度" aria-label="Permalink to &quot;时间角度&quot;">​</a></h2><p>减少耗时</p><h3 id="网络请求优化" tabindex="-1">网络请求优化 <a class="header-anchor" href="#网络请求优化" aria-label="Permalink to &quot;网络请求优化&quot;">​</a></h3><ul><li>减少 DNS 查询时间，使用浏览器 DNS 缓存、计算机 DNS 缓存、服务器 DNS 缓存</li><li>合理地使用 CDN，有效的减少网络请求耗时</li><li>对请求资源进行缓存（浏览器缓存、HTTP 缓存、后台缓存）Service Worker、PWA 技术</li><li>Tree-shaking 代码分割</li><li>对请求资源进行合理的拆分，减少请求资源的体积</li><li>对资源进行压缩，减少传输数据大小</li><li>使用 HTTP2、HTTP3 提升资源请求速度</li><li>对请求进行优化（多个请求合并，减少通信次数；请求进行域名拆分，提升并发请求数量）</li></ul><h3 id="首屏加载优化" tabindex="-1">首屏加载优化 <a class="header-anchor" href="#首屏加载优化" aria-label="Permalink to &quot;首屏加载优化&quot;">​</a></h3><p>将页面尽快展示给用户看，减少白屏时间</p><ul><li>对页面进行分片/分屏加载，将页面可见/可交互时间提前</li><li>优化资源加载的顺序和粒度，仅加载需要的资源，采用异步加载的方式加载其他资源</li><li>按需加载（差异化服务，读写分离）</li><li>使用服务端渲染，减少页面二次请求和渲染的耗时</li><li>使用秒看技术，通过预览的方式提前给用户观看（图片）</li><li>配合客户端进行资源预请求和预加载（预热 Web 容器）</li><li>配合客户端将资源和数据进行离线，可用于下一次的页面快速渲染</li></ul><h3 id="渲染过程优化" tabindex="-1">渲染过程优化 <a class="header-anchor" href="#渲染过程优化" aria-label="Permalink to &quot;渲染过程优化&quot;">​</a></h3><ul><li>使用资源预加载，空闲时间将用户可能需要用到的资源进行获取并加载</li><li>减少 DOM 数量、减少/合并 DOM 操作，减少浏览器渲染过程中的计算耗时</li><li>通过合理使用浏览器 GPU 进程合成，提升浏览器渲染效率</li><li>使用离屏渲染，在页面不可见的地方进行提前渲染（Canvas 渲染）</li><li>通过将浏览帧率保持在 60FPS，提升页面交互和渲染的流畅度</li></ul><h3 id="计算-逻辑提速" tabindex="-1">计算/逻辑提速 <a class="header-anchor" href="#计算-逻辑提速" aria-label="Permalink to &quot;计算/逻辑提速&quot;">​</a></h3><ul><li>将 JavaScript 大任务拆解 + 并行计算的方式，有效的降低整体计算耗时（Web Worker)</li><li>使用更高运行效率的方式，减少计算耗时（Webassembly）</li><li>将计算过程提前，减少计算等待时长（AOT 技术）</li><li>使用更优的算法或数据结构，提升计算效率（红黑树）</li><li>将结果缓存，减少运行次数</li></ul><h2 id="空间角度" tabindex="-1">空间角度 <a class="header-anchor" href="#空间角度" aria-label="Permalink to &quot;空间角度&quot;">​</a></h2><h3 id="降低资源占用" tabindex="-1">降低资源占用 <a class="header-anchor" href="#降低资源占用" aria-label="Permalink to &quot;降低资源占用&quot;">​</a></h3><ul><li>合理使用缓存，不滥用用户的缓存资源（浏览器缓存，IndexDB）及时进行缓存清理</li><li>通过使用数据结构享元的方式，减少对象的创建，从而减少内存占用</li><li>避免存在内存泄漏（避免全局变量的使用，及时解除引用）</li><li>避免复杂/异常的递归调用，防止栈溢出</li></ul><h2 id="性能数据" tabindex="-1">性能数据 <a class="header-anchor" href="#性能数据" aria-label="Permalink to &quot;性能数据&quot;">​</a></h2><ul><li>网络资源请求时间。</li><li>Time To Start Render(TTSR)：浏览器开始渲染的时间。</li><li>Dom Ready：页面解析完成的时间。</li><li>Time To Interact(TTI))：页面可交互时间。</li><li>Total Blocking Time (TBT)：总阻塞时间，代表页面处于不可交互状态的耗时。</li><li>First Input Delay(FID)：从用户首次交互，到浏览器响应的时间。</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/architecture/standard/monitor.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前端监控</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/architecture/standard/project-design.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>项目设计</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/architecture/standard/project-design.html b/architecture/standard/project-design.html
index 77a797e..c10e9ba 100644
--- a/architecture/standard/project-design.html
+++ b/architecture/standard/project-design.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>项目设计 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/architecture_standard_project-design.md.1e6aae9a.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/architecture_standard_project-design.md.491238a5.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_architecture_standard_project-design" data-v-6b87e69f><div><h1 id="项目设计" tabindex="-1">项目设计 <a class="header-anchor" href="#项目设计" aria-label="Permalink to &quot;项目设计&quot;">​</a></h1><p>如何设计一个项目，如何面对项目中的一些痛点？</p><h2 id="技术方案设计与选型" tabindex="-1">技术方案设计与选型 <a class="header-anchor" href="#技术方案设计与选型" aria-label="Permalink to &quot;技术方案设计与选型&quot;">​</a></h2><p>从 0 搭建一个项目</p><ol><li>前端框架与脚手架</li><li>状态管理工具</li><li>路由管理工具</li><li>代码构建与编译工具</li></ol><h3 id="技术选型的影响因素" tabindex="-1">技术选型的影响因素 <a class="header-anchor" href="#技术选型的影响因素" aria-label="Permalink to &quot;技术选型的影响因素&quot;">​</a></h3><ol><li>项目规模、功能交互、面向用户</li><li>多人协作、团队规模</li><li>团队技术栈、新技术的接受程度</li><li>参考现有的技术方案、调整</li></ol><ul><li>前端框架和工具选型</li></ul><ol><li>使用开源/现有框架</li><li>造轮子</li></ol><ul><li>选择适合团队的技术栈</li></ul><ol><li>团队现有的技术栈</li><li>团队成员对现有框架/工具的熟悉程度</li><li>团队成员是否有倾向的框架/工具</li></ol><h3 id="多人协作与团队规范" tabindex="-1">多人协作与团队规范 <a class="header-anchor" href="#多人协作与团队规范" aria-label="Permalink to &quot;多人协作与团队规范&quot;">​</a></h3><ul><li>编码规范</li></ul><p>Eslint、Prettier、Git Commit Hooks</p><ul><li>代码流程规范</li></ul><p>创建分支过程、提交代码过程、分支提交过程、合入主干过程、代码发布过程（CI/CD）</p><h2 id="前端工程化" tabindex="-1">前端工程化 <a class="header-anchor" href="#前端工程化" aria-label="Permalink to &quot;前端工程化&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">前端工程化</p><p>从工程学角度来看，前端工程化致力于提升工程的开发效率、协作效率、项目质量、贯穿项目设计、开发、测试、上线、维护的整个过程。</p></div><p>通过项目设计和架构优化，提升系统质量；通过自动化的方式，将项目研发与发布流程进行优化，提升开发效率</p><h2 id="大型项目痛点" tabindex="-1">大型项目痛点 <a class="header-anchor" href="#大型项目痛点" aria-label="Permalink to &quot;大型项目痛点&quot;">​</a></h2><p>前端团队人数 10+、模块数量 30+、代码量 30w+</p><h3 id="模块耦合严重" tabindex="-1">模块耦合严重 <a class="header-anchor" href="#模块耦合严重" aria-label="Permalink to &quot;模块耦合严重&quot;">​</a></h3><ol><li>项目规模调整后，对现有架构设计进行分析，不合适进行及时的设计调整与优化</li><li>使用模块解耦的技术方案，将各个模块统一交由框架处理</li><li>梳理各个模块的职责，明确每个模块负责的工作和提供的功能，确定各个模块间的边界和调用方式</li></ol><p><code>避免耦合</code></p><ul><li>依赖倒置</li><li>事件通信（Event/Emitter)</li></ul><h3 id="项目复杂熟悉成本过高" tabindex="-1">项目复杂熟悉成本过高 <a class="header-anchor" href="#项目复杂熟悉成本过高" aria-label="Permalink to &quot;项目复杂熟悉成本过高&quot;">​</a></h3><ol><li>每个开发者都认领（或分配）一个或多个模块，并要求掌握熟悉模块的细节，并维护文档</li><li>需求开发、bug 修复、技术优化，找对应的模块负责人进行风险评估以及代码 review</li><li>模块的负责人负责自身模块的技术优化方案，性能优化、自动化测试、代码规范调整</li><li>对于核心复杂模块，可由多个负责人共同维护，协商技术细节</li></ol><h3 id="项目代码量过大" tabindex="-1">项目代码量过大 <a class="header-anchor" href="#项目代码量过大" aria-label="Permalink to &quot;项目代码量过大&quot;">​</a></h3><ul><li>拆：拆模块、拆公共库、拆组件库</li><li>分：分流程、分步骤</li></ul><ol><li>代码按需引入，移除不必要的代码（Tree-shaking）</li><li>异步加载模块</li><li>加载流程优化，分析首屏</li><li>差异化服务，不同场景只加载所需要的模块内容（读写分离）</li><li>代码复用，封装</li></ol><p><code>项目管理</code></p><ul><li>multirepo 多包管理，体积代码量小，构建可选（缺点：问题定位困难，模块变动其他模块配置都需更新）</li><li>monorepo 单包管理，配合 lerna，方便调试以及修复（缺点：体积大，代码可维护性、可测试性要求高，版本控制以及 Git 工作流要求高）</li></ul><h3 id="问题定位效率低" tabindex="-1">问题定位效率低 <a class="header-anchor" href="#问题定位效率低" aria-label="Permalink to &quot;问题定位效率低&quot;">​</a></h3><ol><li>模块负责人对自身模块执行的关键点进行标记，在开发+调试模式下，其他开发可通过开启断点方式来直接定位问题</li><li>查看调用栈自行分析</li></ol><h2 id="项目前期准备与复盘" tabindex="-1">项目前期准备与复盘 <a class="header-anchor" href="#项目前期准备与复盘" aria-label="Permalink to &quot;项目前期准备与复盘&quot;">​</a></h2><p>前期准备</p><ul><li>预期功能</li><li>预计工作量和分工排期</li><li>每个阶段（开发、联调、产品体验、提测、发布）的时间点</li><li>延期风险（交互、设计、接口协议）</li></ul><p>复盘</p><ul><li>时间维度</li><li>质量维度</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/architecture/standard/performance.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前端性能</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/architecture/websecure/xss.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>XSS</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _architecture_standard_project-design" data-v-6b87e69f><div><h1 id="项目设计" tabindex="-1">项目设计 <a class="header-anchor" href="#项目设计" aria-label="Permalink to &quot;项目设计&quot;">​</a></h1><p>如何设计一个项目，如何面对项目中的一些痛点？</p><h2 id="技术方案设计与选型" tabindex="-1">技术方案设计与选型 <a class="header-anchor" href="#技术方案设计与选型" aria-label="Permalink to &quot;技术方案设计与选型&quot;">​</a></h2><p>从 0 搭建一个项目</p><ol><li>前端框架与脚手架</li><li>状态管理工具</li><li>路由管理工具</li><li>代码构建与编译工具</li></ol><h3 id="技术选型的影响因素" tabindex="-1">技术选型的影响因素 <a class="header-anchor" href="#技术选型的影响因素" aria-label="Permalink to &quot;技术选型的影响因素&quot;">​</a></h3><ol><li>项目规模、功能交互、面向用户</li><li>多人协作、团队规模</li><li>团队技术栈、新技术的接受程度</li><li>参考现有的技术方案、调整</li></ol><ul><li>前端框架和工具选型</li></ul><ol><li>使用开源/现有框架</li><li>造轮子</li></ol><ul><li>选择适合团队的技术栈</li></ul><ol><li>团队现有的技术栈</li><li>团队成员对现有框架/工具的熟悉程度</li><li>团队成员是否有倾向的框架/工具</li></ol><h3 id="多人协作与团队规范" tabindex="-1">多人协作与团队规范 <a class="header-anchor" href="#多人协作与团队规范" aria-label="Permalink to &quot;多人协作与团队规范&quot;">​</a></h3><ul><li>编码规范</li></ul><p>Eslint、Prettier、Git Commit Hooks</p><ul><li>代码流程规范</li></ul><p>创建分支过程、提交代码过程、分支提交过程、合入主干过程、代码发布过程（CI/CD）</p><h2 id="前端工程化" tabindex="-1">前端工程化 <a class="header-anchor" href="#前端工程化" aria-label="Permalink to &quot;前端工程化&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">前端工程化</p><p>从工程学角度来看，前端工程化致力于提升工程的开发效率、协作效率、项目质量、贯穿项目设计、开发、测试、上线、维护的整个过程。</p></div><p>通过项目设计和架构优化，提升系统质量；通过自动化的方式，将项目研发与发布流程进行优化，提升开发效率</p><h2 id="大型项目痛点" tabindex="-1">大型项目痛点 <a class="header-anchor" href="#大型项目痛点" aria-label="Permalink to &quot;大型项目痛点&quot;">​</a></h2><p>前端团队人数 10+、模块数量 30+、代码量 30w+</p><h3 id="模块耦合严重" tabindex="-1">模块耦合严重 <a class="header-anchor" href="#模块耦合严重" aria-label="Permalink to &quot;模块耦合严重&quot;">​</a></h3><ol><li>项目规模调整后，对现有架构设计进行分析，不合适进行及时的设计调整与优化</li><li>使用模块解耦的技术方案，将各个模块统一交由框架处理</li><li>梳理各个模块的职责，明确每个模块负责的工作和提供的功能，确定各个模块间的边界和调用方式</li></ol><p><code>避免耦合</code></p><ul><li>依赖倒置</li><li>事件通信（Event/Emitter)</li></ul><h3 id="项目复杂熟悉成本过高" tabindex="-1">项目复杂熟悉成本过高 <a class="header-anchor" href="#项目复杂熟悉成本过高" aria-label="Permalink to &quot;项目复杂熟悉成本过高&quot;">​</a></h3><ol><li>每个开发者都认领（或分配）一个或多个模块，并要求掌握熟悉模块的细节，并维护文档</li><li>需求开发、bug 修复、技术优化，找对应的模块负责人进行风险评估以及代码 review</li><li>模块的负责人负责自身模块的技术优化方案，性能优化、自动化测试、代码规范调整</li><li>对于核心复杂模块，可由多个负责人共同维护，协商技术细节</li></ol><h3 id="项目代码量过大" tabindex="-1">项目代码量过大 <a class="header-anchor" href="#项目代码量过大" aria-label="Permalink to &quot;项目代码量过大&quot;">​</a></h3><ul><li>拆：拆模块、拆公共库、拆组件库</li><li>分：分流程、分步骤</li></ul><ol><li>代码按需引入，移除不必要的代码（Tree-shaking）</li><li>异步加载模块</li><li>加载流程优化，分析首屏</li><li>差异化服务，不同场景只加载所需要的模块内容（读写分离）</li><li>代码复用，封装</li></ol><p><code>项目管理</code></p><ul><li>multirepo 多包管理，体积代码量小，构建可选（缺点：问题定位困难，模块变动其他模块配置都需更新）</li><li>monorepo 单包管理，配合 lerna，方便调试以及修复（缺点：体积大，代码可维护性、可测试性要求高，版本控制以及 Git 工作流要求高）</li></ul><h3 id="问题定位效率低" tabindex="-1">问题定位效率低 <a class="header-anchor" href="#问题定位效率低" aria-label="Permalink to &quot;问题定位效率低&quot;">​</a></h3><ol><li>模块负责人对自身模块执行的关键点进行标记，在开发+调试模式下，其他开发可通过开启断点方式来直接定位问题</li><li>查看调用栈自行分析</li></ol><h2 id="项目前期准备与复盘" tabindex="-1">项目前期准备与复盘 <a class="header-anchor" href="#项目前期准备与复盘" aria-label="Permalink to &quot;项目前期准备与复盘&quot;">​</a></h2><p>前期准备</p><ul><li>预期功能</li><li>预计工作量和分工排期</li><li>每个阶段（开发、联调、产品体验、提测、发布）的时间点</li><li>延期风险（交互、设计、接口协议）</li></ul><p>复盘</p><ul><li>时间维度</li><li>质量维度</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/architecture/standard/performance.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前端性能</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/architecture/websecure/xss.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>XSS</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/architecture/websecure/xss.html b/architecture/websecure/xss.html
index 1b60dde..9795f78 100644
--- a/architecture/websecure/xss.html
+++ b/architecture/websecure/xss.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>XSS | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/architecture_websecure_xss.md.63b7ea5b.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/architecture_websecure_xss.md.b68d323d.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_architecture_websecure_xss" data-v-6b87e69f><div><h1 id="xss" tabindex="-1">XSS <a class="header-anchor" href="#xss" aria-label="Permalink to &quot;XSS&quot;">​</a></h1><p>跨站脚本攻击（Cross Site Scripting）</p><h2 id="类型" tabindex="-1">类型 <a class="header-anchor" href="#类型" aria-label="Permalink to &quot;类型&quot;">​</a></h2><p>三种类型</p><h3 id="反射型" tabindex="-1">反射型 <a class="header-anchor" href="#反射型" aria-label="Permalink to &quot;反射型&quot;">​</a></h3><ul><li>一次性</li></ul><h3 id="存储型" tabindex="-1">存储型 <a class="header-anchor" href="#存储型" aria-label="Permalink to &quot;存储型&quot;">​</a></h3><ul><li>存储在服务器</li></ul><h3 id="dom-跨站" tabindex="-1">DOM 跨站 <a class="header-anchor" href="#dom-跨站" aria-label="Permalink to &quot;DOM 跨站&quot;">​</a></h3><p>DOM XSS（document object model 文档对象模型）</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/architecture/standard/project-design.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>项目设计</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>架构</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>思考</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>业界标准</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/A-YZ.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>标准 - 模板1</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/comp-mod.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>组件化与模块化</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/monitor.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端监控</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/performance.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端性能</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/standard/project-design.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>项目设计</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网页安全</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/architecture/websecure/xss.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>XSS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _architecture_websecure_xss" data-v-6b87e69f><div><h1 id="xss" tabindex="-1">XSS <a class="header-anchor" href="#xss" aria-label="Permalink to &quot;XSS&quot;">​</a></h1><p>跨站脚本攻击（Cross Site Scripting）</p><h2 id="类型" tabindex="-1">类型 <a class="header-anchor" href="#类型" aria-label="Permalink to &quot;类型&quot;">​</a></h2><p>三种类型</p><h3 id="反射型" tabindex="-1">反射型 <a class="header-anchor" href="#反射型" aria-label="Permalink to &quot;反射型&quot;">​</a></h3><ul><li>一次性</li></ul><h3 id="存储型" tabindex="-1">存储型 <a class="header-anchor" href="#存储型" aria-label="Permalink to &quot;存储型&quot;">​</a></h3><ul><li>存储在服务器</li></ul><h3 id="dom-跨站" tabindex="-1">DOM 跨站 <a class="header-anchor" href="#dom-跨站" aria-label="Permalink to &quot;DOM 跨站&quot;">​</a></h3><p>DOM XSS（document object model 文档对象模型）</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/architecture/standard/project-design.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>项目设计</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/debounce.html b/articles/advanced/debounce.html
index 6bbc1ad..32cb30b 100644
--- a/articles/advanced/debounce.html
+++ b/articles/advanced/debounce.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>防抖节流 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_debounce.md.5bbfcaa3.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_debounce.md.c37622c0.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_debounce" data-v-6b87e69f><div><h1 id="防抖节流" tabindex="-1">防抖节流 <a class="header-anchor" href="#防抖节流" aria-label="Permalink to &quot;防抖节流&quot;">​</a></h1><p>结合 lodash 的防抖节流，实现多种完整版的防抖节流。</p><h2 id="防抖" tabindex="-1">防抖 <a class="header-anchor" href="#防抖" aria-label="Permalink to &quot;防抖&quot;">​</a></h2><p>你知道的防抖是怎样呢？</p><h3 id="正常防抖" tabindex="-1">正常防抖 <a class="header-anchor" href="#正常防抖" aria-label="Permalink to &quot;正常防抖&quot;">​</a></h3><blockquote><p>每次输入完毕，两秒之后执行</p></blockquote><h4 id="代码实现" tabindex="-1">代码实现 <a class="header-anchor" href="#代码实现" aria-label="Permalink to &quot;代码实现&quot;">​</a></h4><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">debounce</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">fn</span><span style="color:#E1E4E8;">, </span><span style="color:#FFAB70;">delay</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">2000</span><span style="color:#E1E4E8;">) {</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_debounce" data-v-6b87e69f><div><h1 id="防抖节流" tabindex="-1">防抖节流 <a class="header-anchor" href="#防抖节流" aria-label="Permalink to &quot;防抖节流&quot;">​</a></h1><p>结合 lodash 的防抖节流，实现多种完整版的防抖节流。</p><h2 id="防抖" tabindex="-1">防抖 <a class="header-anchor" href="#防抖" aria-label="Permalink to &quot;防抖&quot;">​</a></h2><p>你知道的防抖是怎样呢？</p><h3 id="正常防抖" tabindex="-1">正常防抖 <a class="header-anchor" href="#正常防抖" aria-label="Permalink to &quot;正常防抖&quot;">​</a></h3><blockquote><p>每次输入完毕，两秒之后执行</p></blockquote><h4 id="代码实现" tabindex="-1">代码实现 <a class="header-anchor" href="#代码实现" aria-label="Permalink to &quot;代码实现&quot;">​</a></h4><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">debounce</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">fn</span><span style="color:#E1E4E8;">, </span><span style="color:#FFAB70;">delay</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">2000</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> timerId </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">null</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">return</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> (</span><span style="color:#F97583;">...</span><span style="color:#FFAB70;">args</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#F97583;">if</span><span style="color:#E1E4E8;"> (timerId) </span><span style="color:#B392F0;">clearTimeout</span><span style="color:#E1E4E8;">(timerId);</span></span>
@@ -531,8 +531,8 @@
 <span class="line"><span style="color:#24292E;">  debounced.cancel </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> cancel;</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#D73A49;">return</span><span style="color:#24292E;"> debounced;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-10-26T01:58:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/syslink.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Soft/Hard Links</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/advanced/devServer.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>热重载</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-10-26T01:58:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/syslink.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Soft/Hard Links</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/devServer.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>热重载</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/devServer.html b/articles/advanced/devServer.html
index 240fcce..aa0e8e0 100644
--- a/articles/advanced/devServer.html
+++ b/articles/advanced/devServer.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>实现一个简易热更新 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_devServer.md.7df25eb4.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_devServer.md.adf19849.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_devServer" data-v-6b87e69f><div><h1 id="实现一个简易热更新" tabindex="-1">实现一个简易热更新 <a class="header-anchor" href="#实现一个简易热更新" aria-label="Permalink to &quot;实现一个简易热更新&quot;">​</a></h1><p>使用 Webpack + Nodejs(Express) 实现热更新</p><p><a href="https://github.com/LIUeng/webpack-server" target="_blank" rel="noreferrer">项目地址</a></p><h2 id="实现思考" tabindex="-1">实现思考？ <a class="header-anchor" href="#实现思考" aria-label="Permalink to &quot;实现思考？&quot;">​</a></h2><p>保存代码，webpack 监听编译代码，编译完成，通知浏览器更新页面（抛出想法，解决问题）</p><h3 id="思考一" tabindex="-1">思考一 <a class="header-anchor" href="#思考一" aria-label="Permalink to &quot;思考一&quot;">​</a></h3><p><em><strong>项目利用 Nodejs(Http) + Express 启动一个端口服务作为服务端</strong></em></p><h4 id="解答" tabindex="-1"><code>解答</code> <a class="header-anchor" href="#解答" aria-label="Permalink to &quot;`解答`&quot;">​</a></h4><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_devServer" data-v-6b87e69f><div><h1 id="实现一个简易热更新" tabindex="-1">实现一个简易热更新 <a class="header-anchor" href="#实现一个简易热更新" aria-label="Permalink to &quot;实现一个简易热更新&quot;">​</a></h1><p>使用 Webpack + Nodejs(Express) 实现热更新</p><p><a href="https://github.com/LIUeng/webpack-server" target="_blank" rel="noreferrer">项目地址</a></p><h2 id="实现思考" tabindex="-1">实现思考？ <a class="header-anchor" href="#实现思考" aria-label="Permalink to &quot;实现思考？&quot;">​</a></h2><p>保存代码，webpack 监听编译代码，编译完成，通知浏览器更新页面（抛出想法，解决问题）</p><h3 id="思考一" tabindex="-1">思考一 <a class="header-anchor" href="#思考一" aria-label="Permalink to &quot;思考一&quot;">​</a></h3><p><em><strong>项目利用 Nodejs(Http) + Express 启动一个端口服务作为服务端</strong></em></p><h4 id="解答" tabindex="-1"><code>解答</code> <a class="header-anchor" href="#解答" aria-label="Permalink to &quot;`解答`&quot;">​</a></h4><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"></span>
 <span class="line"><span style="color:#6A737D;">// 项目目录 servers/Server.js</span></span>
 <span class="line"><span style="color:#6A737D;">// 启动端口</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> app </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">express</span><span style="color:#E1E4E8;">();</span></span>
@@ -89,8 +89,8 @@
 <span class="line"></span>
 <span class="line"><span style="color:#6F42C1;">or</span></span>
 <span class="line"></span>
-<span class="line"><span style="color:#6F42C1;">yarn</span><span style="color:#24292E;"> </span><span style="color:#032F62;">start</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/advanced/debounce.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>防抖节流</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/advanced/docs.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>前端文档</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6F42C1;">yarn</span><span style="color:#24292E;"> </span><span style="color:#032F62;">start</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/debounce.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>防抖节流</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/docs.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>前端文档</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/docs.html b/articles/advanced/docs.html
index 8e52d77..83279b1 100644
--- a/articles/advanced/docs.html
+++ b/articles/advanced/docs.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>前端文档 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_docs.md.74a9328e.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_docs.md.501fd43f.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_docs" data-v-6b87e69f><div><h1 id="前端文档" tabindex="-1">前端文档 <a class="header-anchor" href="#前端文档" aria-label="Permalink to &quot;前端文档&quot;">​</a></h1><blockquote><p>以下图片失效，有兴趣打开原文阅读</p></blockquote><p><a href="https://juejin.cn/post/6844904192792870919" target="_blank" rel="noreferrer">原文阅读</a></p><ul><li>文档桌面应用客户端 ------ word excel ppt wps ···</li><li>在线文档(类似) ------ <a href="https://docs.google.com" target="_blank" rel="noreferrer">google 文档</a></li></ul><h2 id="前端文档浅思考" tabindex="-1">前端文档浅思考 <a class="header-anchor" href="#前端文档浅思考" aria-label="Permalink to &quot;前端文档浅思考&quot;">​</a></h2><p><strong>如果你去开发你会怎么做</strong></p><ul><li>input?</li><li>textarea?</li><li>div?contenteditable?(富文本可编辑属性)</li></ul><h3 id="富文本编辑" tabindex="-1">富文本编辑 <a class="header-anchor" href="#富文本编辑" aria-label="Permalink to &quot;富文本编辑&quot;">​</a></h3><p>以下 API 来自[JavaScript 高级程序设计第三版]</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 文档执行预定义命令，接收三个参数</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_docs" data-v-6b87e69f><div><h1 id="前端文档" tabindex="-1">前端文档 <a class="header-anchor" href="#前端文档" aria-label="Permalink to &quot;前端文档&quot;">​</a></h1><blockquote><p>以下图片失效，有兴趣打开原文阅读</p></blockquote><p><a href="https://juejin.cn/post/6844904192792870919" target="_blank" rel="noreferrer">原文阅读</a></p><ul><li>文档桌面应用客户端 ------ word excel ppt wps ···</li><li>在线文档(类似) ------ <a href="https://docs.google.com" target="_blank" rel="noreferrer">google 文档</a></li></ul><h2 id="前端文档浅思考" tabindex="-1">前端文档浅思考 <a class="header-anchor" href="#前端文档浅思考" aria-label="Permalink to &quot;前端文档浅思考&quot;">​</a></h2><p><strong>如果你去开发你会怎么做</strong></p><ul><li>input?</li><li>textarea?</li><li>div?contenteditable?(富文本可编辑属性)</li></ul><h3 id="富文本编辑" tabindex="-1">富文本编辑 <a class="header-anchor" href="#富文本编辑" aria-label="Permalink to &quot;富文本编辑&quot;">​</a></h3><p>以下 API 来自[JavaScript 高级程序设计第三版]</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 文档执行预定义命令，接收三个参数</span></span>
 <span class="line"><span style="color:#6A737D;">// 1. 要执行的命令名称</span></span>
 <span class="line"><span style="color:#6A737D;">// 2. 浏览器是否应该为当前的命令用户界面提供一个布尔值（兼容性，始终为false)</span></span>
 <span class="line"><span style="color:#6A737D;">// 3. 执行命令必须的一个值(无 =&gt; null)</span></span>
@@ -39,8 +39,8 @@
 <span class="line"><span style="color:#6A737D;">// 创建包围元素</span></span>
 <span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> span </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> document.</span><span style="color:#6F42C1;">createElement</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;div&#39;</span><span style="color:#24292E;">);</span></span>
 <span class="line"><span style="color:#24292E;">span.style.backgroundColor </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;orange&#39;</span><span style="color:#24292E;">;</span></span>
-<span class="line"><span style="color:#24292E;">range.</span><span style="color:#6F42C1;">surroundContents</span><span style="color:#24292E;">(span);</span></span></code></pre></div><h4 id="操作范围-dom2" tabindex="-1">操作范围 DOM2 <a class="header-anchor" href="#操作范围-dom2" aria-label="Permalink to &quot;操作范围 DOM2&quot;">​</a></h4><blockquote><p>document.createRange()</p></blockquote><ol><li>简单选择 DOM 范围</li><li>复杂选择 DOM 范围</li><li>操作 DOM 范围中的内容</li><li>插入 DOM 范围中的内容</li><li>折叠 DOM 范围</li><li>比较 DOM 范围</li></ol><h4 id="复合事件" tabindex="-1">复合事件 <a class="header-anchor" href="#复合事件" aria-label="Permalink to &quot;复合事件&quot;">​</a></h4><ul><li>compositionstart：在 IME 的文本复合系统打开时触发，表示要开始输入了</li><li>compositionupdate：在向输入字段中插入新字符时触发</li><li>compositionend：在 IME 的文本复合系统关闭时触发，表示返回正常键盘输入状态</li></ul><h2 id="前端文档深思考" tabindex="-1">前端文档深思考 <a class="header-anchor" href="#前端文档深思考" aria-label="Permalink to &quot;前端文档深思考&quot;">​</a></h2><blockquote><p>前端文档的技术该如何选择以及采坑？</p></blockquote><h3 id="同构表vs异构表" tabindex="-1">同构表VS异构表 <a class="header-anchor" href="#同构表vs异构表" aria-label="Permalink to &quot;同构表VS异构表&quot;">​</a></h3><h3 id="文档技术" tabindex="-1">文档技术 <a class="header-anchor" href="#文档技术" aria-label="Permalink to &quot;文档技术&quot;">​</a></h3><h3 id="在线协同" tabindex="-1">在线协同 <a class="header-anchor" href="#在线协同" aria-label="Permalink to &quot;在线协同&quot;">​</a></h3><h2 id="前端文档应用" tabindex="-1">前端文档应用 <a class="header-anchor" href="#前端文档应用" aria-label="Permalink to &quot;前端文档应用&quot;">​</a></h2><p>来看看一些用过的在线文档编辑设计思路以及架构模式</p><h3 id="钉钉" tabindex="-1">钉钉 <a class="header-anchor" href="#钉钉" aria-label="Permalink to &quot;钉钉&quot;">​</a></h3><p><strong>菜鸟业务WebExcel</strong></p><h3 id="语雀" tabindex="-1">语雀 <a class="header-anchor" href="#语雀" aria-label="Permalink to &quot;语雀&quot;">​</a></h3><p><strong>语雀自研之路</strong></p><h2 id="前端文档性能" tabindex="-1">前端文档性能 <a class="header-anchor" href="#前端文档性能" aria-label="Permalink to &quot;前端文档性能&quot;">​</a></h2><h3 id="大数据" tabindex="-1">大数据 <a class="header-anchor" href="#大数据" aria-label="Permalink to &quot;大数据&quot;">​</a></h3><blockquote><p>成千上百万的节点不可能一次性渲染出来，对于浏览器来说是一笔巨大的开销</p></blockquote><h3 id="最大单元格数" tabindex="-1">最大单元格数 <a class="header-anchor" href="#最大单元格数" aria-label="Permalink to &quot;最大单元格数&quot;">​</a></h3><blockquote><p>在线文档如何缓存数据，这也是必须值得思考的地方</p></blockquote><h2 id="前端文档展望" tabindex="-1">前端文档展望 <a class="header-anchor" href="#前端文档展望" aria-label="Permalink to &quot;前端文档展望&quot;">​</a></h2><h3 id="复杂度" tabindex="-1">复杂度 <a class="header-anchor" href="#复杂度" aria-label="Permalink to &quot;复杂度&quot;">​</a></h3><p>前端文档的复杂度很高，它的细腻程度非常之细，像语雀这种在线表格自研之路，考虑的问题很多；我作为一个普通开发者来说，开发的成本很大，但是前端文档非常值得思考，包括技术储备（数据结构性能优化）以及冷门的API学习都要串联起来</p><h3 id="未来" tabindex="-1">未来 <a class="header-anchor" href="#未来" aria-label="Permalink to &quot;未来&quot;">​</a></h3><p>前端文档是一个深耕并且值得投入的领域，用户的体验累积，会打造出越来越完美的前端文档</p><p>END</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/advanced/devServer.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>热重载</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>HtmlWebpackPlugin 解析</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">range.</span><span style="color:#6F42C1;">surroundContents</span><span style="color:#24292E;">(span);</span></span></code></pre></div><h4 id="操作范围-dom2" tabindex="-1">操作范围 DOM2 <a class="header-anchor" href="#操作范围-dom2" aria-label="Permalink to &quot;操作范围 DOM2&quot;">​</a></h4><blockquote><p>document.createRange()</p></blockquote><ol><li>简单选择 DOM 范围</li><li>复杂选择 DOM 范围</li><li>操作 DOM 范围中的内容</li><li>插入 DOM 范围中的内容</li><li>折叠 DOM 范围</li><li>比较 DOM 范围</li></ol><h4 id="复合事件" tabindex="-1">复合事件 <a class="header-anchor" href="#复合事件" aria-label="Permalink to &quot;复合事件&quot;">​</a></h4><ul><li>compositionstart：在 IME 的文本复合系统打开时触发，表示要开始输入了</li><li>compositionupdate：在向输入字段中插入新字符时触发</li><li>compositionend：在 IME 的文本复合系统关闭时触发，表示返回正常键盘输入状态</li></ul><h2 id="前端文档深思考" tabindex="-1">前端文档深思考 <a class="header-anchor" href="#前端文档深思考" aria-label="Permalink to &quot;前端文档深思考&quot;">​</a></h2><blockquote><p>前端文档的技术该如何选择以及采坑？</p></blockquote><h3 id="同构表vs异构表" tabindex="-1">同构表VS异构表 <a class="header-anchor" href="#同构表vs异构表" aria-label="Permalink to &quot;同构表VS异构表&quot;">​</a></h3><h3 id="文档技术" tabindex="-1">文档技术 <a class="header-anchor" href="#文档技术" aria-label="Permalink to &quot;文档技术&quot;">​</a></h3><h3 id="在线协同" tabindex="-1">在线协同 <a class="header-anchor" href="#在线协同" aria-label="Permalink to &quot;在线协同&quot;">​</a></h3><h2 id="前端文档应用" tabindex="-1">前端文档应用 <a class="header-anchor" href="#前端文档应用" aria-label="Permalink to &quot;前端文档应用&quot;">​</a></h2><p>来看看一些用过的在线文档编辑设计思路以及架构模式</p><h3 id="钉钉" tabindex="-1">钉钉 <a class="header-anchor" href="#钉钉" aria-label="Permalink to &quot;钉钉&quot;">​</a></h3><p><strong>菜鸟业务WebExcel</strong></p><h3 id="语雀" tabindex="-1">语雀 <a class="header-anchor" href="#语雀" aria-label="Permalink to &quot;语雀&quot;">​</a></h3><p><strong>语雀自研之路</strong></p><h2 id="前端文档性能" tabindex="-1">前端文档性能 <a class="header-anchor" href="#前端文档性能" aria-label="Permalink to &quot;前端文档性能&quot;">​</a></h2><h3 id="大数据" tabindex="-1">大数据 <a class="header-anchor" href="#大数据" aria-label="Permalink to &quot;大数据&quot;">​</a></h3><blockquote><p>成千上百万的节点不可能一次性渲染出来，对于浏览器来说是一笔巨大的开销</p></blockquote><h3 id="最大单元格数" tabindex="-1">最大单元格数 <a class="header-anchor" href="#最大单元格数" aria-label="Permalink to &quot;最大单元格数&quot;">​</a></h3><blockquote><p>在线文档如何缓存数据，这也是必须值得思考的地方</p></blockquote><h2 id="前端文档展望" tabindex="-1">前端文档展望 <a class="header-anchor" href="#前端文档展望" aria-label="Permalink to &quot;前端文档展望&quot;">​</a></h2><h3 id="复杂度" tabindex="-1">复杂度 <a class="header-anchor" href="#复杂度" aria-label="Permalink to &quot;复杂度&quot;">​</a></h3><p>前端文档的复杂度很高，它的细腻程度非常之细，像语雀这种在线表格自研之路，考虑的问题很多；我作为一个普通开发者来说，开发的成本很大，但是前端文档非常值得思考，包括技术储备（数据结构性能优化）以及冷门的API学习都要串联起来</p><h3 id="未来" tabindex="-1">未来 <a class="header-anchor" href="#未来" aria-label="Permalink to &quot;未来&quot;">​</a></h3><p>前端文档是一个深耕并且值得投入的领域，用户的体验累积，会打造出越来越完美的前端文档</p><p>END</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/devServer.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>热重载</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/htmlWebpackPlugin.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>HtmlWebpackPlugin 解析</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/htmlWebpackPlugin.html b/articles/advanced/htmlWebpackPlugin.html
index cf5c4f5..12bf9f4 100644
--- a/articles/advanced/htmlWebpackPlugin.html
+++ b/articles/advanced/htmlWebpackPlugin.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>HtmlWepbackPlugin 源码分析 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_htmlWebpackPlugin.md.4a93efb9.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_htmlWebpackPlugin.md.b19e7406.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_htmlWebpackPlugin" data-v-6b87e69f><div><h1 id="htmlwepbackplugin-源码分析" tabindex="-1">HtmlWepbackPlugin 源码分析 <a class="header-anchor" href="#htmlwepbackplugin-源码分析" aria-label="Permalink to &quot;HtmlWepbackPlugin 源码分析&quot;">​</a></h1><p><strong>注：本文中 HWP 即 html-webpack-plugin 缩写</strong></p><p><code>html-webpack-plugin插件实现代码还是挺复杂的，需要与webpack源码配合起来，有兴趣可以查看webpack源码</code></p><hr><h2 id="简易的写一个-hwp-插件" tabindex="-1">简易的写一个 HWP 插件 <a class="header-anchor" href="#简易的写一个-hwp-插件" aria-label="Permalink to &quot;简易的写一个 HWP 插件&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">/**</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_htmlWebpackPlugin" data-v-6b87e69f><div><h1 id="htmlwepbackplugin-源码分析" tabindex="-1">HtmlWepbackPlugin 源码分析 <a class="header-anchor" href="#htmlwepbackplugin-源码分析" aria-label="Permalink to &quot;HtmlWepbackPlugin 源码分析&quot;">​</a></h1><p><strong>注：本文中 HWP 即 html-webpack-plugin 缩写</strong></p><p><code>html-webpack-plugin插件实现代码还是挺复杂的，需要与webpack源码配合起来，有兴趣可以查看webpack源码</code></p><hr><h2 id="简易的写一个-hwp-插件" tabindex="-1">简易的写一个 HWP 插件 <a class="header-anchor" href="#简易的写一个-hwp-插件" aria-label="Permalink to &quot;简易的写一个 HWP 插件&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">/**</span></span>
 <span class="line"><span style="color:#6A737D;"> * 关于如何把webpack的输出文件注入到模板文件当中</span></span>
 <span class="line"><span style="color:#6A737D;"> * 自己注入标签，无任何副作用，自由实现</span></span>
 <span class="line"><span style="color:#6A737D;"> */</span></span>
@@ -425,8 +425,8 @@
 <span class="line"><span style="color:#6A737D;">    &lt;div id=&quot;app&quot;&gt;&lt;/div&gt;</span></span>
 <span class="line"><span style="color:#6A737D;">&lt;/body&gt;</span></span>
 <span class="line"><span style="color:#6A737D;">&lt;/html&gt; </span></span>
-<span class="line"><span style="color:#6A737D;"> */</span></span></code></pre></div><hr><p>关于许多细节点没有处理，可以自行参考 html-webpack-plugin 源码</p><ul><li>能跑一次绝不多跑（编译结果）</li><li>html-webpack-plugin 缓存优化</li></ul><hr></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/advanced/docs.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前端文档</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/knowledge.js" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>前端不知道的扩展</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6A737D;"> */</span></span></code></pre></div><hr><p>关于许多细节点没有处理，可以自行参考 html-webpack-plugin 源码</p><ul><li>能跑一次绝不多跑（编译结果）</li><li>html-webpack-plugin 缓存优化</li></ul><hr></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/docs.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前端文档</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/knowledge.js" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>前端不知道的扩展</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/knowledge.js.html b/articles/advanced/knowledge.js.html
index 6817040..ca7f137 100644
--- a/articles/advanced/knowledge.js.html
+++ b/articles/advanced/knowledge.js.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>你不知道的 JS | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_knowledge.js.md.4f4856e0.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_knowledge.js.md.8a7fac43.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_knowledge_js" data-v-6b87e69f><div><h1 id="你不知道的-js" tabindex="-1">你不知道的 JS <a class="header-anchor" href="#你不知道的-js" aria-label="Permalink to &quot;你不知道的 JS&quot;">​</a></h1><h2 id="matchmedia" tabindex="-1">matchMedia <a class="header-anchor" href="#matchmedia" aria-label="Permalink to &quot;matchMedia&quot;">​</a></h2><ul><li>匹配媒体属性相关的信息</li></ul><blockquote><p>比如</p></blockquote><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 获取系统主题</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_knowledge_js" data-v-6b87e69f><div><h1 id="你不知道的-js" tabindex="-1">你不知道的 JS <a class="header-anchor" href="#你不知道的-js" aria-label="Permalink to &quot;你不知道的 JS&quot;">​</a></h1><h2 id="matchmedia" tabindex="-1">matchMedia <a class="header-anchor" href="#matchmedia" aria-label="Permalink to &quot;matchMedia&quot;">​</a></h2><ul><li>匹配媒体属性相关的信息</li></ul><blockquote><p>比如</p></blockquote><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 获取系统主题</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> mediaQueryList </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> window.</span><span style="color:#B392F0;">matchMedia</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;(prefers-color-scheme: dark)&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#6A737D;">/**</span></span>
@@ -41,8 +41,8 @@
 <span class="line"><span style="color:#6A737D;"> * removeListener</span></span>
 <span class="line"><span style="color:#6A737D;"> * onchange: null</span></span>
 <span class="line"><span style="color:#6A737D;"> * }</span></span>
-<span class="line"><span style="color:#6A737D;"> */</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>HtmlWebpackPlugin 解析</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>MutationObserver</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6A737D;"> */</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/htmlWebpackPlugin.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>HtmlWebpackPlugin 解析</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/mutationObserver.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>MutationObserver</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/mutationObserver.html b/articles/advanced/mutationObserver.html
index d7dd397..d862120 100644
--- a/articles/advanced/mutationObserver.html
+++ b/articles/advanced/mutationObserver.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>MutationObserver | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/mutationObserver.a5873c86.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_mutationObserver.md.cb0eb7f3.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/chunks/mutationObserver.46371927.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_mutationObserver.md.1d6f3539.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_mutationObserver" data-v-6b87e69f><div><h1 id="mutationobserver" tabindex="-1">MutationObserver <a class="header-anchor" href="#mutationobserver" aria-label="Permalink to &quot;MutationObserver&quot;">​</a></h1><h2 id="概念" tabindex="-1">概念 <a class="header-anchor" href="#概念" aria-label="Permalink to &quot;概念&quot;">​</a></h2><blockquote><p>当 DOM 变化时，可以异步执行回调监听 DOM 的变化 监听范围：document, dom subtree, single element, attributes, childNodes, textNode</p></blockquote><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><img src="/learning-docs2/assets/images/mutationObserver.png" alt="mutaion observer browser compatible"><h2 id="用法" tabindex="-1">用法 <a class="header-anchor" href="#用法" aria-label="Permalink to &quot;用法&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;DOM was mutated!&#39;</span><span style="color:#E1E4E8;">));</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> observer </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">MutationObserver</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;DOM was mutated!&#39;</span><span style="color:#24292E;">));</span></span></code></pre></div><h2 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><p>api 介绍</p><h3 id="observe-方法" tabindex="-1">observe 方法 <a class="header-anchor" href="#observe-方法" aria-label="Permalink to &quot;observe 方法&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_mutationObserver" data-v-6b87e69f><div><h1 id="mutationobserver" tabindex="-1">MutationObserver <a class="header-anchor" href="#mutationobserver" aria-label="Permalink to &quot;MutationObserver&quot;">​</a></h1><h2 id="概念" tabindex="-1">概念 <a class="header-anchor" href="#概念" aria-label="Permalink to &quot;概念&quot;">​</a></h2><blockquote><p>当 DOM 变化时，可以异步执行回调监听 DOM 的变化 监听范围：document, dom subtree, single element, attributes, childNodes, textNode</p></blockquote><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><img src="/assets/images/mutationObserver.png" alt="mutaion observer browser compatible"><h2 id="用法" tabindex="-1">用法 <a class="header-anchor" href="#用法" aria-label="Permalink to &quot;用法&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;DOM was mutated!&#39;</span><span style="color:#E1E4E8;">));</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> observer </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">MutationObserver</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;DOM was mutated!&#39;</span><span style="color:#24292E;">));</span></span></code></pre></div><h2 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><p>api 介绍</p><h3 id="observe-方法" tabindex="-1">observe 方法 <a class="header-anchor" href="#observe-方法" aria-label="Permalink to &quot;observe 方法&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;document has changed!!!&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">});</span></span>
 <span class="line"><span style="color:#E1E4E8;">observer.</span><span style="color:#B392F0;">observe</span><span style="color:#E1E4E8;">(document.body, { attributes: </span><span style="color:#79B8FF;">true</span><span style="color:#E1E4E8;"> });</span></span>
@@ -232,8 +232,8 @@
 <span class="line"><span style="color:#24292E;">    characterData: </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">,</span></span>
 <span class="line"><span style="color:#24292E;">    characterDataOldValue: </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">,</span></span>
 <span class="line"><span style="color:#24292E;">    childList: </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">,</span></span>
-<span class="line"><span style="color:#24292E;">})</span></span></code></pre></div><p><code>参数属性介绍</code></p><ul><li><p>subtree</p><p>默认为 false，如果为 false，只监听目标元素的改变，如果为 true，目标元素以及整个结点子树都将被监听改变</p></li><li><p>attributes</p><p>节点的属性改变时，默认为 false</p></li><li><p>attributeFilter</p><p>过滤那些节点的属性不被监听改变，默认观察为所有属性</p></li><li><p>attributeOldValue</p><p>返回属性改变的上一个值，默认为 false</p></li><li><p>characterData</p><p>监听节点的字符数据改变 =&gt; text 文本 comnent 注释 nodes 节点，默认为 false</p></li><li><p>characterDataOldValue</p><p>返回字符数据改变的上一个字符，默认为 false</p></li><li><p>childList</p><p>监听目标节点的子节点的变化，默认为 false</p></li></ul><h3 id="mutationobserver-设计规范" tabindex="-1">MutationObserver 设计规范 <a class="header-anchor" href="#mutationobserver-设计规范" aria-label="Permalink to &quot;MutationObserver 设计规范&quot;">​</a></h3><blockquote><p>规范是为性能而设计的，其设计的核心是异步回调和记录队列模型。为了允许在不降低性能的情况下注册大量的突变，每个合格的突变(由观察者实例决定)的信息被捕获到一个MutationRecord中，然后被记录到一个记录队列中。这个队列对于每个MutationObserver实例是惟一的，它表示每个DOM突变的有序记录。</p></blockquote><h4 id="异步回调和记录队列" tabindex="-1">异步回调和记录队列 <a class="header-anchor" href="#异步回调和记录队列" aria-label="Permalink to &quot;异步回调和记录队列&quot;">​</a></h4><blockquote><p>每次MutationRecord被添加到MutationObserver的记录队列时，观察者回调(最初提供给MutationObserver构造函数)只有在没有已经调度的回调微任务时才被调度为微任务，例如队列长度为&gt; 0。这确保记录队列的内容没有双重回调处理。</p></blockquote><blockquote><p>有可能，在回调的微任务异步执行时，发生的变化比最初计划回调微任务的变化更多。当MutationRecord实例出现在记录队列中时，会向被调用的回调传递一个数组。回调函数负责完整地处理数组中的每个实例，因为它们不会在函数之后持久存在退出。在回调执行之后，预期不再需要每个MutationRecord，因此记录队列被清空，其内容被丢弃</p></blockquote><h4 id="takerecords-方法" tabindex="-1">takeRecords() 方法 <a class="header-anchor" href="#takerecords-方法" aria-label="Permalink to &quot;takeRecords() 方法&quot;">​</a></h4><blockquote><p>使用takeRecords()方法来耗尽MutationObserver实例的记录队列。这将返回队列中存在的MutationRecord实例数组，并清空队列本身</p></blockquote><blockquote><p>当你想调用disconnect()时，又想处理没有结束（pending状态）的mutaion records 实例时，调用takeRecords()方法，这就达到了关闭的效果</p></blockquote><h4 id="性能分析" tabindex="-1">性能分析 <a class="header-anchor" href="#性能分析" aria-label="Permalink to &quot;性能分析&quot;">​</a></h4><blockquote><p>将突变回调的执行委托给一个微任务，可以确保避免事件的同步性和随事件而来的混乱。MutationObserver规范的记录队列实现确保即使是大量的突变事件也不会阻塞浏览器。</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/knowledge.js" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前端不知道的扩展</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/advanced/v8-code.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>V8 解析</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">})</span></span></code></pre></div><p><code>参数属性介绍</code></p><ul><li><p>subtree</p><p>默认为 false，如果为 false，只监听目标元素的改变，如果为 true，目标元素以及整个结点子树都将被监听改变</p></li><li><p>attributes</p><p>节点的属性改变时，默认为 false</p></li><li><p>attributeFilter</p><p>过滤那些节点的属性不被监听改变，默认观察为所有属性</p></li><li><p>attributeOldValue</p><p>返回属性改变的上一个值，默认为 false</p></li><li><p>characterData</p><p>监听节点的字符数据改变 =&gt; text 文本 comnent 注释 nodes 节点，默认为 false</p></li><li><p>characterDataOldValue</p><p>返回字符数据改变的上一个字符，默认为 false</p></li><li><p>childList</p><p>监听目标节点的子节点的变化，默认为 false</p></li></ul><h3 id="mutationobserver-设计规范" tabindex="-1">MutationObserver 设计规范 <a class="header-anchor" href="#mutationobserver-设计规范" aria-label="Permalink to &quot;MutationObserver 设计规范&quot;">​</a></h3><blockquote><p>规范是为性能而设计的，其设计的核心是异步回调和记录队列模型。为了允许在不降低性能的情况下注册大量的突变，每个合格的突变(由观察者实例决定)的信息被捕获到一个MutationRecord中，然后被记录到一个记录队列中。这个队列对于每个MutationObserver实例是惟一的，它表示每个DOM突变的有序记录。</p></blockquote><h4 id="异步回调和记录队列" tabindex="-1">异步回调和记录队列 <a class="header-anchor" href="#异步回调和记录队列" aria-label="Permalink to &quot;异步回调和记录队列&quot;">​</a></h4><blockquote><p>每次MutationRecord被添加到MutationObserver的记录队列时，观察者回调(最初提供给MutationObserver构造函数)只有在没有已经调度的回调微任务时才被调度为微任务，例如队列长度为&gt; 0。这确保记录队列的内容没有双重回调处理。</p></blockquote><blockquote><p>有可能，在回调的微任务异步执行时，发生的变化比最初计划回调微任务的变化更多。当MutationRecord实例出现在记录队列中时，会向被调用的回调传递一个数组。回调函数负责完整地处理数组中的每个实例，因为它们不会在函数之后持久存在退出。在回调执行之后，预期不再需要每个MutationRecord，因此记录队列被清空，其内容被丢弃</p></blockquote><h4 id="takerecords-方法" tabindex="-1">takeRecords() 方法 <a class="header-anchor" href="#takerecords-方法" aria-label="Permalink to &quot;takeRecords() 方法&quot;">​</a></h4><blockquote><p>使用takeRecords()方法来耗尽MutationObserver实例的记录队列。这将返回队列中存在的MutationRecord实例数组，并清空队列本身</p></blockquote><blockquote><p>当你想调用disconnect()时，又想处理没有结束（pending状态）的mutaion records 实例时，调用takeRecords()方法，这就达到了关闭的效果</p></blockquote><h4 id="性能分析" tabindex="-1">性能分析 <a class="header-anchor" href="#性能分析" aria-label="Permalink to &quot;性能分析&quot;">​</a></h4><blockquote><p>将突变回调的执行委托给一个微任务，可以确保避免事件的同步性和随事件而来的混乱。MutationObserver规范的记录队列实现确保即使是大量的突变事件也不会阻塞浏览器。</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/knowledge.js" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>前端不知道的扩展</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/v8-code.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>V8 解析</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/transitionAnimation.html b/articles/advanced/transitionAnimation.html
index 2da237e..404719e 100644
--- a/articles/advanced/transitionAnimation.html
+++ b/articles/advanced/transitionAnimation.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>CSSJS 动画那些事 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_transitionAnimation.md.f629e671.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_transitionAnimation.md.e283b702.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_transitionAnimation" data-v-6b87e69f><div><h1 id="cssjs-动画那些事" tabindex="-1">CSSJS 动画那些事 <a class="header-anchor" href="#cssjs-动画那些事" aria-label="Permalink to &quot;CSSJS 动画那些事&quot;">​</a></h1><p>先来了解一下重绘与回流</p><h2 id="回流与重绘" tabindex="-1">回流与重绘 <a class="header-anchor" href="#回流与重绘" aria-label="Permalink to &quot;回流与重绘&quot;">​</a></h2><p><code>回流必将引起重绘，重绘不一定回流</code></p><p><strong>浏览器工作原理</strong></p><img src="/learning-docs2/assets/images/browser-work.png" alt="浏览器工作原理图"><p><strong>浏览器用户界面</strong></p><img src="/learning-docs2/assets/images/user-interface.png" alt="user interface"><ul><li>重绘 <code>外观发生变化，元素可见性，不会改变布局</code></li><li>回流 <code>重新计算元素的位置和几何形状</code></li></ul><h2 id="css-动画" tabindex="-1">CSS 动画 <a class="header-anchor" href="#css-动画" aria-label="Permalink to &quot;CSS 动画&quot;">​</a></h2><p>先回顾一下 css 的 transition 和 animation 属性</p><ul><li><p>transition 属性</p><ul><li>transition-property: string</li><li>transition-duration: number</li><li>transition-timing-function: cubic-bezier | &#39;ease&#39; | &#39;ease-in&#39; | &#39;ease-in-out&#39; | &#39;ease-out&#39; | steps | step-start | step-middle | step-end</li><li>transition-delay: number</li></ul></li><li><p>animation 属性</p><ul><li>animation-duration: number</li><li>animation-timing-function: ^</li><li>animation-delay: number</li><li>animation-iteration-count: infinite</li><li>animation-direction: alternate | alternate-reverse | reverse</li><li>animation-fill-mode: backwards | forwards | both | none</li><li>animation-play-state: paused | running</li><li>animation-name: string</li></ul></li></ul><h2 id="js-动画" tabindex="-1">JS 动画 <a class="header-anchor" href="#js-动画" aria-label="Permalink to &quot;JS 动画&quot;">​</a></h2><p>接下来介绍一下 js 和 css 结合的动画</p><p>DOM 事件中有: <code>transitionstart, transitionend, animationstart, animationend</code> 事件</p><div class="tip custom-block"><p class="custom-block-title">思考</p><p>enter active leave 三种状态</p></div><p><strong>抛出问题：</strong></p><ol><li><p>我们是否用过 display 切换 block 和 none 两种状态，想实现点动画过渡效果，但是 display 是立即消失立即隐藏？</p></li><li><p>你可能会想到用 settimeout 设置一个时间来控制显示隐藏，而中间恰好利用这段时间来进行动画过渡的操作？</p></li><li><p>那如何在中间这段时间加上动画呢？</p></li></ol><p><code>从以下一个例子中来讲：</code></p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_transitionAnimation" data-v-6b87e69f><div><h1 id="cssjs-动画那些事" tabindex="-1">CSSJS 动画那些事 <a class="header-anchor" href="#cssjs-动画那些事" aria-label="Permalink to &quot;CSSJS 动画那些事&quot;">​</a></h1><p>先来了解一下重绘与回流</p><h2 id="回流与重绘" tabindex="-1">回流与重绘 <a class="header-anchor" href="#回流与重绘" aria-label="Permalink to &quot;回流与重绘&quot;">​</a></h2><p><code>回流必将引起重绘，重绘不一定回流</code></p><p><strong>浏览器工作原理</strong></p><img src="/assets/images/browser-work.png" alt="浏览器工作原理图"><p><strong>浏览器用户界面</strong></p><img src="/assets/images/user-interface.png" alt="user interface"><ul><li>重绘 <code>外观发生变化，元素可见性，不会改变布局</code></li><li>回流 <code>重新计算元素的位置和几何形状</code></li></ul><h2 id="css-动画" tabindex="-1">CSS 动画 <a class="header-anchor" href="#css-动画" aria-label="Permalink to &quot;CSS 动画&quot;">​</a></h2><p>先回顾一下 css 的 transition 和 animation 属性</p><ul><li><p>transition 属性</p><ul><li>transition-property: string</li><li>transition-duration: number</li><li>transition-timing-function: cubic-bezier | &#39;ease&#39; | &#39;ease-in&#39; | &#39;ease-in-out&#39; | &#39;ease-out&#39; | steps | step-start | step-middle | step-end</li><li>transition-delay: number</li></ul></li><li><p>animation 属性</p><ul><li>animation-duration: number</li><li>animation-timing-function: ^</li><li>animation-delay: number</li><li>animation-iteration-count: infinite</li><li>animation-direction: alternate | alternate-reverse | reverse</li><li>animation-fill-mode: backwards | forwards | both | none</li><li>animation-play-state: paused | running</li><li>animation-name: string</li></ul></li></ul><h2 id="js-动画" tabindex="-1">JS 动画 <a class="header-anchor" href="#js-动画" aria-label="Permalink to &quot;JS 动画&quot;">​</a></h2><p>接下来介绍一下 js 和 css 结合的动画</p><p>DOM 事件中有: <code>transitionstart, transitionend, animationstart, animationend</code> 事件</p><div class="tip custom-block"><p class="custom-block-title">思考</p><p>enter active leave 三种状态</p></div><p><strong>抛出问题：</strong></p><ol><li><p>我们是否用过 display 切换 block 和 none 两种状态，想实现点动画过渡效果，但是 display 是立即消失立即隐藏？</p></li><li><p>你可能会想到用 settimeout 设置一个时间来控制显示隐藏，而中间恰好利用这段时间来进行动画过渡的操作？</p></li><li><p>那如何在中间这段时间加上动画呢？</p></li></ol><p><code>从以下一个例子中来讲：</code></p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;点我显示/隐藏&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">style</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#85E89D;">*</span><span style="color:#E1E4E8;"> {</span></span>
@@ -239,8 +239,8 @@
 <span class="line"><span style="color:#24292E;">  node.style.display </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;none&#39;</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">  node.</span><span style="color:#6F42C1;">removeEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;transitionend&#39;</span><span style="color:#24292E;">);</span></span>
 <span class="line"><span style="color:#24292E;">}</span></span>
-<span class="line"><span style="color:#24292E;">node.</span><span style="color:#6F42C1;">addEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;transitionend&#39;</span><span style="color:#24292E;">, end.</span><span style="color:#6F42C1;">bind</span><span style="color:#24292E;">(</span><span style="color:#005CC5;">null</span><span style="color:#24292E;">, node));</span></span></code></pre></div><ol start="2"><li>🏀 连续点击了多次，如何处理过渡或者动画？</li><li>🆚 transitionstart, transitionend, animationstart, animationend 使用场景？</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>阅读前瞻</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">node.</span><span style="color:#6F42C1;">addEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;transitionend&#39;</span><span style="color:#24292E;">, end.</span><span style="color:#6F42C1;">bind</span><span style="color:#24292E;">(</span><span style="color:#005CC5;">null</span><span style="color:#24292E;">, node));</span></span></code></pre></div><ol start="2"><li>🏀 连续点击了多次，如何处理过渡或者动画？</li><li>🆚 transitionstart, transitionend, animationstart, animationend 使用场景？</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>阅读前瞻</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/v8-code.html b/articles/advanced/v8-code.html
index 707cbd9..86e67a9 100644
--- a/articles/advanced/v8-code.html
+++ b/articles/advanced/v8-code.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>V8 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_v8-code.md.40cd5ff2.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_v8-code.md.aa1e9c3f.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_v8-code" data-v-6b87e69f><div><h1 id="v8" tabindex="-1">V8 <a class="header-anchor" href="#v8" aria-label="Permalink to &quot;V8&quot;">​</a></h1><h2 id="解释器和执行器" tabindex="-1">解释器和执行器 <a class="header-anchor" href="#解释器和执行器" aria-label="Permalink to &quot;解释器和执行器&quot;">​</a></h2><img src="/learning-docs2/assets/images/compiler.jpg" alt="解释器和执行器"><ul><li><p>在编译型语言的编译过程中，编译器首先会依次对源代码进行词法分析、语法分析，生成抽象语法树（AST），然后是优化代码，最后再生成处理器能够理解的机器码。如果编译成功，将会生成一个可执行的文件。但如果编译过程发生了语法或者其他的错误，那么编译器就会抛出异常，最后的二进制文件也不会生成成功</p></li><li><p>在解释型语言的解释过程中，同样解释器也会对源代码进行词法分析、语法分析，并生成抽象语法树（AST），不过它会再基于抽象语法树生成字节码，最后再根据字节码来执行程序、输出结果</p></li></ul><h2 id="v8-执行代码" tabindex="-1">V8 执行代码 <a class="header-anchor" href="#v8-执行代码" aria-label="Permalink to &quot;V8 执行代码&quot;">​</a></h2><img src="/learning-docs2/assets/images/v8-code.jpg" alt="v8 执行代码"><h3 id="生成抽象语法树和执行上下文" tabindex="-1">生成抽象语法树和执行上下文 <a class="header-anchor" href="#生成抽象语法树和执行上下文" aria-label="Permalink to &quot;生成抽象语法树和执行上下文&quot;">​</a></h3><ul><li>分词（tokenize），词法分析</li></ul><p>将源码拆成一个个 token（语法上不能再分的、最小的单个字符或字符串）</p><ul><li>解析（parse），语法分析</li></ul><p>将上一步生成的 token 数据，根据语法规则转成抽象语法树（存在语法错误，会终止抛出错误）</p><h3 id="生成字节码" tabindex="-1">生成字节码 <a class="header-anchor" href="#生成字节码" aria-label="Permalink to &quot;生成字节码&quot;">​</a></h3><p>字节码是介于 AST 和机器码之间的一种代码。但是与特定类型的机器码无关，字节码需要通过解释器将其转换为机器码后才能执行（体积小）</p><h3 id="执行代码" tabindex="-1">执行代码 <a class="header-anchor" href="#执行代码" aria-label="Permalink to &quot;执行代码&quot;">​</a></h3><p>解释器 Ignition</p><ul><li>第一次执行的字节码，解释器逐条解释执行</li><li>解释器解析生成字节码，还有一个作用就是解释执行字节码</li><li>执行字节码过程中，有热点代码（重复执行多次），后台编译器（TurboFan）把这段代码编译成机器码，提高执行效率</li></ul><p><code>JIT 即时编译</code></p><p>解释器 Ignition 在解释执行字节码的同时，收集代码信息，发现是热点代码之后，TurboFan 编译器把热点的字节码编译成机器码，并保存起来以供下次使用</p><h2 id="垃圾回收" tabindex="-1">垃圾回收 <a class="header-anchor" href="#垃圾回收" aria-label="Permalink to &quot;垃圾回收&quot;">​</a></h2><p><a href="https://time.geekbang.org/column/article/131233" target="_blank" rel="noreferrer">V8 的垃圾回收</a></p><h3 id="栈空间" tabindex="-1">栈空间 <a class="header-anchor" href="#栈空间" aria-label="Permalink to &quot;栈空间&quot;">​</a></h3><p>原始数据类型存放与栈空间中</p><p><code>函数执行上下文 -&gt; 全局执行上下文（采用调用栈的形式记录数据）</code></p><h3 id="堆空间" tabindex="-1">堆空间 <a class="header-anchor" href="#堆空间" aria-label="Permalink to &quot;堆空间&quot;">​</a></h3><p>引用类型使用堆空间存储（栈中存储的是引用地址）</p><h3 id="堆空间的垃圾回收" tabindex="-1">堆空间的垃圾回收 <a class="header-anchor" href="#堆空间的垃圾回收" aria-label="Permalink to &quot;堆空间的垃圾回收&quot;">​</a></h3><blockquote><p>代际假说</p></blockquote><ol><li>对象一般不会存储太久，一经分配内存，很快就会变得不可访问</li><li>不死的对象活的更久</li></ol><h3 id="新生代" tabindex="-1">新生代 <a class="header-anchor" href="#新生代" aria-label="Permalink to &quot;新生代&quot;">​</a></h3><p>对象存放的时间较短（1-8M 的存储空间）</p><h3 id="老生代" tabindex="-1">老生代 <a class="header-anchor" href="#老生代" aria-label="Permalink to &quot;老生代&quot;">​</a></h3><p>对象存放的时间较长</p><h3 id="垃圾回收流程" tabindex="-1">垃圾回收流程 <a class="header-anchor" href="#垃圾回收流程" aria-label="Permalink to &quot;垃圾回收流程&quot;">​</a></h3><p>所有垃圾回收机制，都有一套完整的统一流程</p><ul><li>标记空间中的活动对象和非活动对象 <ul><li>活动对象 = 正在使用中的对象</li><li>非活动对象 = 需要垃圾回收的对象</li></ul></li><li>回收非活动对象占用的空间 <ul><li>所有标记完成之后，统一清理内存中所有被标记为可回收的对象</li></ul></li><li>内存整理 <ul><li>整理内存碎片（不连续的内存空间）</li></ul></li></ul><h3 id="副垃圾回收器" tabindex="-1">副垃圾回收器 <a class="header-anchor" href="#副垃圾回收器" aria-label="Permalink to &quot;副垃圾回收器&quot;">​</a></h3><p>主要负责新生代区间的垃圾回收</p><blockquote><p>Scanvenge 算法 -&gt; 新生区区间划分为两个区域：对象区域、空闲区域</p></blockquote><ul><li><p>新加入的对象会加入对象区域，对象区域存满之后，会执行一次垃圾回收操作</p></li><li><p>对对象区域中的垃圾进行标记</p></li><li><p>标记完毕，副垃圾回收器会对没有进行标记的对象进行复制，<code>复制</code>到空闲区域，同时还会排列起来（内存整理）</p></li><li><p>对象区域和空闲区域角色反转（对象区域=空闲区域 空闲区域=对象区域）两块区域重复利用</p></li></ul><blockquote><p>对象晋升策略</p></blockquote><p>为了执行效率，新生代的空间一般不会设置得太大，因此<code>经过两次垃圾回收的活动对象依然存在</code>，会被放入到老生代区间中</p><h3 id="主垃圾回收器" tabindex="-1">主垃圾回收器 <a class="header-anchor" href="#主垃圾回收器" aria-label="Permalink to &quot;主垃圾回收器&quot;">​</a></h3><p>主要负责老生代区间的垃圾回收</p><ul><li>空间大</li><li>对象存活时间长</li></ul><blockquote><p>标记 - 清除（Mark - Sweep）</p></blockquote><ul><li>从一组根元素开始</li><li>递归遍历根元素（能访问到的元素为活动对象，不能访问到的元素为垃圾数据）</li></ul><blockquote><p>标记 - 整理（Mark - Compact）</p></blockquote><p>标记清除算法会产生大量的不连续内存碎片，导致大对象无法分配一块连续空间的内存</p><ul><li>所有的活动对象都向一端移动，然后直接清理掉端边界以外的内存</li></ul><h3 id="全停顿" tabindex="-1">全停顿 <a class="header-anchor" href="#全停顿" aria-label="Permalink to &quot;全停顿&quot;">​</a></h3><p>Stop-The-World</p><p><code>JavaScript 是运行在主线程之上，一旦执行垃圾回收算法，脚本执行需要停顿，待垃圾回收完毕之后恢复脚本的执行</code></p><h3 id="增量标记" tabindex="-1">增量标记 <a class="header-anchor" href="#增量标记" aria-label="Permalink to &quot;增量标记&quot;">​</a></h3><p>Incremental Marking</p><p>全停顿算法，一旦垃圾回收算法执行时间过长，页面会出现卡顿现象，导致用户体验下降</p><ul><li>一个完整的垃圾回收任务拆分成很小的任务</li><li>小任务执行时间很短，穿插在 JavaScript 任务中</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>MutationObserver</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/advanced/virtualList.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>虚拟列表</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_v8-code" data-v-6b87e69f><div><h1 id="v8" tabindex="-1">V8 <a class="header-anchor" href="#v8" aria-label="Permalink to &quot;V8&quot;">​</a></h1><h2 id="解释器和执行器" tabindex="-1">解释器和执行器 <a class="header-anchor" href="#解释器和执行器" aria-label="Permalink to &quot;解释器和执行器&quot;">​</a></h2><img src="/assets/images/compiler.jpg" alt="解释器和执行器"><ul><li><p>在编译型语言的编译过程中，编译器首先会依次对源代码进行词法分析、语法分析，生成抽象语法树（AST），然后是优化代码，最后再生成处理器能够理解的机器码。如果编译成功，将会生成一个可执行的文件。但如果编译过程发生了语法或者其他的错误，那么编译器就会抛出异常，最后的二进制文件也不会生成成功</p></li><li><p>在解释型语言的解释过程中，同样解释器也会对源代码进行词法分析、语法分析，并生成抽象语法树（AST），不过它会再基于抽象语法树生成字节码，最后再根据字节码来执行程序、输出结果</p></li></ul><h2 id="v8-执行代码" tabindex="-1">V8 执行代码 <a class="header-anchor" href="#v8-执行代码" aria-label="Permalink to &quot;V8 执行代码&quot;">​</a></h2><img src="/assets/images/v8-code.jpg" alt="v8 执行代码"><h3 id="生成抽象语法树和执行上下文" tabindex="-1">生成抽象语法树和执行上下文 <a class="header-anchor" href="#生成抽象语法树和执行上下文" aria-label="Permalink to &quot;生成抽象语法树和执行上下文&quot;">​</a></h3><ul><li>分词（tokenize），词法分析</li></ul><p>将源码拆成一个个 token（语法上不能再分的、最小的单个字符或字符串）</p><ul><li>解析（parse），语法分析</li></ul><p>将上一步生成的 token 数据，根据语法规则转成抽象语法树（存在语法错误，会终止抛出错误）</p><h3 id="生成字节码" tabindex="-1">生成字节码 <a class="header-anchor" href="#生成字节码" aria-label="Permalink to &quot;生成字节码&quot;">​</a></h3><p>字节码是介于 AST 和机器码之间的一种代码。但是与特定类型的机器码无关，字节码需要通过解释器将其转换为机器码后才能执行（体积小）</p><h3 id="执行代码" tabindex="-1">执行代码 <a class="header-anchor" href="#执行代码" aria-label="Permalink to &quot;执行代码&quot;">​</a></h3><p>解释器 Ignition</p><ul><li>第一次执行的字节码，解释器逐条解释执行</li><li>解释器解析生成字节码，还有一个作用就是解释执行字节码</li><li>执行字节码过程中，有热点代码（重复执行多次），后台编译器（TurboFan）把这段代码编译成机器码，提高执行效率</li></ul><p><code>JIT 即时编译</code></p><p>解释器 Ignition 在解释执行字节码的同时，收集代码信息，发现是热点代码之后，TurboFan 编译器把热点的字节码编译成机器码，并保存起来以供下次使用</p><h2 id="垃圾回收" tabindex="-1">垃圾回收 <a class="header-anchor" href="#垃圾回收" aria-label="Permalink to &quot;垃圾回收&quot;">​</a></h2><p><a href="https://time.geekbang.org/column/article/131233" target="_blank" rel="noreferrer">V8 的垃圾回收</a></p><h3 id="栈空间" tabindex="-1">栈空间 <a class="header-anchor" href="#栈空间" aria-label="Permalink to &quot;栈空间&quot;">​</a></h3><p>原始数据类型存放与栈空间中</p><p><code>函数执行上下文 -&gt; 全局执行上下文（采用调用栈的形式记录数据）</code></p><h3 id="堆空间" tabindex="-1">堆空间 <a class="header-anchor" href="#堆空间" aria-label="Permalink to &quot;堆空间&quot;">​</a></h3><p>引用类型使用堆空间存储（栈中存储的是引用地址）</p><h3 id="堆空间的垃圾回收" tabindex="-1">堆空间的垃圾回收 <a class="header-anchor" href="#堆空间的垃圾回收" aria-label="Permalink to &quot;堆空间的垃圾回收&quot;">​</a></h3><blockquote><p>代际假说</p></blockquote><ol><li>对象一般不会存储太久，一经分配内存，很快就会变得不可访问</li><li>不死的对象活的更久</li></ol><h3 id="新生代" tabindex="-1">新生代 <a class="header-anchor" href="#新生代" aria-label="Permalink to &quot;新生代&quot;">​</a></h3><p>对象存放的时间较短（1-8M 的存储空间）</p><h3 id="老生代" tabindex="-1">老生代 <a class="header-anchor" href="#老生代" aria-label="Permalink to &quot;老生代&quot;">​</a></h3><p>对象存放的时间较长</p><h3 id="垃圾回收流程" tabindex="-1">垃圾回收流程 <a class="header-anchor" href="#垃圾回收流程" aria-label="Permalink to &quot;垃圾回收流程&quot;">​</a></h3><p>所有垃圾回收机制，都有一套完整的统一流程</p><ul><li>标记空间中的活动对象和非活动对象 <ul><li>活动对象 = 正在使用中的对象</li><li>非活动对象 = 需要垃圾回收的对象</li></ul></li><li>回收非活动对象占用的空间 <ul><li>所有标记完成之后，统一清理内存中所有被标记为可回收的对象</li></ul></li><li>内存整理 <ul><li>整理内存碎片（不连续的内存空间）</li></ul></li></ul><h3 id="副垃圾回收器" tabindex="-1">副垃圾回收器 <a class="header-anchor" href="#副垃圾回收器" aria-label="Permalink to &quot;副垃圾回收器&quot;">​</a></h3><p>主要负责新生代区间的垃圾回收</p><blockquote><p>Scanvenge 算法 -&gt; 新生区区间划分为两个区域：对象区域、空闲区域</p></blockquote><ul><li><p>新加入的对象会加入对象区域，对象区域存满之后，会执行一次垃圾回收操作</p></li><li><p>对对象区域中的垃圾进行标记</p></li><li><p>标记完毕，副垃圾回收器会对没有进行标记的对象进行复制，<code>复制</code>到空闲区域，同时还会排列起来（内存整理）</p></li><li><p>对象区域和空闲区域角色反转（对象区域=空闲区域 空闲区域=对象区域）两块区域重复利用</p></li></ul><blockquote><p>对象晋升策略</p></blockquote><p>为了执行效率，新生代的空间一般不会设置得太大，因此<code>经过两次垃圾回收的活动对象依然存在</code>，会被放入到老生代区间中</p><h3 id="主垃圾回收器" tabindex="-1">主垃圾回收器 <a class="header-anchor" href="#主垃圾回收器" aria-label="Permalink to &quot;主垃圾回收器&quot;">​</a></h3><p>主要负责老生代区间的垃圾回收</p><ul><li>空间大</li><li>对象存活时间长</li></ul><blockquote><p>标记 - 清除（Mark - Sweep）</p></blockquote><ul><li>从一组根元素开始</li><li>递归遍历根元素（能访问到的元素为活动对象，不能访问到的元素为垃圾数据）</li></ul><blockquote><p>标记 - 整理（Mark - Compact）</p></blockquote><p>标记清除算法会产生大量的不连续内存碎片，导致大对象无法分配一块连续空间的内存</p><ul><li>所有的活动对象都向一端移动，然后直接清理掉端边界以外的内存</li></ul><h3 id="全停顿" tabindex="-1">全停顿 <a class="header-anchor" href="#全停顿" aria-label="Permalink to &quot;全停顿&quot;">​</a></h3><p>Stop-The-World</p><p><code>JavaScript 是运行在主线程之上，一旦执行垃圾回收算法，脚本执行需要停顿，待垃圾回收完毕之后恢复脚本的执行</code></p><h3 id="增量标记" tabindex="-1">增量标记 <a class="header-anchor" href="#增量标记" aria-label="Permalink to &quot;增量标记&quot;">​</a></h3><p>Incremental Marking</p><p>全停顿算法，一旦垃圾回收算法执行时间过长，页面会出现卡顿现象，导致用户体验下降</p><ul><li>一个完整的垃圾回收任务拆分成很小的任务</li><li>小任务执行时间很短，穿插在 JavaScript 任务中</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/mutationObserver.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>MutationObserver</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/virtualList.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>虚拟列表</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/advanced/virtualList.html b/articles/advanced/virtualList.html
index a4cc751..eae1544 100644
--- a/articles/advanced/virtualList.html
+++ b/articles/advanced/virtualList.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>PC虚拟列表如何处理 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_advanced_virtualList.md.6b763d2e.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_advanced_virtualList.md.0c9b0049.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_advanced_virtualList" data-v-6b87e69f><div><h1 id="pc虚拟列表如何处理" tabindex="-1">PC虚拟列表如何处理 <a class="header-anchor" href="#pc虚拟列表如何处理" aria-label="Permalink to &quot;PC虚拟列表如何处理&quot;">​</a></h1><img src="/learning-docs2/assets/images/virtual_list.png"><p><code>针对场景</code></p><blockquote><p>页面需要渲染上千个上万个节点甚至更多，导致页面卡顿</p></blockquote><h2 id="常见解决方案" tabindex="-1">常见解决方案 <a class="header-anchor" href="#常见解决方案" aria-label="Permalink to &quot;常见解决方案&quot;">​</a></h2><ul><li>分页</li><li>滚动到底部加载（如果不对上一页数据节点处理，照样会造成页面节点太多卡顿的问题）</li></ul><h2 id="iscroll-方案-使用-transform-或者-top" tabindex="-1">IScroll 方案 (使用 transform 或者 top) <a class="header-anchor" href="#iscroll-方案-使用-transform-或者-top" aria-label="Permalink to &quot;IScroll 方案 (使用 transform 或者 top)&quot;">​</a></h2><p>假设：固定渲染每页大小 10 条，每一项高度固定 100</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">style</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;overflow: auto;&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_advanced_virtualList" data-v-6b87e69f><div><h1 id="pc虚拟列表如何处理" tabindex="-1">PC虚拟列表如何处理 <a class="header-anchor" href="#pc虚拟列表如何处理" aria-label="Permalink to &quot;PC虚拟列表如何处理&quot;">​</a></h1><img src="/assets/images/virtual_list.png"><p><code>针对场景</code></p><blockquote><p>页面需要渲染上千个上万个节点甚至更多，导致页面卡顿</p></blockquote><h2 id="常见解决方案" tabindex="-1">常见解决方案 <a class="header-anchor" href="#常见解决方案" aria-label="Permalink to &quot;常见解决方案&quot;">​</a></h2><ul><li>分页</li><li>滚动到底部加载（如果不对上一页数据节点处理，照样会造成页面节点太多卡顿的问题）</li></ul><h2 id="iscroll-方案-使用-transform-或者-top" tabindex="-1">IScroll 方案 (使用 transform 或者 top) <a class="header-anchor" href="#iscroll-方案-使用-transform-或者-top" aria-label="Permalink to &quot;IScroll 方案 (使用 transform 或者 top)&quot;">​</a></h2><p>假设：固定渲染每页大小 10 条，每一项高度固定 100</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">style</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;overflow: auto;&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;scroll-container&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">style</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;position: absolute; width: 100%;&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">    &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;row&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">style</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;position: absolute; top: 0px; height: 100px; width: 100%;&quot;</span><span style="color:#E1E4E8;">&gt;1&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">    ...</span></span>
@@ -253,8 +253,8 @@
 <span class="line"><span style="color:#24292E;">}</span></span>
 <span class="line"><span style="color:#6A737D;">// 渲染数据</span></span>
 <span class="line"><span style="color:#24292E;">[].slice.</span><span style="color:#6F42C1;">call</span><span style="color:#24292E;">(data, Math.</span><span style="color:#6F42C1;">max</span><span style="color:#24292E;">(</span><span style="color:#005CC5;">0</span><span style="color:#24292E;">, startIndex </span><span style="color:#D73A49;">-</span><span style="color:#24292E;"> overscancount), Math.</span><span style="color:#6F42C1;">max</span><span style="color:#24292E;">(</span><span style="color:#005CC5;">0</span><span style="color:#24292E;">, Math.</span><span style="color:#6F42C1;">min</span><span style="color:#24292E;">(stopIndex </span><span style="color:#D73A49;">+</span><span style="color:#24292E;"> overscancount, itemCount </span><span style="color:#D73A49;">-</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">1</span><span style="color:#24292E;">)))</span></span>
-<span class="line"><span style="color:#6A737D;">/* end */</span></span></code></pre></div><p><strong>补充</strong></p><ul><li>计算开始位置 react-window 采用的是二分查找的方式来确定偏移量最接近滚动偏移位置（有兴趣可以看看 react-window 源码）</li></ul><h2 id="写在最后" tabindex="-1">写在最后 <a class="header-anchor" href="#写在最后" aria-label="Permalink to &quot;写在最后&quot;">​</a></h2><ul><li>如果上述描述不对，还请多多指点</li></ul><p>End</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-02-02T08:56:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/advanced/v8-code.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>V8 解析</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/servers/ecs.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ECS</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6A737D;">/* end */</span></span></code></pre></div><p><strong>补充</strong></p><ul><li>计算开始位置 react-window 采用的是二分查找的方式来确定偏移量最接近滚动偏移位置（有兴趣可以看看 react-window 源码）</li></ul><h2 id="写在最后" tabindex="-1">写在最后 <a class="header-anchor" href="#写在最后" aria-label="Permalink to &quot;写在最后&quot;">​</a></h2><ul><li>如果上述描述不对，还请多多指点</li></ul><p>End</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-02-02T08:56:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/v8-code.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>V8 解析</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/servers/ecs.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ECS</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/clipboard.html b/articles/basic/clipboard.html
index b6131e8..41bccb0 100644
--- a/articles/basic/clipboard.html
+++ b/articles/basic/clipboard.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>JS 如何实现复制 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_clipboard.md.b53c3e95.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_clipboard.md.a48ade2d.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_clipboard" data-v-6b87e69f><div><h1 id="js-如何实现复制" tabindex="-1">JS 如何实现复制 <a class="header-anchor" href="#js-如何实现复制" aria-label="Permalink to &quot;JS 如何实现复制&quot;">​</a></h1><h2 id="document-execcommand" tabindex="-1">document.execCommand <span class="VPBadge warn" data-v-9613cc9f><!--[-->Deprecated<!--]--></span> <a class="header-anchor" href="#document-execcommand" aria-label="Permalink to &quot;document.execCommand &lt;Badge text=&quot;Deprecated&quot; type=&quot;warn&quot;/&gt;&quot;">​</a></h2><p>Web 规范中表示 <code>document.exceCommand</code> 不会再支持了，但是有些浏览器还是可以继续支持</p><ul><li>w3c</li><li>whatwg</li><li>mdn</li></ul><h3 id="实现" tabindex="-1">实现 <a class="header-anchor" href="#实现" aria-label="Permalink to &quot;实现&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;btn&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">date-text</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;copy me&quot;</span><span style="color:#E1E4E8;">&gt;复制&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">button</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">id</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;btn&quot;</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">date-text</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;copy me&quot;</span><span style="color:#24292E;">&gt;复制&lt;</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 这是一种实现方式</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_clipboard" data-v-6b87e69f><div><h1 id="js-如何实现复制" tabindex="-1">JS 如何实现复制 <a class="header-anchor" href="#js-如何实现复制" aria-label="Permalink to &quot;JS 如何实现复制&quot;">​</a></h1><h2 id="document-execcommand" tabindex="-1">document.execCommand <span class="VPBadge warn" data-v-9613cc9f><!--[-->Deprecated<!--]--></span> <a class="header-anchor" href="#document-execcommand" aria-label="Permalink to &quot;document.execCommand &lt;Badge text=&quot;Deprecated&quot; type=&quot;warn&quot;/&gt;&quot;">​</a></h2><p>Web 规范中表示 <code>document.exceCommand</code> 不会再支持了，但是有些浏览器还是可以继续支持</p><ul><li>w3c</li><li>whatwg</li><li>mdn</li></ul><h3 id="实现" tabindex="-1">实现 <a class="header-anchor" href="#实现" aria-label="Permalink to &quot;实现&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;btn&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">date-text</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;copy me&quot;</span><span style="color:#E1E4E8;">&gt;复制&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">button</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">id</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;btn&quot;</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">date-text</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;copy me&quot;</span><span style="color:#24292E;">&gt;复制&lt;</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 这是一种实现方式</span></span>
 <span class="line"><span style="color:#6A737D;">// 还可以采用 textarea 元素选中的方式</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> btn </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> document.</span><span style="color:#B392F0;">getElementById</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;btn&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"></span>
@@ -143,8 +143,8 @@
 <span class="line"><span style="color:#24292E;">  })</span></span>
 <span class="line"><span style="color:#24292E;">  .</span><span style="color:#6F42C1;">catch</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">    console.</span><span style="color:#6F42C1;">warn</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;读取失败&#39;</span><span style="color:#24292E;">);</span></span>
-<span class="line"><span style="color:#24292E;">  });</span></span></code></pre></div><h2 id="扩展" tabindex="-1">扩展 <a class="header-anchor" href="#扩展" aria-label="Permalink to &quot;扩展&quot;">​</a></h2><h3 id="mime-type" tabindex="-1">mime type <a class="header-anchor" href="#mime-type" aria-label="Permalink to &quot;mime type&quot;">​</a></h3><p><a href="https://www.iana.org/assignments/media-types/media-types.xhtml" target="_blank" rel="noreferrer">MIME TYPE 媒体类型</a></p><ul><li>text/plain</li><li>application/json</li><li>image/png</li><li>...</li></ul><h3 id="blob" tabindex="-1">Blob <a class="header-anchor" href="#blob" aria-label="Permalink to &quot;Blob&quot;">​</a></h3><p><a href="https://developer.mozilla.org/en-US/docs/Web/API/Blob" target="_blank" rel="noreferrer">Blob</a></p><p>创建 Blob 对象是一个不可变的原始数据的类文件对象，可以作为文本或二进制数据读取，也可以转换位 ReadableStream 以便其方法可以可用于处理数据</p><blockquote><p>实例属性</p></blockquote><ul><li>size</li><li>type === mime type 类型</li></ul><blockquote><p>实例方法</p></blockquote><ul><li>arrayBuffer 返回一个数组 buffer 二进制数据</li><li>slice 返回一个新的 Blob 对象包含指定的范围的字节调用</li><li>stream 返回一个可以被 ReadableStream 读取的流</li><li>text 返回一个 Promise resolve UTF-8 类型的文本数据</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>阅读前瞻</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/color_convert.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>颜色转换</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">  });</span></span></code></pre></div><h2 id="扩展" tabindex="-1">扩展 <a class="header-anchor" href="#扩展" aria-label="Permalink to &quot;扩展&quot;">​</a></h2><h3 id="mime-type" tabindex="-1">mime type <a class="header-anchor" href="#mime-type" aria-label="Permalink to &quot;mime type&quot;">​</a></h3><p><a href="https://www.iana.org/assignments/media-types/media-types.xhtml" target="_blank" rel="noreferrer">MIME TYPE 媒体类型</a></p><ul><li>text/plain</li><li>application/json</li><li>image/png</li><li>...</li></ul><h3 id="blob" tabindex="-1">Blob <a class="header-anchor" href="#blob" aria-label="Permalink to &quot;Blob&quot;">​</a></h3><p><a href="https://developer.mozilla.org/en-US/docs/Web/API/Blob" target="_blank" rel="noreferrer">Blob</a></p><p>创建 Blob 对象是一个不可变的原始数据的类文件对象，可以作为文本或二进制数据读取，也可以转换位 ReadableStream 以便其方法可以可用于处理数据</p><blockquote><p>实例属性</p></blockquote><ul><li>size</li><li>type === mime type 类型</li></ul><blockquote><p>实例方法</p></blockquote><ul><li>arrayBuffer 返回一个数组 buffer 二进制数据</li><li>slice 返回一个新的 Blob 对象包含指定的范围的字节调用</li><li>stream 返回一个可以被 ReadableStream 读取的流</li><li>text 返回一个 Promise resolve UTF-8 类型的文本数据</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>阅读前瞻</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/color_convert.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>颜色转换</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/color_convert.html b/articles/basic/color_convert.html
index 9477bc5..daafa28 100644
--- a/articles/basic/color_convert.html
+++ b/articles/basic/color_convert.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>颜色值变换 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_color_convert.md.8302e80d.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_color_convert.md.2cce2798.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_color_convert" data-v-6b87e69f><div><h1 id="颜色值变换" tabindex="-1">颜色值变换 <a class="header-anchor" href="#颜色值变换" aria-label="Permalink to &quot;颜色值变换&quot;">​</a></h1><h2 id="十六进制转换成-rgb" tabindex="-1">十六进制转换成 RGB <a class="header-anchor" href="#十六进制转换成-rgb" aria-label="Permalink to &quot;十六进制转换成 RGB&quot;">​</a></h2><ul><li>hex to rgb</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// hex to rgb</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_color_convert" data-v-6b87e69f><div><h1 id="颜色值变换" tabindex="-1">颜色值变换 <a class="header-anchor" href="#颜色值变换" aria-label="Permalink to &quot;颜色值变换&quot;">​</a></h1><h2 id="十六进制转换成-rgb" tabindex="-1">十六进制转换成 RGB <a class="header-anchor" href="#十六进制转换成-rgb" aria-label="Permalink to &quot;十六进制转换成 RGB&quot;">​</a></h2><ul><li>hex to rgb</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// hex to rgb</span></span>
 <span class="line"><span style="color:#6A737D;">// hex 形式是 3位 4位 6位</span></span>
 <span class="line"><span style="color:#6A737D;">// hex 多少位补位规则 === chrome css</span></span>
 <span class="line"><span style="color:#6A737D;">// 3位 #efd = #eeffdd</span></span>
@@ -207,8 +207,8 @@
 <span class="line"><span style="color:#24292E;">  }</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#D73A49;">return</span><span style="color:#24292E;"> [h, s, l];</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-19T08:13:46.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/clipboard.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>复制粘贴</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/dom_events.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>DOM 事件流</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-19T08:13:46.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/clipboard.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>复制粘贴</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/dom_events.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>DOM 事件流</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/dom_events.html b/articles/basic/dom_events.html
index 0b12053..df02851 100644
--- a/articles/basic/dom_events.html
+++ b/articles/basic/dom_events.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>DOM BOM 事件流 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_dom_events.md.6bad1c68.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_dom_events.md.70d1d757.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_dom_events" data-v-6b87e69f><div><h1 id="dom-bom-事件流" tabindex="-1">DOM BOM 事件流 <a class="header-anchor" href="#dom-bom-事件流" aria-label="Permalink to &quot;DOM BOM 事件流&quot;">​</a></h1><p>兼容性：IE9、Opera、Firefox、Chrome 和 Safari 支持 DOM 事件流</p><h2 id="事件冒泡" tabindex="-1">事件冒泡 <a class="header-anchor" href="#事件冒泡" aria-label="Permalink to &quot;事件冒泡&quot;">​</a></h2><p>事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，逐级向上传播到较为不具体的节点（文档 document）</p><h2 id="事件捕获" tabindex="-1">事件捕获 <a class="header-anchor" href="#事件捕获" aria-label="Permalink to &quot;事件捕获&quot;">​</a></h2><p>document 文档接收到事件，然后逐级向下传播的到最具体元素接收事件</p><h2 id="事件处理程序" tabindex="-1">事件处理程序 <a class="header-anchor" href="#事件处理程序" aria-label="Permalink to &quot;事件处理程序&quot;">​</a></h2><h3 id="html-事件处理程序" tabindex="-1">HTML 事件处理程序 <a class="header-anchor" href="#html-事件处理程序" aria-label="Permalink to &quot;HTML 事件处理程序&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">onclick</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;</span><span style="color:#B392F0;">alert</span><span style="color:#9ECBFF;">(&#39;HELLO&#39;)&quot;</span><span style="color:#E1E4E8;">&gt;&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">div</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">onclick</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;</span><span style="color:#6F42C1;">alert</span><span style="color:#032F62;">(&#39;HELLO&#39;)&quot;</span><span style="color:#24292E;">&gt;&lt;</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h3 id="dom0-级事件处理程序" tabindex="-1">DOM0 级事件处理程序 <a class="header-anchor" href="#dom0-级事件处理程序" aria-label="Permalink to &quot;DOM0 级事件处理程序&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// &lt;div id=&quot;app&quot;&gt;&lt;/div&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_dom_events" data-v-6b87e69f><div><h1 id="dom-bom-事件流" tabindex="-1">DOM BOM 事件流 <a class="header-anchor" href="#dom-bom-事件流" aria-label="Permalink to &quot;DOM BOM 事件流&quot;">​</a></h1><p>兼容性：IE9、Opera、Firefox、Chrome 和 Safari 支持 DOM 事件流</p><h2 id="事件冒泡" tabindex="-1">事件冒泡 <a class="header-anchor" href="#事件冒泡" aria-label="Permalink to &quot;事件冒泡&quot;">​</a></h2><p>事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，逐级向上传播到较为不具体的节点（文档 document）</p><h2 id="事件捕获" tabindex="-1">事件捕获 <a class="header-anchor" href="#事件捕获" aria-label="Permalink to &quot;事件捕获&quot;">​</a></h2><p>document 文档接收到事件，然后逐级向下传播的到最具体元素接收事件</p><h2 id="事件处理程序" tabindex="-1">事件处理程序 <a class="header-anchor" href="#事件处理程序" aria-label="Permalink to &quot;事件处理程序&quot;">​</a></h2><h3 id="html-事件处理程序" tabindex="-1">HTML 事件处理程序 <a class="header-anchor" href="#html-事件处理程序" aria-label="Permalink to &quot;HTML 事件处理程序&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">onclick</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;</span><span style="color:#B392F0;">alert</span><span style="color:#9ECBFF;">(&#39;HELLO&#39;)&quot;</span><span style="color:#E1E4E8;">&gt;&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">div</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">onclick</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;</span><span style="color:#6F42C1;">alert</span><span style="color:#032F62;">(&#39;HELLO&#39;)&quot;</span><span style="color:#24292E;">&gt;&lt;</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h3 id="dom0-级事件处理程序" tabindex="-1">DOM0 级事件处理程序 <a class="header-anchor" href="#dom0-级事件处理程序" aria-label="Permalink to &quot;DOM0 级事件处理程序&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// &lt;div id=&quot;app&quot;&gt;&lt;/div&gt;</span></span>
 <span class="line"><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">app</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> document.</span><span style="color:#B392F0;">getElementById</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;app&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">app.</span><span style="color:#B392F0;">onclick</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">alert</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;HELLO&#39;</span><span style="color:#E1E4E8;">);</span></span>
@@ -51,8 +51,8 @@
 <span class="line"><span style="color:#6A737D;">// DOM3</span></span>
 <span class="line"><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">isSupported</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> document.implementation.</span><span style="color:#6F42C1;">hasFeature</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;UIEvents&#39;</span><span style="color:#24292E;">, </span><span style="color:#032F62;">&#39;3.0&#39;</span><span style="color:#24292E;">);</span></span></code></pre></div><h3 id="ui事件" tabindex="-1">UI事件 <a class="header-anchor" href="#ui事件" aria-label="Permalink to &quot;UI事件&quot;">​</a></h3><ul><li>DOMActivate 表示元素已经被用户操作（鼠标和键盘）激活；DOM3级事件中已经移除</li><li>load</li></ul><ol><li>页面完全加载(包含图像文件，js文件，css文件等外部资源)触发: window/document</li><li>图像下载完毕触发: img</li><li>嵌入的内容触发：link(style) script</li></ol><ul><li>unload 页面完全卸载或者嵌入的内容完全卸载 window/document</li><li>abort 用户停止下载过程时，如果嵌入的内容没有加载完触发</li><li>error 触发条件：window link script</li><li>select 用户选择input或者textarea字符时触发</li><li>resize 窗口或者框架的大小变化时触发（compatMode 混杂模式 document.documentElement)</li><li>scroll 滚动元素触发</li></ul><h3 id="焦点事件" tabindex="-1">焦点事件 <a class="header-anchor" href="#焦点事件" aria-label="Permalink to &quot;焦点事件&quot;">​</a></h3><ul><li>blur 失去焦点时触发，不冒泡(支持捕获)</li><li>DOMFocusIn 元素获得焦点时触发，冒泡，DOM3遗弃</li><li>DOMFocusOut 元素失去焦点时触发，冒泡，DOM3遗弃</li><li>focus 元素获取焦点时触发，不冒泡(支持捕获)</li><li>focusin 元素获取焦点时触发，冒泡，兼容性：IE5.5+、Safari 5.1+、Opera 11.5+和 Chrome</li><li>focusout 元素失去焦点时触发，冒泡，兼容性：IE5.5+、Safari 5.1+、Opera 11.5+和 Chrome</li></ul><blockquote><p>当焦点从页面中的一个元素移动到另一个元素，触发顺序</p></blockquote><p><code>focusout, focusin, blur, DOMFocusOut, focus, DOMFocusIn</code></p><h3 id="鼠标与滚轮事件" tabindex="-1">鼠标与滚轮事件 <a class="header-anchor" href="#鼠标与滚轮事件" aria-label="Permalink to &quot;鼠标与滚轮事件&quot;">​</a></h3><ul><li>click 单击鼠标按钮（左边按钮）或者enter</li><li>dbclick 双击鼠标按钮</li><li>mousedown 任意鼠标按钮</li><li>mouseenter 鼠标移动从元素外部首次移动到元素范围之内触发（后代子元素不会触发），不冒泡</li><li>mouseleave 鼠标从元素内部移动到外部触发（后代元素不会触发），不冒泡</li><li>mousemove 鼠标在元素内部移动触发</li><li>mouseout 元素移入另一个元素触发</li><li>mouseover 元素外部移入元素边界之内</li><li>mouseup 释放鼠标</li></ul><blockquote><p>点击两次触发顺序</p></blockquote><p><code>mousedown, mouseup, click, mousedown, mouseup, click, dblclick</code></p><p><code>客户区坐标位置</code></p><p>clientX, clientY 不包含滚动距离（视口中x, y距离）</p><p>pageX, pageY 包含滚动距离（鼠标光标在页面中的位置）</p><p>screenX, screenY 相对屏幕（电脑桌面）位置</p><p><code>热键</code></p><p>shiftKey、ctrlKey、altKey 和 metaKey（IE8及之前版本都不支持）</p><p><code>鼠标按钮</code></p><p>button =&gt; 0 没按下 | 1 主鼠标按钮 | 2 次鼠标按钮 | 3 同时主次 | 4 中间 | 5 主中 | 6 中次 | 7 主中次</p><p><code>detail信息</code></p><p>event.detail 计数（事件在某一个元素触发多少次 1开始）</p><p><code>鼠标滚轮事件</code></p><p>mousewheel, DOMMouseScroll（firefox)</p><h3 id="键盘与文本事件" tabindex="-1">键盘与文本事件 <a class="header-anchor" href="#键盘与文本事件" aria-label="Permalink to &quot;键盘与文本事件&quot;">​</a></h3><p>DOM3级（所有元素都支持，文本框输入文本时最长用到，支持热键）</p><ul><li>keydown 用户按下任意键触发，按住不放时，重复触发</li><li>keypress用户按下任意键触发，按住不放时，重复触发</li><li>keyup 释放键触发</li></ul><blockquote><p>按下字符键触发顺序: keypress keydown keyup 按下非字符键触发顺序：keydown keyup</p></blockquote><p><code>键码</code></p><p>keypress 时间获取键码 =&gt; event =&gt; charCode || keyCode(ASCII码) =&gt; String.fromCharCode 转为实际字符</p><p><code>event.location(什么位置上的键)</code></p><p>0表示默认键盘 | 1表示左侧键盘 | 2表示右侧键盘 | 3表示数字小键盘 | 4表示移动设备键盘 | 5表示手柄</p><ul><li>textInput</li></ul><p><code>textInput VS keypress（两大区别）</code></p><blockquote><ol><li>任何获得焦点的元素都能触发keypress事件，但只有编辑区域才能触发textInput事件</li><li>textInput输入实际字符的键时会触发，keypress按下能够影响文本显示的键</li></ol></blockquote><p><code>event.inputMethod</code></p><p>0不确定输入 | 1键盘输入 | 2粘贴进来 | 3拖放进来 | 4使用IME输入 | 5表单中选择某一项输入 | 6手写输入 | 7语音输入 | 8组合输入 | 9脚本输入</p><h3 id="复合事件" tabindex="-1">复合事件 <a class="header-anchor" href="#复合事件" aria-label="Permalink to &quot;复合事件&quot;">​</a></h3><p>DOM3级 用于处理IME的输入序列</p><ul><li>compositionstart 开始输入</li><li>compositionupdate 输入字段中插入新字符</li><li>compositionend 关闭时触发</li></ul><h3 id="变动事件" tabindex="-1">变动事件 <a class="header-anchor" href="#变动事件" aria-label="Permalink to &quot;变动事件&quot;">​</a></h3><p>DOM发生变化时给出提示 =&gt; mutation</p><ul><li>DOMSubtreeModified DOM结构发生任何变化</li><li>DOMNodeInserted 一个结点作为子节点插入到另一节点时触发</li><li>DOMNodeRemoved 在节点从其父节点移除时触发</li><li>DOMNodeInsertedIntoDocument 插入文档或之后触发（DOMNodeInserted之后触发）</li><li>DOMNodeRemovedFromDocument 从文档中移除之后触发（DOMNodeRemoved之后触发）</li><li>DOMAttrModified 属性修改之后触发</li><li>DOMCharacterDataModified 在文本节点的值改变之后触发</li></ul><ol><li><code>删除节点</code> =&gt; replaceChild | removeChild</li><li><code>插入节点</code> =&gt; appendChild | replaceChild | insertBefore</li></ol><h3 id="html5事件" tabindex="-1">HTML5事件 <a class="header-anchor" href="#html5事件" aria-label="Permalink to &quot;HTML5事件&quot;">​</a></h3><ul><li>contextmenu 单击鼠标右键调出上下文菜单</li></ul><p>事件是冒泡的 =&gt; 阻止默认行为 event.preventDefault() | event.returnValue = false;</p><ul><li>beforeunload 页面卸载前阻止这一操作</li></ul><p>显示的窗口的值：event.returnValue = &#39;message&#39;;</p><ul><li>DOMContentLoaded 形成完整的DOM树之后触发（document | window）</li></ul><p>不用等图像、JavaScript文件、CSS文件下载完毕</p><ul><li>readystatechange</li></ul><p>提供与文档或者元素加载状态有关的信息（5个状态）(event.target.readyState)</p><ol><li>uninitialized(对象存在单尚未初始化)</li><li>loading(对象正在加载数据)</li><li>loaded(对象加载数据完毕)</li><li>interactive(可以操作对象，还没完全加载)</li><li>complete(对象已经加载完毕)</li></ol><h3 id="pageshow-和-pagehide-事件" tabindex="-1">pageshow 和 pagehide 事件 <a class="header-anchor" href="#pageshow-和-pagehide-事件" aria-label="Permalink to &quot;pageshow 和 pagehide 事件&quot;">​</a></h3><p>Firefox Opera =&gt; bfcache(back-forward cache)</p><ol><li>保存页面的状态</li><li>不会触发load事件</li><li>event对象上有个persist属性 =&gt; true</li><li>指定了unload事件处理程序的页面会被排除在bfcache之外</li></ol><h3 id="hashchange" tabindex="-1">hashchange <a class="header-anchor" href="#hashchange" aria-label="Permalink to &quot;hashchange&quot;">​</a></h3><p><strong>判断兼容性 稳妥</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// IE8 文档在 IE7 下运行</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> isSupported </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;onhashchange&#39;</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">in</span><span style="color:#E1E4E8;"> windwo </span><span style="color:#F97583;">&amp;&amp;</span><span style="color:#E1E4E8;"> (document.documentMode </span><span style="color:#F97583;">===</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">undefined</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">||</span><span style="color:#E1E4E8;"> document.documentMode </span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">7</span><span style="color:#E1E4E8;">)</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// IE8 文档在 IE7 下运行</span></span>
-<span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> isSupported </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;onhashchange&#39;</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">in</span><span style="color:#24292E;"> windwo </span><span style="color:#D73A49;">&amp;&amp;</span><span style="color:#24292E;"> (document.documentMode </span><span style="color:#D73A49;">===</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">undefined</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">||</span><span style="color:#24292E;"> document.documentMode </span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">7</span><span style="color:#24292E;">)</span></span></code></pre></div><p>URL 的参数列表（及 URL 中“#”号后面的所有字符串）(window 对象)</p><ol><li>event包含两个属性 oldURL newURL</li><li>使用location.hash获取url hash字符串（#后面的字符串）</li></ol><h3 id="设备事件" tabindex="-1">设备事件 <a class="header-anchor" href="#设备事件" aria-label="Permalink to &quot;设备事件&quot;">​</a></h3><ul><li>orientationchange</li></ul><p>window.orientation =&gt; 0肖像模式 90左旋转的横向模式 -90右旋转的横向模式</p><ul><li>MozOrientation 检测到方向变化触发此事件（加速计支持）</li><li>deviceorientation window对象触发（加速计支持）</li><li>devicemotion 不仅仅是设备方向改变，告诉开发人员设备什么时候开始移动（行走 掉下）</li></ul><h3 id="触摸与手势事件" tabindex="-1">触摸与手势事件 <a class="header-anchor" href="#触摸与手势事件" aria-label="Permalink to &quot;触摸与手势事件&quot;">​</a></h3><ol><li>触摸事件</li></ol><ul><li>touchstart</li><li>touchmove</li><li>touchend</li><li>touchcancel</li></ul><p>顺序（包括鼠标）=&gt; touchstart mouseover mousemove（一次） mousedown mouseup click touchend</p><ol start="2"><li>手势事件</li></ol><ul><li>gensturestart</li><li>gensturechange</li><li>genstureend</li></ul><p>event 对象 =&gt; 标准的鼠标事件 + rotation(0开始 负值表示逆时针旋转 正值表示顺时针旋转) + scale(1开始 两个手指距离变化)</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/color_convert.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>颜色转换</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/eslint.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ESlint 配置</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> isSupported </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;onhashchange&#39;</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">in</span><span style="color:#24292E;"> windwo </span><span style="color:#D73A49;">&amp;&amp;</span><span style="color:#24292E;"> (document.documentMode </span><span style="color:#D73A49;">===</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">undefined</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">||</span><span style="color:#24292E;"> document.documentMode </span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">7</span><span style="color:#24292E;">)</span></span></code></pre></div><p>URL 的参数列表（及 URL 中“#”号后面的所有字符串）(window 对象)</p><ol><li>event包含两个属性 oldURL newURL</li><li>使用location.hash获取url hash字符串（#后面的字符串）</li></ol><h3 id="设备事件" tabindex="-1">设备事件 <a class="header-anchor" href="#设备事件" aria-label="Permalink to &quot;设备事件&quot;">​</a></h3><ul><li>orientationchange</li></ul><p>window.orientation =&gt; 0肖像模式 90左旋转的横向模式 -90右旋转的横向模式</p><ul><li>MozOrientation 检测到方向变化触发此事件（加速计支持）</li><li>deviceorientation window对象触发（加速计支持）</li><li>devicemotion 不仅仅是设备方向改变，告诉开发人员设备什么时候开始移动（行走 掉下）</li></ul><h3 id="触摸与手势事件" tabindex="-1">触摸与手势事件 <a class="header-anchor" href="#触摸与手势事件" aria-label="Permalink to &quot;触摸与手势事件&quot;">​</a></h3><ol><li>触摸事件</li></ol><ul><li>touchstart</li><li>touchmove</li><li>touchend</li><li>touchcancel</li></ul><p>顺序（包括鼠标）=&gt; touchstart mouseover mousemove（一次） mousedown mouseup click touchend</p><ol start="2"><li>手势事件</li></ol><ul><li>gensturestart</li><li>gensturechange</li><li>genstureend</li></ul><p>event 对象 =&gt; 标准的鼠标事件 + rotation(0开始 负值表示逆时针旋转 正值表示顺时针旋转) + scale(1开始 两个手指距离变化)</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/color_convert.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>颜色转换</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/eslint.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ESlint 配置</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/eslint.html b/articles/basic/eslint.html
index d56860c..c0dbfcf 100644
--- a/articles/basic/eslint.html
+++ b/articles/basic/eslint.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>ESLint | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_eslint.md.8aa0db41.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_eslint.md.bea7edfe.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_eslint" data-v-6b87e69f><div><h1 id="eslint" tabindex="-1">ESLint <a class="header-anchor" href="#eslint" aria-label="Permalink to &quot;ESLint&quot;">​</a></h1><blockquote><p>eslint优化完善项目代码</p></blockquote><h2 id="配置" tabindex="-1">配置 <a class="header-anchor" href="#配置" aria-label="Permalink to &quot;配置&quot;">​</a></h2><ul><li>注释 /* */</li><li>配置文件 ./eslintrc.* 或者在package.json中配置eslintConfig</li><li>其他 environment/globals/rules</li></ul><h2 id="指定解析选项" tabindex="-1">指定解析选项 <a class="header-anchor" href="#指定解析选项" aria-label="Permalink to &quot;指定解析选项&quot;">​</a></h2><ul><li>ecmaVersion: 2 | 3 | 4 | 5 | 6 =&gt; (3, 5 默认值) =&gt; Number[] | String</li><li>sourceType: &#39;script&#39;(默认值) | &#39;module&#39;</li><li>ecmaFeatures: &#39;globalReturn&#39;(允许全局使用return语句) | &#39;impliedStrict&#39;(严格模式) | &#39;jsx&#39; =&gt; Boolean</li></ul><h2 id="指定解析" tabindex="-1">指定解析 <a class="header-anchor" href="#指定解析" aria-label="Permalink to &quot;指定解析&quot;">​</a></h2><ul><li>parser: &#39;esprima&#39;(默认值) | &#39;babel-eslint&#39; | &#39;@typescript-eslint/parser&#39; | &#39;自定义解析&#39;</li></ul><h2 id="指定预处理器-processor" tabindex="-1">指定预处理器 processor <a class="header-anchor" href="#指定预处理器-processor" aria-label="Permalink to &quot;指定预处理器 processor&quot;">​</a></h2><p>覆盖指定文件配置 overrides</p><div class="language-json vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">{</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_eslint" data-v-6b87e69f><div><h1 id="eslint" tabindex="-1">ESLint <a class="header-anchor" href="#eslint" aria-label="Permalink to &quot;ESLint&quot;">​</a></h1><blockquote><p>eslint优化完善项目代码</p></blockquote><h2 id="配置" tabindex="-1">配置 <a class="header-anchor" href="#配置" aria-label="Permalink to &quot;配置&quot;">​</a></h2><ul><li>注释 /* */</li><li>配置文件 ./eslintrc.* 或者在package.json中配置eslintConfig</li><li>其他 environment/globals/rules</li></ul><h2 id="指定解析选项" tabindex="-1">指定解析选项 <a class="header-anchor" href="#指定解析选项" aria-label="Permalink to &quot;指定解析选项&quot;">​</a></h2><ul><li>ecmaVersion: 2 | 3 | 4 | 5 | 6 =&gt; (3, 5 默认值) =&gt; Number[] | String</li><li>sourceType: &#39;script&#39;(默认值) | &#39;module&#39;</li><li>ecmaFeatures: &#39;globalReturn&#39;(允许全局使用return语句) | &#39;impliedStrict&#39;(严格模式) | &#39;jsx&#39; =&gt; Boolean</li></ul><h2 id="指定解析" tabindex="-1">指定解析 <a class="header-anchor" href="#指定解析" aria-label="Permalink to &quot;指定解析&quot;">​</a></h2><ul><li>parser: &#39;esprima&#39;(默认值) | &#39;babel-eslint&#39; | &#39;@typescript-eslint/parser&#39; | &#39;自定义解析&#39;</li></ul><h2 id="指定预处理器-processor" tabindex="-1">指定预处理器 processor <a class="header-anchor" href="#指定预处理器-processor" aria-label="Permalink to &quot;指定预处理器 processor&quot;">​</a></h2><p>覆盖指定文件配置 overrides</p><div class="language-json vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">{</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#79B8FF;">&quot;plugins&quot;</span><span style="color:#E1E4E8;">: [</span><span style="color:#9ECBFF;">&quot;a-plugin&quot;</span><span style="color:#E1E4E8;">],</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#79B8FF;">&quot;processor&quot;</span><span style="color:#E1E4E8;">: </span><span style="color:#9ECBFF;">&quot;a-plugin/a-processor&quot;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span>
@@ -247,8 +247,8 @@
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#6F42C1;">--debug</span><span style="color:#24292E;">                        </span><span style="color:#032F62;">Output</span><span style="color:#24292E;"> </span><span style="color:#032F62;">debugging</span><span style="color:#24292E;"> </span><span style="color:#032F62;">information</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#6F42C1;">-h,</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">--help</span><span style="color:#24292E;">                     </span><span style="color:#032F62;">Show</span><span style="color:#24292E;"> </span><span style="color:#032F62;">help</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#6F42C1;">-v,</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">--version</span><span style="color:#24292E;">                  </span><span style="color:#032F62;">Output</span><span style="color:#24292E;"> </span><span style="color:#032F62;">the</span><span style="color:#24292E;"> </span><span style="color:#032F62;">version</span><span style="color:#24292E;"> </span><span style="color:#032F62;">number</span></span>
-<span class="line"><span style="color:#24292E;">  </span><span style="color:#6F42C1;">--print-config</span><span style="color:#24292E;"> </span><span style="color:#032F62;">path::String</span><span style="color:#24292E;">    </span><span style="color:#032F62;">Print</span><span style="color:#24292E;"> </span><span style="color:#032F62;">the</span><span style="color:#24292E;"> </span><span style="color:#032F62;">configuration</span><span style="color:#24292E;"> </span><span style="color:#032F62;">for</span><span style="color:#24292E;"> </span><span style="color:#032F62;">the</span><span style="color:#24292E;"> </span><span style="color:#032F62;">given</span><span style="color:#24292E;"> </span><span style="color:#032F62;">file</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/dom_events.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>DOM 事件流</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/git.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Git 操作</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">  </span><span style="color:#6F42C1;">--print-config</span><span style="color:#24292E;"> </span><span style="color:#032F62;">path::String</span><span style="color:#24292E;">    </span><span style="color:#032F62;">Print</span><span style="color:#24292E;"> </span><span style="color:#032F62;">the</span><span style="color:#24292E;"> </span><span style="color:#032F62;">configuration</span><span style="color:#24292E;"> </span><span style="color:#032F62;">for</span><span style="color:#24292E;"> </span><span style="color:#032F62;">the</span><span style="color:#24292E;"> </span><span style="color:#032F62;">given</span><span style="color:#24292E;"> </span><span style="color:#032F62;">file</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/dom_events.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>DOM 事件流</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/git.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Git 操作</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/git.html b/articles/basic/git.html
index 3f01c93..1774e7b 100644
--- a/articles/basic/git.html
+++ b/articles/basic/git.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>GIT | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_git.md.abbfc6c6.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_git.md.8f01f6d4.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_git" data-v-6b87e69f><div><h1 id="git" tabindex="-1">GIT <a class="header-anchor" href="#git" aria-label="Permalink to &quot;GIT&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">GIT CMD</p><p>GIT 命令</p></div><h2 id="git-rebase" tabindex="-1">git rebase <a class="header-anchor" href="#git-rebase" aria-label="Permalink to &quot;git rebase&quot;">​</a></h2><p><code>重新 commit 依赖的上游 top 分支</code></p><h3 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h3><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">rebase</span><span style="color:#E1E4E8;"> [-i </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--interactive][&lt;options&gt;]</span><span style="color:#E1E4E8;"> [--exec </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">cm</span><span style="color:#E1E4E8;">d</span><span style="color:#F97583;">&gt;</span><span style="color:#9ECBFF;">][--onto</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">newbas</span><span style="color:#E1E4E8;">e</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--keep-base]</span><span style="color:#E1E4E8;"> [&lt;upstream&gt; [&lt;branch&gt;]]</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_git" data-v-6b87e69f><div><h1 id="git" tabindex="-1">GIT <a class="header-anchor" href="#git" aria-label="Permalink to &quot;GIT&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">GIT CMD</p><p>GIT 命令</p></div><h2 id="git-rebase" tabindex="-1">git rebase <a class="header-anchor" href="#git-rebase" aria-label="Permalink to &quot;git rebase&quot;">​</a></h2><p><code>重新 commit 依赖的上游 top 分支</code></p><h3 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h3><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">rebase</span><span style="color:#E1E4E8;"> [-i </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--interactive][&lt;options&gt;]</span><span style="color:#E1E4E8;"> [--exec </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">cm</span><span style="color:#E1E4E8;">d</span><span style="color:#F97583;">&gt;</span><span style="color:#9ECBFF;">][--onto</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">newbas</span><span style="color:#E1E4E8;">e</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--keep-base]</span><span style="color:#E1E4E8;"> [&lt;upstream&gt; [&lt;branch&gt;]]</span></span>
 <span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">rebase</span><span style="color:#E1E4E8;"> [-i </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--interactive][&lt;options&gt;]</span><span style="color:#E1E4E8;"> [--exec </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">cm</span><span style="color:#E1E4E8;">d</span><span style="color:#F97583;">&gt;</span><span style="color:#9ECBFF;">][--onto</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">newbas</span><span style="color:#E1E4E8;">e</span><span style="color:#F97583;">&gt;</span><span style="color:#9ECBFF;">]</span></span>
 <span class="line"><span style="color:#B392F0;">--root</span><span style="color:#E1E4E8;"> [&lt;branch&gt;]</span></span>
 <span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">rebase</span><span style="color:#E1E4E8;"> (--continue </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--skip</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--abort</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--quit</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--edit-todo</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--show-current-patch</span><span style="color:#E1E4E8;">)</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">git</span><span style="color:#24292E;"> </span><span style="color:#032F62;">rebase</span><span style="color:#24292E;"> [-i </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--interactive][&lt;options&gt;]</span><span style="color:#24292E;"> [--exec </span><span style="color:#D73A49;">&lt;</span><span style="color:#032F62;">cm</span><span style="color:#24292E;">d</span><span style="color:#D73A49;">&gt;</span><span style="color:#032F62;">][--onto</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">&lt;</span><span style="color:#032F62;">newbas</span><span style="color:#24292E;">e</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--keep-base]</span><span style="color:#24292E;"> [&lt;upstream&gt; [&lt;branch&gt;]]</span></span>
@@ -35,8 +35,8 @@
 <span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">reset</span><span style="color:#E1E4E8;"> [--soft </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--mixed</span><span style="color:#E1E4E8;"> [-N] </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--hard</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--merge</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--keep]</span><span style="color:#E1E4E8;"> [-q] [</span><span style="color:#F97583;">&lt;</span><span style="color:#E1E4E8;">commit</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;">]</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">git</span><span style="color:#24292E;"> </span><span style="color:#032F62;">reset</span><span style="color:#24292E;"> [-q] [</span><span style="color:#D73A49;">&lt;</span><span style="color:#24292E;">tree-ish</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;">] [--] </span><span style="color:#D73A49;">&lt;</span><span style="color:#24292E;">pathspec</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;">…​</span></span>
 <span class="line"><span style="color:#6F42C1;">git</span><span style="color:#24292E;"> </span><span style="color:#032F62;">reset</span><span style="color:#24292E;"> [-q] [--pathspec-from-file</span><span style="color:#D73A49;">=&lt;</span><span style="color:#24292E;">file</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;"> [--pathspec-file-nul]] [</span><span style="color:#D73A49;">&lt;</span><span style="color:#24292E;">tree-ish</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;">]</span></span>
 <span class="line"><span style="color:#6F42C1;">git</span><span style="color:#24292E;"> </span><span style="color:#032F62;">reset</span><span style="color:#24292E;"> (--patch </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">-p</span><span style="color:#24292E;">) [</span><span style="color:#D73A49;">&lt;</span><span style="color:#24292E;">tree-ish</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;">] [--] [</span><span style="color:#D73A49;">&lt;</span><span style="color:#24292E;">pathspec</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;">…​]</span></span>
-<span class="line"><span style="color:#6F42C1;">git</span><span style="color:#24292E;"> </span><span style="color:#032F62;">reset</span><span style="color:#24292E;"> [--soft </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--mixed</span><span style="color:#24292E;"> [-N] </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--hard</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--merge</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--keep]</span><span style="color:#24292E;"> [-q] [</span><span style="color:#D73A49;">&lt;</span><span style="color:#24292E;">commit</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;">]</span></span></code></pre></div><h3 id="理解-3" tabindex="-1">理解 <a class="header-anchor" href="#理解-3" aria-label="Permalink to &quot;理解&quot;">​</a></h3><ul><li>重新设置提交记录（soft hard mixed keep）</li><li>reset 和 revert 区别 reset 的提交可以使得提交记录不存在 加上 --hard 参数</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/eslint.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ESlint 配置</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/history.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>History 路由</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6F42C1;">git</span><span style="color:#24292E;"> </span><span style="color:#032F62;">reset</span><span style="color:#24292E;"> [--soft </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--mixed</span><span style="color:#24292E;"> [-N] </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--hard</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--merge</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--keep]</span><span style="color:#24292E;"> [-q] [</span><span style="color:#D73A49;">&lt;</span><span style="color:#24292E;">commit</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;">]</span></span></code></pre></div><h3 id="理解-3" tabindex="-1">理解 <a class="header-anchor" href="#理解-3" aria-label="Permalink to &quot;理解&quot;">​</a></h3><ul><li>重新设置提交记录（soft hard mixed keep）</li><li>reset 和 revert 区别 reset 的提交可以使得提交记录不存在 加上 --hard 参数</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/eslint.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ESlint 配置</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/history.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>History 路由</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/history.html b/articles/basic/history.html
index 83f21eb..236ddbf 100644
--- a/articles/basic/history.html
+++ b/articles/basic/history.html
@@ -5,24 +5,24 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>History API | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_history.md.4e7d878f.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_history.md.bb6472e8.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_history" data-v-6b87e69f><div><h1 id="history-api" tabindex="-1">History API <a class="header-anchor" href="#history-api" aria-label="Permalink to &quot;History API&quot;">​</a></h1><h2 id="window-history" tabindex="-1">window.history <a class="header-anchor" href="#window-history" aria-label="Permalink to &quot;window.history&quot;">​</a></h2><ul><li>back Function 后退一页</li><li>forward Function 前进一页</li><li>go Function(Number) | String)</li></ul><ol><li>负数 history.go(-1) 后退一页</li><li>正数 history.go(2) 前进两页</li><li>参数为字符串时，跳到最近的页面（可能后退也可能前进）history.go(&#39;google.com&#39;);</li></ol><ul><li>pushState Function</li></ul><ol><li>接收三个参数：状态对象、新状态的标题（浏览器暂未实现）、相对地址 url</li><li>会创建新的历史状态</li></ol><ul><li>replaceState Function</li></ul><ol><li>接收三个参数：状态对象、新状态的标题（浏览器暂未实现）、相对地址 url</li><li>更新当前页面的历史状态，不会计入历史状态</li></ol><blockquote><p>手动调用 pushState，window history 对象每切换不同的页面长度(前进后退) length + 1，replaceState 则不会</p></blockquote><ul><li>state</li></ul><p><code>页面的 history 状态，可以使用 history.state 获取，设置 state 为调用 pushState, replaceState 的第一个参数状态对象</code></p><ul><li>scrollRestoration</li></ul><ol><li>允许 web 应用在历史记录导航上设置默认滚动行为</li><li>取值：auto manual 默认值为 auto</li></ol><h2 id="browser-浏览器路由" tabindex="-1">Browser 浏览器路由 <a class="header-anchor" href="#browser-浏览器路由" aria-label="Permalink to &quot;Browser 浏览器路由&quot;">​</a></h2><p><code>单页应用，浏览器路由需要配合服务端配置</code></p><ul><li>nginx</li></ul><div class="language-nginx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">nginx</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">location</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">/ </span><span style="color:#E1E4E8;">{</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_history" data-v-6b87e69f><div><h1 id="history-api" tabindex="-1">History API <a class="header-anchor" href="#history-api" aria-label="Permalink to &quot;History API&quot;">​</a></h1><h2 id="window-history" tabindex="-1">window.history <a class="header-anchor" href="#window-history" aria-label="Permalink to &quot;window.history&quot;">​</a></h2><ul><li>back Function 后退一页</li><li>forward Function 前进一页</li><li>go Function(Number) | String)</li></ul><ol><li>负数 history.go(-1) 后退一页</li><li>正数 history.go(2) 前进两页</li><li>参数为字符串时，跳到最近的页面（可能后退也可能前进）history.go(&#39;google.com&#39;);</li></ol><ul><li>pushState Function</li></ul><ol><li>接收三个参数：状态对象、新状态的标题（浏览器暂未实现）、相对地址 url</li><li>会创建新的历史状态</li></ol><ul><li>replaceState Function</li></ul><ol><li>接收三个参数：状态对象、新状态的标题（浏览器暂未实现）、相对地址 url</li><li>更新当前页面的历史状态，不会计入历史状态</li></ol><blockquote><p>手动调用 pushState，window history 对象每切换不同的页面长度(前进后退) length + 1，replaceState 则不会</p></blockquote><ul><li>state</li></ul><p><code>页面的 history 状态，可以使用 history.state 获取，设置 state 为调用 pushState, replaceState 的第一个参数状态对象</code></p><ul><li>scrollRestoration</li></ul><ol><li>允许 web 应用在历史记录导航上设置默认滚动行为</li><li>取值：auto manual 默认值为 auto</li></ol><h2 id="browser-浏览器路由" tabindex="-1">Browser 浏览器路由 <a class="header-anchor" href="#browser-浏览器路由" aria-label="Permalink to &quot;Browser 浏览器路由&quot;">​</a></h2><p><code>单页应用，浏览器路由需要配合服务端配置</code></p><ul><li>nginx</li></ul><div class="language-nginx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">nginx</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">location</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">/ </span><span style="color:#E1E4E8;">{</span></span>
 <span class="line"><span style="color:#E1E4E8;">   </span><span style="color:#F97583;"> try_files </span><span style="color:#E1E4E8;">$uri $uri/ /index.html;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">location</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">/ </span><span style="color:#24292E;">{</span></span>
 <span class="line"><span style="color:#24292E;">   </span><span style="color:#D73A49;"> try_files </span><span style="color:#24292E;">$uri $uri/ /index.html;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><ul><li>popstate 事件</li></ul><p>浏览器后退前进按钮会触发 popstate 事件，进行路由的处理</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">window.</span><span style="color:#B392F0;">addEventListener</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;popstate&#39;</span><span style="color:#E1E4E8;">, </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {}, </span><span style="color:#79B8FF;">false</span><span style="color:#E1E4E8;">);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">window.</span><span style="color:#6F42C1;">addEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;popstate&#39;</span><span style="color:#24292E;">, </span><span style="color:#D73A49;">function</span><span style="color:#24292E;">() {}, </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">);</span></span></code></pre></div><h2 id="hash-哈希路由" tabindex="-1">Hash 哈希路由 <a class="header-anchor" href="#hash-哈希路由" aria-label="Permalink to &quot;Hash 哈希路由&quot;">​</a></h2><p><code>无需服务端配置，路由url加上 # 标志符</code></p><ul><li>hashchange 事件</li></ul><p>监听路由 hash 变化触发事件</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">window.</span><span style="color:#B392F0;">addEventListener</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;hashchange&#39;</span><span style="color:#E1E4E8;">, </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {});</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">window.</span><span style="color:#6F42C1;">addEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;hashchange&#39;</span><span style="color:#24292E;">, </span><span style="color:#D73A49;">function</span><span style="color:#24292E;">() {});</span></span></code></pre></div><h2 id="window-location" tabindex="-1">window.location <a class="header-anchor" href="#window-location" aria-label="Permalink to &quot;window.location&quot;">​</a></h2><ul><li>hash 返回 url 的 hash（#后接 0 个或者多个字符），如果不包括散列，则返回空字符串</li><li>host 返回服务器域名 + 端口号（if has)</li><li>hostname 服务器域名</li><li>href 当前页面完整 url，location 对象的 toString()方法也返回完整 url</li><li>pathname 返回 url 中的目录和文件名</li><li>port 端口号</li><li>protocol 协议 http: | https:</li><li>search 返回 url 的查询字符串 ?开头</li><li>reload Function</li></ul><p><code>location.reload() 重新加载页面</code></p><ul><li>replace Function</li></ul><p><code>location.replace() 不会在历史记录中生成新的记录，history对象中长度length属性保持不变</code></p><ul><li>assign Function(String)</li></ul><p>打开新的 url 地址并生成一条新的历史记录，history 对象 length 属性 + 1</p><ol><li>location.href = &#39;google.com&#39;</li><li>window.location = &#39;google.com&#39;</li><li>location.assign(&#39;google.com&#39;)</li></ol><blockquote><p>以上三种方式同样效果</p></blockquote><ul><li>URL 重新加载方式</li></ul><ol><li>location.search = &#39;&#39;</li><li>location.hostname = &#39;&#39;</li><li>location.pathname = &#39;&#39;</li><li>location.port = &#39;&#39;</li></ol><blockquote><p>以上方式都会生成浏览器新的历史记录</p></blockquote><ul><li>URL 改变不会重载</li></ul><p><code>location.hash = &#39;&#39; 这种方式不会重新加载，但仍会生成新的历史记录</code></p><p>END</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/git.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Git 操作</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/ieee.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>IEEE 标准</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><ul><li>popstate 事件</li></ul><p>浏览器后退前进按钮会触发 popstate 事件，进行路由的处理</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">window.</span><span style="color:#B392F0;">addEventListener</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;popstate&#39;</span><span style="color:#E1E4E8;">, </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {}, </span><span style="color:#79B8FF;">false</span><span style="color:#E1E4E8;">);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">window.</span><span style="color:#6F42C1;">addEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;popstate&#39;</span><span style="color:#24292E;">, </span><span style="color:#D73A49;">function</span><span style="color:#24292E;">() {}, </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">);</span></span></code></pre></div><h2 id="hash-哈希路由" tabindex="-1">Hash 哈希路由 <a class="header-anchor" href="#hash-哈希路由" aria-label="Permalink to &quot;Hash 哈希路由&quot;">​</a></h2><p><code>无需服务端配置，路由url加上 # 标志符</code></p><ul><li>hashchange 事件</li></ul><p>监听路由 hash 变化触发事件</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">window.</span><span style="color:#B392F0;">addEventListener</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;hashchange&#39;</span><span style="color:#E1E4E8;">, </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {});</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">window.</span><span style="color:#6F42C1;">addEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;hashchange&#39;</span><span style="color:#24292E;">, </span><span style="color:#D73A49;">function</span><span style="color:#24292E;">() {});</span></span></code></pre></div><h2 id="window-location" tabindex="-1">window.location <a class="header-anchor" href="#window-location" aria-label="Permalink to &quot;window.location&quot;">​</a></h2><ul><li>hash 返回 url 的 hash（#后接 0 个或者多个字符），如果不包括散列，则返回空字符串</li><li>host 返回服务器域名 + 端口号（if has)</li><li>hostname 服务器域名</li><li>href 当前页面完整 url，location 对象的 toString()方法也返回完整 url</li><li>pathname 返回 url 中的目录和文件名</li><li>port 端口号</li><li>protocol 协议 http: | https:</li><li>search 返回 url 的查询字符串 ?开头</li><li>reload Function</li></ul><p><code>location.reload() 重新加载页面</code></p><ul><li>replace Function</li></ul><p><code>location.replace() 不会在历史记录中生成新的记录，history对象中长度length属性保持不变</code></p><ul><li>assign Function(String)</li></ul><p>打开新的 url 地址并生成一条新的历史记录，history 对象 length 属性 + 1</p><ol><li>location.href = &#39;google.com&#39;</li><li>window.location = &#39;google.com&#39;</li><li>location.assign(&#39;google.com&#39;)</li></ol><blockquote><p>以上三种方式同样效果</p></blockquote><ul><li>URL 重新加载方式</li></ul><ol><li>location.search = &#39;&#39;</li><li>location.hostname = &#39;&#39;</li><li>location.pathname = &#39;&#39;</li><li>location.port = &#39;&#39;</li></ol><blockquote><p>以上方式都会生成浏览器新的历史记录</p></blockquote><ul><li>URL 改变不会重载</li></ul><p><code>location.hash = &#39;&#39; 这种方式不会重新加载，但仍会生成新的历史记录</code></p><p>END</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/git.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Git 操作</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/ieee.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>IEEE 标准</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/ieee.html b/articles/basic/ieee.html
index 0e28f81..0dd5bf7 100644
--- a/articles/basic/ieee.html
+++ b/articles/basic/ieee.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>IEEE 754 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_ieee.md.f4f18348.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_ieee.md.04dcfb91.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_ieee" data-v-6b87e69f><div><h1 id="ieee-754" tabindex="-1">IEEE 754 <a class="header-anchor" href="#ieee-754" aria-label="Permalink to &quot;IEEE 754&quot;">​</a></h1><blockquote><p>现代计算机中的浮点</p></blockquote><h2 id="基本格式" tabindex="-1">基本格式 <a class="header-anchor" href="#基本格式" aria-label="Permalink to &quot;基本格式&quot;">​</a></h2><h3 id="单精度" tabindex="-1">单精度 <a class="header-anchor" href="#单精度" aria-label="Permalink to &quot;单精度&quot;">​</a></h3><p>占用 32 位（4 字节）的二进制格式，其有效数字为 24 位（约 7 个十进制数）的精度</p><h3 id="双精度" tabindex="-1">双精度 <a class="header-anchor" href="#双精度" aria-label="Permalink to &quot;双精度&quot;">​</a></h3><p>占用 64 位（8 字节）的二进制格式，其有效数字为 53 位（约 15 - 17 个十进制数）的精度</p><h3 id="双重扩展" tabindex="-1">双重扩展 <a class="header-anchor" href="#双重扩展" aria-label="Permalink to &quot;双重扩展&quot;">​</a></h3><p>二进制格式至少占用 79 位（约 19 个十进制数）的精度</p><h3 id="四倍精度" tabindex="-1">四倍精度 <a class="header-anchor" href="#四倍精度" aria-label="Permalink to &quot;四倍精度&quot;">​</a></h3><p>128 位（16 字节）的二进制格式（约 34 个十进制数）的精度</p><h3 id="decimal64-decimal128" tabindex="-1">Decimal64 decimal128 <a class="header-anchor" href="#decimal64-decimal128" aria-label="Permalink to &quot;Decimal64 decimal128&quot;">​</a></h3><p>十进制舍入</p><h3 id="半精度" tabindex="-1">半精度 <a class="header-anchor" href="#半精度" aria-label="Permalink to &quot;半精度&quot;">​</a></h3><p>binary16 16 位浮点值</p><h2 id="浮点数范围" tabindex="-1">浮点数范围 <a class="header-anchor" href="#浮点数范围" aria-label="Permalink to &quot;浮点数范围&quot;">​</a></h2><blockquote><p>64 位双精度 = 具有 53 位（包含一个隐含位）1 个符号位 11 个指数位的系数（指数可以表示的数 2^-1022 ≈ 2×10^-308 - 2^1024 ≈ 2 x 10^308)</p></blockquote><h3 id="字节序-endian" tabindex="-1">字节序（Endian） <a class="header-anchor" href="#字节序-endian" aria-label="Permalink to &quot;字节序（Endian）&quot;">​</a></h3><p>浮点数以大字节序形式表示，整数以小字节序表示</p><h3 id="整数值的精度限制" tabindex="-1">整数值的精度限制 <a class="header-anchor" href="#整数值的精度限制" aria-label="Permalink to &quot;整数值的精度限制&quot;">​</a></h3><ul><li>可以精确表示从-2^53 到 2^53（−9007199254740992 到 9007199254740992）的整数</li><li>2^53 和 2^54 之间的整数= 18014398509481984，取整为 2 的倍数（偶数）</li><li>2^54 和 2^55 之间的整数= 36028797018963968 舍入为 4 的倍数</li></ul><h2 id="内部表示" tabindex="-1">内部表示 <a class="header-anchor" href="#内部表示" aria-label="Permalink to &quot;内部表示&quot;">​</a></h2><table><thead><tr><th>类型</th><th>标志</th><th>指数</th><th>有效域</th><th>总位数</th><th>指数偏差</th><th>位精度</th><th>小数位数</th></tr></thead><tbody><tr><td>16（IEEE 754-2008）</td><td>1 个</td><td>5</td><td>10</td><td>16</td><td>15</td><td>11</td><td>〜3.3</td></tr><tr><td>32</td><td>1 个</td><td>8</td><td>23</td><td>32</td><td>127</td><td>24</td><td>〜7.2</td></tr><tr><td>64</td><td>1 个</td><td>11</td><td>52</td><td>64</td><td>1023</td><td>53</td><td>〜15.9</td></tr><tr><td>x86</td><td>1 个</td><td>15</td><td>64</td><td>80</td><td>16383</td><td>64</td><td>〜19.2</td></tr><tr><td>128</td><td>1 个</td><td>15</td><td>112</td><td>128</td><td>16383</td><td>113</td><td>〜34.0</td></tr></tbody></table><h2 id="javascript-数表示" tabindex="-1">JavaScript 数表示 <a class="header-anchor" href="#javascript-数表示" aria-label="Permalink to &quot;JavaScript 数表示&quot;">​</a></h2><p><code>JavaScript</code> 中采用 <code>IEEE754 64</code> 位浮点数标准，<code>1</code> 位表示标志位，<code>11</code> 位指数位，<code>52</code> 位有效域（有效数字 <code>53</code> 位，包含一位隐含位）</p><h2 id="进制转换" tabindex="-1">进制转换 <a class="header-anchor" href="#进制转换" aria-label="Permalink to &quot;进制转换&quot;">​</a></h2><h3 id="二进制转换" tabindex="-1">二进制转换 <a class="header-anchor" href="#二进制转换" aria-label="Permalink to &quot;二进制转换&quot;">​</a></h3><h4 id="整数" tabindex="-1">整数 <a class="header-anchor" href="#整数" aria-label="Permalink to &quot;整数&quot;">​</a></h4><p>整数除余法</p><p>8 / 2 = 4 余 0 4 / 2 = 2 余 0 2 / 2 = 1 余 0</p><p>十进制 8 转换为二进制为 1000</p><h4 id="小数" tabindex="-1">小数 <a class="header-anchor" href="#小数" aria-label="Permalink to &quot;小数&quot;">​</a></h4><p>长乘法</p><p>0.1 _ 2 = 0.2 --- 0 0.2 _ 2 = 0.4 --- 0 0.4 _ 2 = 0.8 --- 0 0.8 _ 2 = 1.6 --- 1 0.6 _ 2 = 1.2 --- 1 0.2 _ 2 = 0.4 --- 0</p><p>依次类推</p><h3 id="十六进制转换" tabindex="-1">十六进制转换 <a class="header-anchor" href="#十六进制转换" aria-label="Permalink to &quot;十六进制转换&quot;">​</a></h3><p>二进制 -&gt; 十六进制 2 ^ 4 = 16</p><p>3A(16) = 00111010(2) E7(16) = 11100111(2)</p><h3 id="八进制转换" tabindex="-1">八进制转换 <a class="header-anchor" href="#八进制转换" aria-label="Permalink to &quot;八进制转换&quot;">​</a></h3><p>二进制 -&gt; 八进制 2 ^ 3 = 8</p><p>65(8) = 110101(2) 17(8) = 001111(2)</p><h2 id="计算机编码方式" tabindex="-1">计算机编码方式 <a class="header-anchor" href="#计算机编码方式" aria-label="Permalink to &quot;计算机编码方式&quot;">​</a></h2><div class="language-tip vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tip</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">带符号位的机器数对应的真正数值称为机器数的真值</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">带符号位的机器数对应的真正数值称为机器数的真值</span></span></code></pre></div><p>机器存储一个具体数字的编码方式</p><h3 id="原码" tabindex="-1">原码 <a class="header-anchor" href="#原码" aria-label="Permalink to &quot;原码&quot;">​</a></h3><p>符号位加上真值的绝对值，即用第一位表示符号，其余位表示值</p><h3 id="反码" tabindex="-1">反码 <a class="header-anchor" href="#反码" aria-label="Permalink to &quot;反码&quot;">​</a></h3><p>正数的反码是其本身，负数的反码是在其原码的基础上，符号位不变，其余各个位取反</p><blockquote><p>减法 存在两个编码问题</p></blockquote><h3 id="补码" tabindex="-1">补码 <a class="header-anchor" href="#补码" aria-label="Permalink to &quot;补码&quot;">​</a></h3><blockquote><p>解决了两个编码问题[+0] [-0] 扩充了负数的最小值，以8位二进制为例[10000000, 01111111] = [-128, 127]</p></blockquote><p>反码 + 1</p><blockquote><p>负数二进制可以用补码表示</p></blockquote><ul><li>补码具有两种表示形式：0：00000000（+0）和 11111111（-0）</li></ul><p>二进制十进制(+1)</p><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">    11111110 -1</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_ieee" data-v-6b87e69f><div><h1 id="ieee-754" tabindex="-1">IEEE 754 <a class="header-anchor" href="#ieee-754" aria-label="Permalink to &quot;IEEE 754&quot;">​</a></h1><blockquote><p>现代计算机中的浮点</p></blockquote><h2 id="基本格式" tabindex="-1">基本格式 <a class="header-anchor" href="#基本格式" aria-label="Permalink to &quot;基本格式&quot;">​</a></h2><h3 id="单精度" tabindex="-1">单精度 <a class="header-anchor" href="#单精度" aria-label="Permalink to &quot;单精度&quot;">​</a></h3><p>占用 32 位（4 字节）的二进制格式，其有效数字为 24 位（约 7 个十进制数）的精度</p><h3 id="双精度" tabindex="-1">双精度 <a class="header-anchor" href="#双精度" aria-label="Permalink to &quot;双精度&quot;">​</a></h3><p>占用 64 位（8 字节）的二进制格式，其有效数字为 53 位（约 15 - 17 个十进制数）的精度</p><h3 id="双重扩展" tabindex="-1">双重扩展 <a class="header-anchor" href="#双重扩展" aria-label="Permalink to &quot;双重扩展&quot;">​</a></h3><p>二进制格式至少占用 79 位（约 19 个十进制数）的精度</p><h3 id="四倍精度" tabindex="-1">四倍精度 <a class="header-anchor" href="#四倍精度" aria-label="Permalink to &quot;四倍精度&quot;">​</a></h3><p>128 位（16 字节）的二进制格式（约 34 个十进制数）的精度</p><h3 id="decimal64-decimal128" tabindex="-1">Decimal64 decimal128 <a class="header-anchor" href="#decimal64-decimal128" aria-label="Permalink to &quot;Decimal64 decimal128&quot;">​</a></h3><p>十进制舍入</p><h3 id="半精度" tabindex="-1">半精度 <a class="header-anchor" href="#半精度" aria-label="Permalink to &quot;半精度&quot;">​</a></h3><p>binary16 16 位浮点值</p><h2 id="浮点数范围" tabindex="-1">浮点数范围 <a class="header-anchor" href="#浮点数范围" aria-label="Permalink to &quot;浮点数范围&quot;">​</a></h2><blockquote><p>64 位双精度 = 具有 53 位（包含一个隐含位）1 个符号位 11 个指数位的系数（指数可以表示的数 2^-1022 ≈ 2×10^-308 - 2^1024 ≈ 2 x 10^308)</p></blockquote><h3 id="字节序-endian" tabindex="-1">字节序（Endian） <a class="header-anchor" href="#字节序-endian" aria-label="Permalink to &quot;字节序（Endian）&quot;">​</a></h3><p>浮点数以大字节序形式表示，整数以小字节序表示</p><h3 id="整数值的精度限制" tabindex="-1">整数值的精度限制 <a class="header-anchor" href="#整数值的精度限制" aria-label="Permalink to &quot;整数值的精度限制&quot;">​</a></h3><ul><li>可以精确表示从-2^53 到 2^53（−9007199254740992 到 9007199254740992）的整数</li><li>2^53 和 2^54 之间的整数= 18014398509481984，取整为 2 的倍数（偶数）</li><li>2^54 和 2^55 之间的整数= 36028797018963968 舍入为 4 的倍数</li></ul><h2 id="内部表示" tabindex="-1">内部表示 <a class="header-anchor" href="#内部表示" aria-label="Permalink to &quot;内部表示&quot;">​</a></h2><table><thead><tr><th>类型</th><th>标志</th><th>指数</th><th>有效域</th><th>总位数</th><th>指数偏差</th><th>位精度</th><th>小数位数</th></tr></thead><tbody><tr><td>16（IEEE 754-2008）</td><td>1 个</td><td>5</td><td>10</td><td>16</td><td>15</td><td>11</td><td>〜3.3</td></tr><tr><td>32</td><td>1 个</td><td>8</td><td>23</td><td>32</td><td>127</td><td>24</td><td>〜7.2</td></tr><tr><td>64</td><td>1 个</td><td>11</td><td>52</td><td>64</td><td>1023</td><td>53</td><td>〜15.9</td></tr><tr><td>x86</td><td>1 个</td><td>15</td><td>64</td><td>80</td><td>16383</td><td>64</td><td>〜19.2</td></tr><tr><td>128</td><td>1 个</td><td>15</td><td>112</td><td>128</td><td>16383</td><td>113</td><td>〜34.0</td></tr></tbody></table><h2 id="javascript-数表示" tabindex="-1">JavaScript 数表示 <a class="header-anchor" href="#javascript-数表示" aria-label="Permalink to &quot;JavaScript 数表示&quot;">​</a></h2><p><code>JavaScript</code> 中采用 <code>IEEE754 64</code> 位浮点数标准，<code>1</code> 位表示标志位，<code>11</code> 位指数位，<code>52</code> 位有效域（有效数字 <code>53</code> 位，包含一位隐含位）</p><h2 id="进制转换" tabindex="-1">进制转换 <a class="header-anchor" href="#进制转换" aria-label="Permalink to &quot;进制转换&quot;">​</a></h2><h3 id="二进制转换" tabindex="-1">二进制转换 <a class="header-anchor" href="#二进制转换" aria-label="Permalink to &quot;二进制转换&quot;">​</a></h3><h4 id="整数" tabindex="-1">整数 <a class="header-anchor" href="#整数" aria-label="Permalink to &quot;整数&quot;">​</a></h4><p>整数除余法</p><p>8 / 2 = 4 余 0 4 / 2 = 2 余 0 2 / 2 = 1 余 0</p><p>十进制 8 转换为二进制为 1000</p><h4 id="小数" tabindex="-1">小数 <a class="header-anchor" href="#小数" aria-label="Permalink to &quot;小数&quot;">​</a></h4><p>长乘法</p><p>0.1 _ 2 = 0.2 --- 0 0.2 _ 2 = 0.4 --- 0 0.4 _ 2 = 0.8 --- 0 0.8 _ 2 = 1.6 --- 1 0.6 _ 2 = 1.2 --- 1 0.2 _ 2 = 0.4 --- 0</p><p>依次类推</p><h3 id="十六进制转换" tabindex="-1">十六进制转换 <a class="header-anchor" href="#十六进制转换" aria-label="Permalink to &quot;十六进制转换&quot;">​</a></h3><p>二进制 -&gt; 十六进制 2 ^ 4 = 16</p><p>3A(16) = 00111010(2) E7(16) = 11100111(2)</p><h3 id="八进制转换" tabindex="-1">八进制转换 <a class="header-anchor" href="#八进制转换" aria-label="Permalink to &quot;八进制转换&quot;">​</a></h3><p>二进制 -&gt; 八进制 2 ^ 3 = 8</p><p>65(8) = 110101(2) 17(8) = 001111(2)</p><h2 id="计算机编码方式" tabindex="-1">计算机编码方式 <a class="header-anchor" href="#计算机编码方式" aria-label="Permalink to &quot;计算机编码方式&quot;">​</a></h2><div class="language-tip vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tip</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">带符号位的机器数对应的真正数值称为机器数的真值</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">带符号位的机器数对应的真正数值称为机器数的真值</span></span></code></pre></div><p>机器存储一个具体数字的编码方式</p><h3 id="原码" tabindex="-1">原码 <a class="header-anchor" href="#原码" aria-label="Permalink to &quot;原码&quot;">​</a></h3><p>符号位加上真值的绝对值，即用第一位表示符号，其余位表示值</p><h3 id="反码" tabindex="-1">反码 <a class="header-anchor" href="#反码" aria-label="Permalink to &quot;反码&quot;">​</a></h3><p>正数的反码是其本身，负数的反码是在其原码的基础上，符号位不变，其余各个位取反</p><blockquote><p>减法 存在两个编码问题</p></blockquote><h3 id="补码" tabindex="-1">补码 <a class="header-anchor" href="#补码" aria-label="Permalink to &quot;补码&quot;">​</a></h3><blockquote><p>解决了两个编码问题[+0] [-0] 扩充了负数的最小值，以8位二进制为例[10000000, 01111111] = [-128, 127]</p></blockquote><p>反码 + 1</p><blockquote><p>负数二进制可以用补码表示</p></blockquote><ul><li>补码具有两种表示形式：0：00000000（+0）和 11111111（-0）</li></ul><p>二进制十进制(+1)</p><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">    11111110 -1</span></span>
 <span class="line"><span style="color:#e1e4e8;">+   00000010 +2</span></span>
 <span class="line"><span style="color:#e1e4e8;">────────────</span></span>
 <span class="line"><span style="color:#e1e4e8;">    100000000 0 ← 不是正确的答案</span></span>
@@ -29,8 +29,8 @@
 <span class="line"><span style="color:#24292e;">    100000000 0 ← 不是正确的答案</span></span>
 <span class="line"><span style="color:#24292e;">            1 +1 ← 加进位</span></span>
 <span class="line"><span style="color:#24292e;">────────────</span></span>
-<span class="line"><span style="color:#24292e;">  00000001 1 ← 正确答案</span></span></code></pre></div><ul><li>二进制正数转换负数 正数的二进制取反+1</li></ul><p>e.q +2 = 00000010 = 取反 11111101 + 1 = 11111110(-2 的补码形式)</p><h2 id="_0-6-0-3-0-9" tabindex="-1">0.6 + 0.3 != 0.9 <a class="header-anchor" href="#_0-6-0-3-0-9" aria-label="Permalink to &quot;0.6 + 0.3 != 0.9&quot;">​</a></h2><p>例子：说明浮点数相加之后的偏差原因</p><blockquote><p>双精度浮点数，1位符号位，11位指数位，52位尾数</p></blockquote><h3 id="_0-6-的二进制" tabindex="-1">0.6 的二进制 <a class="header-anchor" href="#_0-6-的二进制" aria-label="Permalink to &quot;0.6 的二进制&quot;">​</a></h3><p>0.6 * 2 = 1.2 --- 1 0.2 * 2 = 0.4 --- 0 0.4 * 2 = 0.8 --- 0 0.8 * 2 = 1.6 --- 1 依次类推</p><blockquote><p>得到结果 0.6(10) = 0.1001 1001 1001(2) 指数表示法 0.6(10) = 1.001 1001 1001(2) * 2^-1</p></blockquote><h3 id="_0-3-的二进制" tabindex="-1">0.3 的二进制 <a class="header-anchor" href="#_0-3-的二进制" aria-label="Permalink to &quot;0.3 的二进制&quot;">​</a></h3><p>0.3 * 2 = 0.6 --- 0 0.6 * 2 = 1.2 --- 1 0.6 * 2 = 1.2 --- 1 0.2 * 2 = 0.4 --- 0 0.4 * 2 = 0.8 --- 0 0.8 * 2 = 1.6 --- 1 以此类推</p><blockquote><p>得到结果 0.3(10) = 0.011001(2) 指数对齐，右移一位 0.1001 1001 * 2^-1</p></blockquote><h3 id="指数对齐相加" tabindex="-1">指数对齐相加 <a class="header-anchor" href="#指数对齐相加" aria-label="Permalink to &quot;指数对齐相加&quot;">​</a></h3><p>0.6 + 0.3</p><p>1.0011 001... 0.1001 100... 1.1100 101...</p><blockquote><p>0.11100 101 1 * 2^-1 + 1 * 2^-2 + ... + x^-52 得到近似结果 0.8999999999999999</p></blockquote><h3 id="解决方法" tabindex="-1">解决方法 <a class="header-anchor" href="#解决方法" aria-label="Permalink to &quot;解决方法&quot;">​</a></h3><ul><li>toFixed</li><li>toPrecision</li><li>三方库 <ul><li>math.js</li><li>decimal.js</li><li>big.js</li></ul></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-11-28T02:34:32.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/history.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>History 路由</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/module.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>模块化演变</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292e;">  00000001 1 ← 正确答案</span></span></code></pre></div><ul><li>二进制正数转换负数 正数的二进制取反+1</li></ul><p>e.q +2 = 00000010 = 取反 11111101 + 1 = 11111110(-2 的补码形式)</p><h2 id="_0-6-0-3-0-9" tabindex="-1">0.6 + 0.3 != 0.9 <a class="header-anchor" href="#_0-6-0-3-0-9" aria-label="Permalink to &quot;0.6 + 0.3 != 0.9&quot;">​</a></h2><p>例子：说明浮点数相加之后的偏差原因</p><blockquote><p>双精度浮点数，1位符号位，11位指数位，52位尾数</p></blockquote><h3 id="_0-6-的二进制" tabindex="-1">0.6 的二进制 <a class="header-anchor" href="#_0-6-的二进制" aria-label="Permalink to &quot;0.6 的二进制&quot;">​</a></h3><p>0.6 * 2 = 1.2 --- 1 0.2 * 2 = 0.4 --- 0 0.4 * 2 = 0.8 --- 0 0.8 * 2 = 1.6 --- 1 依次类推</p><blockquote><p>得到结果 0.6(10) = 0.1001 1001 1001(2) 指数表示法 0.6(10) = 1.001 1001 1001(2) * 2^-1</p></blockquote><h3 id="_0-3-的二进制" tabindex="-1">0.3 的二进制 <a class="header-anchor" href="#_0-3-的二进制" aria-label="Permalink to &quot;0.3 的二进制&quot;">​</a></h3><p>0.3 * 2 = 0.6 --- 0 0.6 * 2 = 1.2 --- 1 0.6 * 2 = 1.2 --- 1 0.2 * 2 = 0.4 --- 0 0.4 * 2 = 0.8 --- 0 0.8 * 2 = 1.6 --- 1 以此类推</p><blockquote><p>得到结果 0.3(10) = 0.011001(2) 指数对齐，右移一位 0.1001 1001 * 2^-1</p></blockquote><h3 id="指数对齐相加" tabindex="-1">指数对齐相加 <a class="header-anchor" href="#指数对齐相加" aria-label="Permalink to &quot;指数对齐相加&quot;">​</a></h3><p>0.6 + 0.3</p><p>1.0011 001... 0.1001 100... 1.1100 101...</p><blockquote><p>0.11100 101 1 * 2^-1 + 1 * 2^-2 + ... + x^-52 得到近似结果 0.8999999999999999</p></blockquote><h3 id="解决方法" tabindex="-1">解决方法 <a class="header-anchor" href="#解决方法" aria-label="Permalink to &quot;解决方法&quot;">​</a></h3><ul><li>toFixed</li><li>toPrecision</li><li>三方库 <ul><li>math.js</li><li>decimal.js</li><li>big.js</li></ul></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-11-28T02:34:32.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/history.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>History 路由</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/module.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>模块化演变</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/module.html b/articles/basic/module.html
index bad3385..a8818de 100644
--- a/articles/basic/module.html
+++ b/articles/basic/module.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>前端模块的演变 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_module.md.e77ca7a2.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_module.md.67706ce5.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_module" data-v-6b87e69f><div><h1 id="前端模块的演变" tabindex="-1">前端模块的演变 <a class="header-anchor" href="#前端模块的演变" aria-label="Permalink to &quot;前端模块的演变&quot;">​</a></h1><blockquote><p>UMD AMD CommonJS ESM</p></blockquote><h2 id="umd" tabindex="-1">UMD <a class="header-anchor" href="#umd" aria-label="Permalink to &quot;UMD&quot;">​</a></h2><p>浏览器中直接运行</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 立即执行函数</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_module" data-v-6b87e69f><div><h1 id="前端模块的演变" tabindex="-1">前端模块的演变 <a class="header-anchor" href="#前端模块的演变" aria-label="Permalink to &quot;前端模块的演变&quot;">​</a></h1><blockquote><p>UMD AMD CommonJS ESM</p></blockquote><h2 id="umd" tabindex="-1">UMD <a class="header-anchor" href="#umd" aria-label="Permalink to &quot;UMD&quot;">​</a></h2><p>浏览器中直接运行</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 立即执行函数</span></span>
 <span class="line"><span style="color:#E1E4E8;">(</span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">ctx</span><span style="color:#E1E4E8;">, </span><span style="color:#FFAB70;">factory</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">factory</span><span style="color:#E1E4E8;">();</span></span>
 <span class="line"><span style="color:#E1E4E8;">})(window, </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">ctx</span><span style="color:#E1E4E8;">) {</span></span>
@@ -95,8 +95,8 @@
 <span class="line"><span style="color:#6A737D;">// r.id 返回一个标识 id</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">r</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> requrie.</span><span style="color:#6F42C1;">context</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;./a&#39;</span><span style="color:#24292E;">, </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">,</span><span style="color:#032F62;"> /</span><span style="color:#22863A;font-weight:bold;">\.</span><span style="color:#032F62;">js</span><span style="color:#D73A49;">$</span><span style="color:#032F62;">/</span><span style="color:#24292E;">);</span></span>
 <span class="line"><span style="color:#6A737D;">// r.resolve() 一个函数返回解析的 module id</span></span>
 <span class="line"><span style="color:#6A737D;">// r.keys 返回一个数组 模块名</span></span>
-<span class="line"><span style="color:#6A737D;">// r.id 返回一个标识 id</span></span></code></pre></div><p>requrie.context(dir, subDir, regExp, mode = &#39;sync&#39;);</p><ul><li>接收四个参数 <ul><li>文件夹 String</li><li>子文件夹 Boolean</li><li>匹配文件 正则表达式</li><li>模式</li></ul></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/ieee.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>IEEE 标准</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/script_link.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Script 标签</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6A737D;">// r.id 返回一个标识 id</span></span></code></pre></div><p>requrie.context(dir, subDir, regExp, mode = &#39;sync&#39;);</p><ul><li>接收四个参数 <ul><li>文件夹 String</li><li>子文件夹 Boolean</li><li>匹配文件 正则表达式</li><li>模式</li></ul></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/ieee.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>IEEE 标准</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/script_link.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Script 标签</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/script_link.html b/articles/basic/script_link.html
index 2fa9c66..52ea65f 100644
--- a/articles/basic/script_link.html
+++ b/articles/basic/script_link.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Script Link 标签 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_script_link.md.78aa867d.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_script_link.md.eb8f70cc.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_script_link" data-v-6b87e69f><div><h1 id="script-link-标签" tabindex="-1">Script Link 标签 <a class="header-anchor" href="#script-link-标签" aria-label="Permalink to &quot;Script Link 标签&quot;">​</a></h1><p><code>defer async 只适用于外部脚本中</code></p><h2 id="defer" tabindex="-1">defer <a class="header-anchor" href="#defer" aria-label="Permalink to &quot;defer&quot;">​</a></h2><p><code>延迟脚本</code></p><p>兼容性：IE4、Firefox 3.5、Safari 5 和 Chrome</p><ol><li><p>多个延迟脚本按顺序执行，并先于 DOMContentLoaded 事件执行</p></li><li><p>现实当中，多个延迟脚本不一定会按照顺序执行，也不一定会在 DOMContentLoaded 事件执行，因此最好包含一个延迟脚本</p></li></ol><h2 id="async" tabindex="-1">async <a class="header-anchor" href="#async" aria-label="Permalink to &quot;async&quot;">​</a></h2><p><code>异步脚本</code></p><p>兼容性：Firefox 3.6、Safari 5 和 Chrome</p><ol><li><p>多个异步脚本先后顺序不一致执行，最好不要在此修改 dom 操作</p></li><li><p>异步脚本一定会在 load 事件之前执行，在 DOMContentLoaded 事件不一定之前还是之后</p></li></ol><h2 id="crossorigin" tabindex="-1">crossorigin <a class="header-anchor" href="#crossorigin" aria-label="Permalink to &quot;crossorigin&quot;">​</a></h2></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/module.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>模块化演变</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/syslink.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Soft/Hard Links</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_script_link" data-v-6b87e69f><div><h1 id="script-link-标签" tabindex="-1">Script Link 标签 <a class="header-anchor" href="#script-link-标签" aria-label="Permalink to &quot;Script Link 标签&quot;">​</a></h1><p><code>defer async 只适用于外部脚本中</code></p><h2 id="defer" tabindex="-1">defer <a class="header-anchor" href="#defer" aria-label="Permalink to &quot;defer&quot;">​</a></h2><p><code>延迟脚本</code></p><p>兼容性：IE4、Firefox 3.5、Safari 5 和 Chrome</p><ol><li><p>多个延迟脚本按顺序执行，并先于 DOMContentLoaded 事件执行</p></li><li><p>现实当中，多个延迟脚本不一定会按照顺序执行，也不一定会在 DOMContentLoaded 事件执行，因此最好包含一个延迟脚本</p></li></ol><h2 id="async" tabindex="-1">async <a class="header-anchor" href="#async" aria-label="Permalink to &quot;async&quot;">​</a></h2><p><code>异步脚本</code></p><p>兼容性：Firefox 3.6、Safari 5 和 Chrome</p><ol><li><p>多个异步脚本先后顺序不一致执行，最好不要在此修改 dom 操作</p></li><li><p>异步脚本一定会在 load 事件之前执行，在 DOMContentLoaded 事件不一定之前还是之后</p></li></ol><h2 id="crossorigin" tabindex="-1">crossorigin <a class="header-anchor" href="#crossorigin" aria-label="Permalink to &quot;crossorigin&quot;">​</a></h2></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/module.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>模块化演变</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/syslink.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Soft/Hard Links</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/basic/syslink.html b/articles/basic/syslink.html
index a690466..c25f5d1 100644
--- a/articles/basic/syslink.html
+++ b/articles/basic/syslink.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Linux 链接 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_basic_syslink.md.ba8c5ece.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_basic_syslink.md.8ff4f41d.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_basic_syslink" data-v-6b87e69f><div><h1 id="linux-链接" tabindex="-1">Linux 链接 <a class="header-anchor" href="#linux-链接" aria-label="Permalink to &quot;Linux 链接&quot;">​</a></h1><p>Linux links</p><h2 id="soft-links" tabindex="-1">soft links <a class="header-anchor" href="#soft-links" aria-label="Permalink to &quot;soft links&quot;">​</a></h2><p>软链接，也称符号链接</p><h3 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h3><ul><li>在 Linux 系统中，软链接也被称为符号链接，是一种指向不同文件的特殊文件。在 Windows 系统中，可以视为快捷方式。</li><li>连接是逻辑连接，不是重复连接，可以指向整个目录或链接到远程计算机上的文件</li></ul><h3 id="工作" tabindex="-1">工作 <a class="header-anchor" href="#工作" aria-label="Permalink to &quot;工作&quot;">​</a></h3><p>举例说明</p><ol><li>创建文件 xx1(原始文件)，数据所在的位置</li><li>创建软链接 xx3，只指向 xx1 的名称，并不指向硬盘驱动器上的某个位置</li><li>删除原始文件，软链接将会无效</li></ol><h3 id="创建" tabindex="-1">创建 <a class="header-anchor" href="#创建" aria-label="Permalink to &quot;创建&quot;">​</a></h3><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">ls</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_basic_syslink" data-v-6b87e69f><div><h1 id="linux-链接" tabindex="-1">Linux 链接 <a class="header-anchor" href="#linux-链接" aria-label="Permalink to &quot;Linux 链接&quot;">​</a></h1><p>Linux links</p><h2 id="soft-links" tabindex="-1">soft links <a class="header-anchor" href="#soft-links" aria-label="Permalink to &quot;soft links&quot;">​</a></h2><p>软链接，也称符号链接</p><h3 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h3><ul><li>在 Linux 系统中，软链接也被称为符号链接，是一种指向不同文件的特殊文件。在 Windows 系统中，可以视为快捷方式。</li><li>连接是逻辑连接，不是重复连接，可以指向整个目录或链接到远程计算机上的文件</li></ul><h3 id="工作" tabindex="-1">工作 <a class="header-anchor" href="#工作" aria-label="Permalink to &quot;工作&quot;">​</a></h3><p>举例说明</p><ol><li>创建文件 xx1(原始文件)，数据所在的位置</li><li>创建软链接 xx3，只指向 xx1 的名称，并不指向硬盘驱动器上的某个位置</li><li>删除原始文件，软链接将会无效</li></ol><h3 id="创建" tabindex="-1">创建 <a class="header-anchor" href="#创建" aria-label="Permalink to &quot;创建&quot;">​</a></h3><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">ls</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#B392F0;">ln</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">-s</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">hardlink.txt</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">softlink.txt</span></span>
 <span class="line"></span>
@@ -65,8 +65,8 @@
 <span class="line"><span style="color:#6F42C1;">rm</span><span style="color:#24292E;"> </span><span style="color:#032F62;">xx1.txt</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#6A737D;"># 依旧存在</span></span>
-<span class="line"><span style="color:#6F42C1;">ls</span></span></code></pre></div><h2 id="区别" tabindex="-1">区别 <a class="header-anchor" href="#区别" aria-label="Permalink to &quot;区别&quot;">​</a></h2><blockquote><p>本质上是在硬盘驱动器上引用文件的两种不同方式，硬链接指向文件本身（确切位置），软链接指向文件名（名称）</p></blockquote><blockquote><p>软链接是一个指向文件的指针，硬链接依然占据空间</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/basic/script_link.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Script 标签</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/advanced/debounce.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>防抖节流</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6F42C1;">ls</span></span></code></pre></div><h2 id="区别" tabindex="-1">区别 <a class="header-anchor" href="#区别" aria-label="Permalink to &quot;区别&quot;">​</a></h2><blockquote><p>本质上是在硬盘驱动器上引用文件的两种不同方式，硬链接指向文件本身（确切位置），软链接指向文件名（名称）</p></blockquote><blockquote><p>软链接是一个指向文件的指针，硬链接依然占据空间</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/basic/script_link.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Script 标签</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/advanced/debounce.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>防抖节流</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/index.html b/articles/index.html
index 1aa0dc1..2cbaa28 100644
--- a/articles/index.html
+++ b/articles/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>开启写作之旅 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_index.md.2805f70b.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_index.md.16646c0c.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_" data-v-6b87e69f><div><h1 id="开启写作之旅" tabindex="-1">开启写作之旅 <a class="header-anchor" href="#开启写作之旅" aria-label="Permalink to &quot;开启写作之旅&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">文章</p><p>这里将开始自己的写作之旅（不仅仅是技术）</p></div><p><strong>简介</strong></p><p>我是一名<code>前端开发者</code>，2018 毕业，目前在杭州就业。</p><p>2018 年初，迈出校门，走入社会。</p><p>大学所学的知识让我充满了迷茫与惆怅（计算机专业什么都学），不知道出去该往哪个方向发展，路途未知。</p><p><code>第一份工作</code></p><p>靠着校招拿到一个 offer，沾沾自喜的我开始了第一份自己的工作。靠着自己的一分热血， 总以为能得到满意的结果。可事实终究残酷无情。学校中身边的都是你的同龄人，社会中面对着不同的层次，你所想的永远是太天真。</p><p>总结一句话：<code>不要害怕经历，经历多一点你以后的路就好走一点</code>。</p><p><code>第二份工作进行中</code></p><p>～ ～ ～</p><p><code>目标展望</code></p><p>往后的路还长，技术之路也还很漫长，慢慢积累自己的经历。</p><p>路从现在开始，走下去，努力下去，成熟下去，向着自己的目标进发。</p><div class="danger custom-block"><p class="custom-block-title">寄语</p><p>一步一个脚印，你以后得到的，就是你现在付出的！</p></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/basic/clipboard.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>复制粘贴</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_" data-v-6b87e69f><div><h1 id="开启写作之旅" tabindex="-1">开启写作之旅 <a class="header-anchor" href="#开启写作之旅" aria-label="Permalink to &quot;开启写作之旅&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">文章</p><p>这里将开始自己的写作之旅（不仅仅是技术）</p></div><p><strong>简介</strong></p><p>我是一名<code>前端开发者</code>，2018 毕业，目前在杭州就业。</p><p>2018 年初，迈出校门，走入社会。</p><p>大学所学的知识让我充满了迷茫与惆怅（计算机专业什么都学），不知道出去该往哪个方向发展，路途未知。</p><p><code>第一份工作</code></p><p>靠着校招拿到一个 offer，沾沾自喜的我开始了第一份自己的工作。靠着自己的一分热血， 总以为能得到满意的结果。可事实终究残酷无情。学校中身边的都是你的同龄人，社会中面对着不同的层次，你所想的永远是太天真。</p><p>总结一句话：<code>不要害怕经历，经历多一点你以后的路就好走一点</code>。</p><p><code>第二份工作进行中</code></p><p>～ ～ ～</p><p><code>目标展望</code></p><p>往后的路还长，技术之路也还很漫长，慢慢积累自己的经历。</p><p>路从现在开始，走下去，努力下去，成熟下去，向着自己的目标进发。</p><div class="danger custom-block"><p class="custom-block-title">寄语</p><p>一步一个脚印，你以后得到的，就是你现在付出的！</p></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/basic/clipboard.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>复制粘贴</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/problem/css.html b/articles/problem/css.html
index 4613794..425072c 100644
--- a/articles/problem/css.html
+++ b/articles/problem/css.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>css 遇到的问题 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_problem_css.md.d109b0e6.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_problem_css.md.5cdc7adf.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_problem_css" data-v-6b87e69f><div><h1 id="css-遇到的问题" tabindex="-1">css 遇到的问题 <a class="header-anchor" href="#css-遇到的问题" aria-label="Permalink to &quot;css 遇到的问题&quot;">​</a></h1><h2 id="问题一" tabindex="-1">问题一 <a class="header-anchor" href="#问题一" aria-label="Permalink to &quot;问题一&quot;">​</a></h2><blockquote><p>inline-block 元素包含多个 inline-block 元素显示成一行时，设置 overflow: hidden，元素向下偏移</p></blockquote><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">&lt;!-- 会发现 span1 向下偏移一点了 --&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_problem_css" data-v-6b87e69f><div><h1 id="css-遇到的问题" tabindex="-1">css 遇到的问题 <a class="header-anchor" href="#css-遇到的问题" aria-label="Permalink to &quot;css 遇到的问题&quot;">​</a></h1><h2 id="问题一" tabindex="-1">问题一 <a class="header-anchor" href="#问题一" aria-label="Permalink to &quot;问题一&quot;">​</a></h2><blockquote><p>inline-block 元素包含多个 inline-block 元素显示成一行时，设置 overflow: hidden，元素向下偏移</p></blockquote><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">&lt;!-- 会发现 span1 向下偏移一点了 --&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;span&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;span1&quot;</span><span style="color:#E1E4E8;">&gt;1&lt;/</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;span2&quot;</span><span style="color:#E1E4E8;">&gt;2&lt;/</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;">&gt;</span></span>
@@ -59,8 +59,8 @@
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">.span2</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">overflow</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">hidden</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">vertical-align</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">bottom</span><span style="color:#24292E;">;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/servers/ecs.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ECS</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/problem/yarn.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Yarn 问题</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/servers/ecs.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ECS</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/problem/yarn.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Yarn 问题</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/problem/yarn.html b/articles/problem/yarn.html
index 31ae367..e8207e1 100644
--- a/articles/problem/yarn.html
+++ b/articles/problem/yarn.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>yarn 问题 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_problem_yarn.md.3bf099db.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_problem_yarn.md.6c3a7206.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_problem_yarn" data-v-6b87e69f><div><h1 id="yarn-问题" tabindex="-1">yarn 问题 <a class="header-anchor" href="#yarn-问题" aria-label="Permalink to &quot;yarn 问题&quot;">​</a></h1><h2 id="spawn-e2big" tabindex="-1">spawn E2BIG <a class="header-anchor" href="#spawn-e2big" aria-label="Permalink to &quot;spawn E2BIG&quot;">​</a></h2><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">error</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">An</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">unexpected</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">error</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">occurred:</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&quot;spawn E2BIG&quot;.</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">error</span><span style="color:#24292E;"> </span><span style="color:#032F62;">An</span><span style="color:#24292E;"> </span><span style="color:#032F62;">unexpected</span><span style="color:#24292E;"> </span><span style="color:#032F62;">error</span><span style="color:#24292E;"> </span><span style="color:#032F62;">occurred:</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&quot;spawn E2BIG&quot;.</span></span></code></pre></div><h3 id="问题描述" tabindex="-1">问题描述 <a class="header-anchor" href="#问题描述" aria-label="Permalink to &quot;问题描述&quot;">​</a></h3><ol><li>使用 yarn 启动脚本命令时，报 spawn E2BIG 错误</li></ol><h3 id="问题解决" tabindex="-1">问题解决 <a class="header-anchor" href="#问题解决" aria-label="Permalink to &quot;问题解决&quot;">​</a></h3><ol><li><p>根目录下存在以 notice notice. 命名的文件（删除或者更改名字）；</p></li><li><p>yarn 读取了 notice 文件作为 p<wbr>rocess.env.npm_package_noticeText 环境变量配置；</p></li><li><p>导致设置的 npm_package_noticeText 环境变量长度太大。</p></li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/problem/css.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Css 问题</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_problem_yarn" data-v-6b87e69f><div><h1 id="yarn-问题" tabindex="-1">yarn 问题 <a class="header-anchor" href="#yarn-问题" aria-label="Permalink to &quot;yarn 问题&quot;">​</a></h1><h2 id="spawn-e2big" tabindex="-1">spawn E2BIG <a class="header-anchor" href="#spawn-e2big" aria-label="Permalink to &quot;spawn E2BIG&quot;">​</a></h2><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">error</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">An</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">unexpected</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">error</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">occurred:</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&quot;spawn E2BIG&quot;.</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">error</span><span style="color:#24292E;"> </span><span style="color:#032F62;">An</span><span style="color:#24292E;"> </span><span style="color:#032F62;">unexpected</span><span style="color:#24292E;"> </span><span style="color:#032F62;">error</span><span style="color:#24292E;"> </span><span style="color:#032F62;">occurred:</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&quot;spawn E2BIG&quot;.</span></span></code></pre></div><h3 id="问题描述" tabindex="-1">问题描述 <a class="header-anchor" href="#问题描述" aria-label="Permalink to &quot;问题描述&quot;">​</a></h3><ol><li>使用 yarn 启动脚本命令时，报 spawn E2BIG 错误</li></ol><h3 id="问题解决" tabindex="-1">问题解决 <a class="header-anchor" href="#问题解决" aria-label="Permalink to &quot;问题解决&quot;">​</a></h3><ol><li><p>根目录下存在以 notice notice. 命名的文件（删除或者更改名字）；</p></li><li><p>yarn 读取了 notice 文件作为 p<wbr>rocess.env.npm_package_noticeText 环境变量配置；</p></li><li><p>导致设置的 npm_package_noticeText 环境变量长度太大。</p></li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/problem/css.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Css 问题</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/articles/servers/ecs.html b/articles/servers/ecs.html
index 97d1a1e..5d30c8c 100644
--- a/articles/servers/ecs.html
+++ b/articles/servers/ecs.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>云服务器ECS | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/articles_servers_ecs.md.f94f1bda.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/articles_servers_ecs.md.3a2f60fe.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_articles_servers_ecs" data-v-6b87e69f><div><h1 id="云服务器ecs" tabindex="-1">云服务器ECS <a class="header-anchor" href="#云服务器ecs" aria-label="Permalink to &quot;云服务器ECS&quot;">​</a></h1><h2 id="阿里云服务器-elastic-compute-service" tabindex="-1">阿里云服务器(Elastic Compute Service) <a class="header-anchor" href="#阿里云服务器-elastic-compute-service" aria-label="Permalink to &quot;阿里云服务器(Elastic Compute Service)&quot;">​</a></h2><h3 id="mac" tabindex="-1">MAC <a class="header-anchor" href="#mac" aria-label="Permalink to &quot;MAC&quot;">​</a></h3><p><code>Mac连接到linux环境</code></p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">ssh</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">root@</span><span style="color:#E1E4E8;">(</span><span style="color:#B392F0;">ECS公网IP</span><span style="color:#E1E4E8;">)</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">ssh</span><span style="color:#24292E;"> </span><span style="color:#032F62;">root@</span><span style="color:#24292E;">(</span><span style="color:#6F42C1;">ECS公网IP</span><span style="color:#24292E;">)</span></span></code></pre></div><h2 id="腾讯云" tabindex="-1">腾讯云 <a class="header-anchor" href="#腾讯云" aria-label="Permalink to &quot;腾讯云&quot;">​</a></h2></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/articles/advanced/virtualList.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>虚拟列表</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/articles/problem/css.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Css 问题</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文章</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>基础型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/clipboard.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>复制粘贴</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/color_convert.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>颜色转换</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/dom_events.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 事件流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/eslint.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ESlint 配置</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/git.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Git 操作</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/history.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>History 路由</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/ieee.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IEEE 标准</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/module.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>模块化演变</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/script_link.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Script 标签</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/basic/syslink.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Soft/Hard Links</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>进阶型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/debounce.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>防抖节流</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/devServer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>热重载</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/docs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端文档</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/htmlWebpackPlugin.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HtmlWebpackPlugin 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/knowledge.js" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>前端不知道的扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/v8-code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>V8 解析</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/advanced/virtualList.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>虚拟列表</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>服务器型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/servers/ecs.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ECS</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>问题型</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/css.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Css 问题</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/articles/problem/yarn.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Yarn 问题</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _articles_servers_ecs" data-v-6b87e69f><div><h1 id="云服务器ecs" tabindex="-1">云服务器ECS <a class="header-anchor" href="#云服务器ecs" aria-label="Permalink to &quot;云服务器ECS&quot;">​</a></h1><h2 id="阿里云服务器-elastic-compute-service" tabindex="-1">阿里云服务器(Elastic Compute Service) <a class="header-anchor" href="#阿里云服务器-elastic-compute-service" aria-label="Permalink to &quot;阿里云服务器(Elastic Compute Service)&quot;">​</a></h2><h3 id="mac" tabindex="-1">MAC <a class="header-anchor" href="#mac" aria-label="Permalink to &quot;MAC&quot;">​</a></h3><p><code>Mac连接到linux环境</code></p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">ssh</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">root@</span><span style="color:#E1E4E8;">(</span><span style="color:#B392F0;">ECS公网IP</span><span style="color:#E1E4E8;">)</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">ssh</span><span style="color:#24292E;"> </span><span style="color:#032F62;">root@</span><span style="color:#24292E;">(</span><span style="color:#6F42C1;">ECS公网IP</span><span style="color:#24292E;">)</span></span></code></pre></div><h2 id="腾讯云" tabindex="-1">腾讯云 <a class="header-anchor" href="#腾讯云" aria-label="Permalink to &quot;腾讯云&quot;">​</a></h2></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/articles/advanced/virtualList.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>虚拟列表</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/articles/problem/css.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Css 问题</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/assets/alogrithm_basic_O.md.7641dd85.js b/assets/alogrithm_basic_O.md.7641dd85.js
new file mode 100644
index 0000000..842e5b6
--- /dev/null
+++ b/assets/alogrithm_basic_O.md.7641dd85.js
@@ -0,0 +1 @@
+import{_ as a,o as e,c as t,Q as s}from"./chunks/framework.0e8ae64e.js";const i="/assets/images/time-complex.jpg",l="/assets/images/f(n).jpg",f=JSON.parse('{"title":"大 O 表示法","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/O.md","filePath":"alogrithm/basic/O.md","lastUpdated":1670379203000}'),o={name:"alogrithm/basic/O.md"},c=s('<h1 id="大-o-表示法" tabindex="-1">大 O 表示法 <a class="header-anchor" href="#大-o-表示法" aria-label="Permalink to &quot;大 O 表示法&quot;">​</a></h1><ul><li><p>所有代码执行的时间 T(n)与每行代码执行次数 n 成正比</p><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">T(n) = O(f(n))</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">T(n) = O(f(n))</span></span></code></pre></div></li></ul><h2 id="时间复杂度" tabindex="-1">时间复杂度 <a class="header-anchor" href="#时间复杂度" aria-label="Permalink to &quot;时间复杂度&quot;">​</a></h2><p><code>大O表示的并不是程序执行的时间，而是代码执行时间随着数据增长的变化趋势，渐进时间复杂度</code></p><ol><li>只关注循环最多的那一段代码</li><li>加法法则：总复杂度等于量级最大的那段代码的复杂度</li><li>乘法法则：嵌套代码的复杂度等于嵌套内外复杂度的乘积</li></ol><img src="'+i+'" alt="时间复杂度图"><h2 id="空间复杂度" tabindex="-1">空间复杂度 <a class="header-anchor" href="#空间复杂度" aria-label="Permalink to &quot;空间复杂度&quot;">​</a></h2><p><code>算法的执行时间与数据规模之间的增长关系，渐进空间复杂度</code></p><img src="'+l+'" alt="时间复杂度图"><ul><li>最好情况时间复杂度</li><li>最坏情况时间复杂度</li><li>平均情况时间复杂度</li><li>均摊时间复杂度</li></ul>',10),n=[c];function r(p,d,h,_,m,u){return e(),t("div",null,n)}const b=a(o,[["render",r]]);export{f as __pageData,b as default};
diff --git a/assets/alogrithm_basic_O.md.7641dd85.lean.js b/assets/alogrithm_basic_O.md.7641dd85.lean.js
new file mode 100644
index 0000000..cfdba63
--- /dev/null
+++ b/assets/alogrithm_basic_O.md.7641dd85.lean.js
@@ -0,0 +1 @@
+import{_ as a,o as e,c as t,Q as s}from"./chunks/framework.0e8ae64e.js";const i="/assets/images/time-complex.jpg",l="/assets/images/f(n).jpg",f=JSON.parse('{"title":"大 O 表示法","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/O.md","filePath":"alogrithm/basic/O.md","lastUpdated":1670379203000}'),o={name:"alogrithm/basic/O.md"},c=s("",10),n=[c];function r(p,d,h,_,m,u){return e(),t("div",null,n)}const b=a(o,[["render",r]]);export{f as __pageData,b as default};
diff --git a/assets/alogrithm_basic_O.md.efeb357c.js b/assets/alogrithm_basic_O.md.efeb357c.js
deleted file mode 100644
index fad9d7d..0000000
--- a/assets/alogrithm_basic_O.md.efeb357c.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as a,o as e,c as t,Q as s}from"./chunks/framework.7c0fadea.js";const i="/learning-docs2/assets/images/time-complex.jpg",l="/learning-docs2/assets/images/f(n).jpg",f=JSON.parse('{"title":"大 O 表示法","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/O.md","filePath":"alogrithm/basic/O.md","lastUpdated":1670379203000}'),o={name:"alogrithm/basic/O.md"},n=s('<h1 id="大-o-表示法" tabindex="-1">大 O 表示法 <a class="header-anchor" href="#大-o-表示法" aria-label="Permalink to &quot;大 O 表示法&quot;">​</a></h1><ul><li><p>所有代码执行的时间 T(n)与每行代码执行次数 n 成正比</p><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">T(n) = O(f(n))</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">T(n) = O(f(n))</span></span></code></pre></div></li></ul><h2 id="时间复杂度" tabindex="-1">时间复杂度 <a class="header-anchor" href="#时间复杂度" aria-label="Permalink to &quot;时间复杂度&quot;">​</a></h2><p><code>大O表示的并不是程序执行的时间，而是代码执行时间随着数据增长的变化趋势，渐进时间复杂度</code></p><ol><li>只关注循环最多的那一段代码</li><li>加法法则：总复杂度等于量级最大的那段代码的复杂度</li><li>乘法法则：嵌套代码的复杂度等于嵌套内外复杂度的乘积</li></ol><img src="'+i+'" alt="时间复杂度图"><h2 id="空间复杂度" tabindex="-1">空间复杂度 <a class="header-anchor" href="#空间复杂度" aria-label="Permalink to &quot;空间复杂度&quot;">​</a></h2><p><code>算法的执行时间与数据规模之间的增长关系，渐进空间复杂度</code></p><img src="'+l+'" alt="时间复杂度图"><ul><li>最好情况时间复杂度</li><li>最坏情况时间复杂度</li><li>平均情况时间复杂度</li><li>均摊时间复杂度</li></ul>',10),c=[n];function r(p,d,h,_,m,u){return e(),t("div",null,c)}const b=a(o,[["render",r]]);export{f as __pageData,b as default};
diff --git a/assets/alogrithm_basic_O.md.efeb357c.lean.js b/assets/alogrithm_basic_O.md.efeb357c.lean.js
deleted file mode 100644
index 5c7fbfa..0000000
--- a/assets/alogrithm_basic_O.md.efeb357c.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as a,o as e,c as t,Q as s}from"./chunks/framework.7c0fadea.js";const i="/learning-docs2/assets/images/time-complex.jpg",l="/learning-docs2/assets/images/f(n).jpg",f=JSON.parse('{"title":"大 O 表示法","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/O.md","filePath":"alogrithm/basic/O.md","lastUpdated":1670379203000}'),o={name:"alogrithm/basic/O.md"},n=s("",10),c=[n];function r(p,d,h,_,m,u){return e(),t("div",null,c)}const b=a(o,[["render",r]]);export{f as __pageData,b as default};
diff --git a/assets/alogrithm_basic_bit.md.1b0e2756.js b/assets/alogrithm_basic_bit.md.1b0e2756.js
deleted file mode 100644
index 915db6d..0000000
--- a/assets/alogrithm_basic_bit.md.1b0e2756.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as a,o as t,c as e,Q as i}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/bit_complex.jpg",u=JSON.parse('{"title":"位运算","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/bit.md","filePath":"alogrithm/basic/bit.md","lastUpdated":1670379203000}'),r={name:"alogrithm/basic/bit.md"},s=i('<h1 id="位运算" tabindex="-1">位运算 <a class="header-anchor" href="#位运算" aria-label="Permalink to &quot;位运算&quot;">​</a></h1><p>计算内存中二进制处理运算</p><h2 id="常用的位运算操作" tabindex="-1">常用的位运算操作 <a class="header-anchor" href="#常用的位运算操作" aria-label="Permalink to &quot;常用的位运算操作&quot;">​</a></h2><ul><li>x &amp; 1 == 1 OR 0 (判断奇偶)</li><li>x = x &amp; (x - 1) (清零最低位的 1)</li><li>x &amp; -x (得到最低位的 1)</li></ul><h2 id="复杂的位运算操作" tabindex="-1">复杂的位运算操作 <a class="header-anchor" href="#复杂的位运算操作" aria-label="Permalink to &quot;复杂的位运算操作&quot;">​</a></h2><img src="'+o+'" alt="复杂的位运算操作图">',6),l=[s];function c(n,_,d,h,m,p){return t(),e("div",null,l)}const x=a(r,[["render",c]]);export{u as __pageData,x as default};
diff --git a/assets/alogrithm_basic_bit.md.1b0e2756.lean.js b/assets/alogrithm_basic_bit.md.1b0e2756.lean.js
deleted file mode 100644
index 99b39a4..0000000
--- a/assets/alogrithm_basic_bit.md.1b0e2756.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as a,o as t,c as e,Q as i}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/bit_complex.jpg",u=JSON.parse('{"title":"位运算","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/bit.md","filePath":"alogrithm/basic/bit.md","lastUpdated":1670379203000}'),r={name:"alogrithm/basic/bit.md"},s=i("",6),l=[s];function c(n,_,d,h,m,p){return t(),e("div",null,l)}const x=a(r,[["render",c]]);export{u as __pageData,x as default};
diff --git a/assets/alogrithm_basic_bit.md.f90bc13d.js b/assets/alogrithm_basic_bit.md.f90bc13d.js
new file mode 100644
index 0000000..eab9ae6
--- /dev/null
+++ b/assets/alogrithm_basic_bit.md.f90bc13d.js
@@ -0,0 +1 @@
+import{_ as a,o as t,c as e,Q as i}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/bit_complex.jpg",u=JSON.parse('{"title":"位运算","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/bit.md","filePath":"alogrithm/basic/bit.md","lastUpdated":1670379203000}'),r={name:"alogrithm/basic/bit.md"},s=i('<h1 id="位运算" tabindex="-1">位运算 <a class="header-anchor" href="#位运算" aria-label="Permalink to &quot;位运算&quot;">​</a></h1><p>计算内存中二进制处理运算</p><h2 id="常用的位运算操作" tabindex="-1">常用的位运算操作 <a class="header-anchor" href="#常用的位运算操作" aria-label="Permalink to &quot;常用的位运算操作&quot;">​</a></h2><ul><li>x &amp; 1 == 1 OR 0 (判断奇偶)</li><li>x = x &amp; (x - 1) (清零最低位的 1)</li><li>x &amp; -x (得到最低位的 1)</li></ul><h2 id="复杂的位运算操作" tabindex="-1">复杂的位运算操作 <a class="header-anchor" href="#复杂的位运算操作" aria-label="Permalink to &quot;复杂的位运算操作&quot;">​</a></h2><img src="'+o+'" alt="复杂的位运算操作图">',6),l=[s];function c(_,n,d,h,m,p){return t(),e("div",null,l)}const x=a(r,[["render",c]]);export{u as __pageData,x as default};
diff --git a/assets/alogrithm_basic_bit.md.f90bc13d.lean.js b/assets/alogrithm_basic_bit.md.f90bc13d.lean.js
new file mode 100644
index 0000000..9007fef
--- /dev/null
+++ b/assets/alogrithm_basic_bit.md.f90bc13d.lean.js
@@ -0,0 +1 @@
+import{_ as a,o as t,c as e,Q as i}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/bit_complex.jpg",u=JSON.parse('{"title":"位运算","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/bit.md","filePath":"alogrithm/basic/bit.md","lastUpdated":1670379203000}'),r={name:"alogrithm/basic/bit.md"},s=i("",6),l=[s];function c(_,n,d,h,m,p){return t(),e("div",null,l)}const x=a(r,[["render",c]]);export{u as __pageData,x as default};
diff --git a/assets/alogrithm_basic_red_black_tree.md.1fb89df7.js b/assets/alogrithm_basic_red_black_tree.md.55eb2555.js
similarity index 96%
rename from assets/alogrithm_basic_red_black_tree.md.1fb89df7.js
rename to assets/alogrithm_basic_red_black_tree.md.55eb2555.js
index 8690874..cbf7b84 100644
--- a/assets/alogrithm_basic_red_black_tree.md.1fb89df7.js
+++ b/assets/alogrithm_basic_red_black_tree.md.55eb2555.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"红黑树","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/red_black_tree.md","filePath":"alogrithm/basic/red_black_tree.md","lastUpdated":1681461295000}'),e={name:"alogrithm/basic/red_black_tree.md"},p=n(`<h1 id="红黑树" tabindex="-1">红黑树 <a class="header-anchor" href="#红黑树" aria-label="Permalink to &quot;红黑树&quot;">​</a></h1><p>红黑树（Red-Black-Tree）</p><h2 id="特点" tabindex="-1">特点 <a class="header-anchor" href="#特点" aria-label="Permalink to &quot;特点&quot;">​</a></h2><ol><li>根节点必须是黑色的</li><li>每个叶子节点都是黑色的空节点</li><li>红色节点不能相邻</li><li>从该节点到可达节点的路径上的黑色节点数量相等</li></ol><h2 id="实现" tabindex="-1">实现 <a class="header-anchor" href="#实现" aria-label="Permalink to &quot;实现&quot;">​</a></h2><p>左旋、右旋（四种情况）</p><ol><li>三个节点呈右节点形式 right right 着色</li></ol><div class="language-md vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">1</span></span>
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"红黑树","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/red_black_tree.md","filePath":"alogrithm/basic/red_black_tree.md","lastUpdated":1681461295000}'),e={name:"alogrithm/basic/red_black_tree.md"},p=n(`<h1 id="红黑树" tabindex="-1">红黑树 <a class="header-anchor" href="#红黑树" aria-label="Permalink to &quot;红黑树&quot;">​</a></h1><p>红黑树（Red-Black-Tree）</p><h2 id="特点" tabindex="-1">特点 <a class="header-anchor" href="#特点" aria-label="Permalink to &quot;特点&quot;">​</a></h2><ol><li>根节点必须是黑色的</li><li>每个叶子节点都是黑色的空节点</li><li>红色节点不能相邻</li><li>从该节点到可达节点的路径上的黑色节点数量相等</li></ol><h2 id="实现" tabindex="-1">实现 <a class="header-anchor" href="#实现" aria-label="Permalink to &quot;实现&quot;">​</a></h2><p>左旋、右旋（四种情况）</p><ol><li>三个节点呈右节点形式 right right 着色</li></ol><div class="language-md vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">1</span></span>
 <span class="line"><span style="color:#E1E4E8;">  2</span></span>
 <span class="line"><span style="color:#E1E4E8;">    3</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">1</span></span>
 <span class="line"><span style="color:#24292E;">  2</span></span>
diff --git a/assets/alogrithm_basic_red_black_tree.md.1fb89df7.lean.js b/assets/alogrithm_basic_red_black_tree.md.55eb2555.lean.js
similarity index 72%
rename from assets/alogrithm_basic_red_black_tree.md.1fb89df7.lean.js
rename to assets/alogrithm_basic_red_black_tree.md.55eb2555.lean.js
index aa08a75..da3df0c 100644
--- a/assets/alogrithm_basic_red_black_tree.md.1fb89df7.lean.js
+++ b/assets/alogrithm_basic_red_black_tree.md.55eb2555.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"红黑树","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/red_black_tree.md","filePath":"alogrithm/basic/red_black_tree.md","lastUpdated":1681461295000}'),e={name:"alogrithm/basic/red_black_tree.md"},p=n("",14),t=[p];function o(c,i,r,d,h,E){return a(),l("div",null,t)}const y=s(e,[["render",o]]);export{_ as __pageData,y as default};
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"红黑树","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/basic/red_black_tree.md","filePath":"alogrithm/basic/red_black_tree.md","lastUpdated":1681461295000}'),e={name:"alogrithm/basic/red_black_tree.md"},p=n("",14),t=[p];function o(c,i,r,d,h,E){return a(),l("div",null,t)}const y=s(e,[["render",o]]);export{_ as __pageData,y as default};
diff --git a/assets/alogrithm_index.md.2b9ae594.js b/assets/alogrithm_index.md.67f8b108.js
similarity index 91%
rename from assets/alogrithm_index.md.2b9ae594.js
rename to assets/alogrithm_index.md.67f8b108.js
index fb63959..9506245 100644
--- a/assets/alogrithm_index.md.2b9ae594.js
+++ b/assets/alogrithm_index.md.67f8b108.js
@@ -1 +1 @@
-import{_ as t,o as a,c as o,k as e,a as s}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"开启之路","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/index.md","filePath":"alogrithm/index.md","lastUpdated":1670330848000}'),c={name:"alogrithm/index.md"},r=e("h1",{id:"开启之路",tabindex:"-1"},[s("开启之路 "),e("a",{class:"header-anchor",href:"#开启之路","aria-label":'Permalink to "开启之路"'},"​")],-1),i=e("div",{class:"tip custom-block"},[e("p",{class:"custom-block-title"},"算法"),e("p",null,"数据结构有限，算法无限")],-1),n=[r,i];function d(l,_,m,p,h,f){return a(),o("div",null,n)}const k=t(c,[["render",d]]);export{u as __pageData,k as default};
+import{_ as t,o as a,c as o,k as e,a as s}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"开启之路","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/index.md","filePath":"alogrithm/index.md","lastUpdated":1670330848000}'),c={name:"alogrithm/index.md"},r=e("h1",{id:"开启之路",tabindex:"-1"},[s("开启之路 "),e("a",{class:"header-anchor",href:"#开启之路","aria-label":'Permalink to "开启之路"'},"​")],-1),i=e("div",{class:"tip custom-block"},[e("p",{class:"custom-block-title"},"算法"),e("p",null,"数据结构有限，算法无限")],-1),n=[r,i];function d(l,_,m,p,h,f){return a(),o("div",null,n)}const k=t(c,[["render",d]]);export{u as __pageData,k as default};
diff --git a/assets/alogrithm_index.md.2b9ae594.lean.js b/assets/alogrithm_index.md.67f8b108.lean.js
similarity index 91%
rename from assets/alogrithm_index.md.2b9ae594.lean.js
rename to assets/alogrithm_index.md.67f8b108.lean.js
index fb63959..9506245 100644
--- a/assets/alogrithm_index.md.2b9ae594.lean.js
+++ b/assets/alogrithm_index.md.67f8b108.lean.js
@@ -1 +1 @@
-import{_ as t,o as a,c as o,k as e,a as s}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"开启之路","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/index.md","filePath":"alogrithm/index.md","lastUpdated":1670330848000}'),c={name:"alogrithm/index.md"},r=e("h1",{id:"开启之路",tabindex:"-1"},[s("开启之路 "),e("a",{class:"header-anchor",href:"#开启之路","aria-label":'Permalink to "开启之路"'},"​")],-1),i=e("div",{class:"tip custom-block"},[e("p",{class:"custom-block-title"},"算法"),e("p",null,"数据结构有限，算法无限")],-1),n=[r,i];function d(l,_,m,p,h,f){return a(),o("div",null,n)}const k=t(c,[["render",d]]);export{u as __pageData,k as default};
+import{_ as t,o as a,c as o,k as e,a as s}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"开启之路","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/index.md","filePath":"alogrithm/index.md","lastUpdated":1670330848000}'),c={name:"alogrithm/index.md"},r=e("h1",{id:"开启之路",tabindex:"-1"},[s("开启之路 "),e("a",{class:"header-anchor",href:"#开启之路","aria-label":'Permalink to "开启之路"'},"​")],-1),i=e("div",{class:"tip custom-block"},[e("p",{class:"custom-block-title"},"算法"),e("p",null,"数据结构有限，算法无限")],-1),n=[r,i];function d(l,_,m,p,h,f){return a(),o("div",null,n)}const k=t(c,[["render",d]]);export{u as __pageData,k as default};
diff --git a/assets/alogrithm_interview_self.md.f2953867.js b/assets/alogrithm_interview_self.md.c8309eff.js
similarity index 99%
rename from assets/alogrithm_interview_self.md.f2953867.js
rename to assets/alogrithm_interview_self.md.c8309eff.js
index d3cdf0f..093ff20 100644
--- a/assets/alogrithm_interview_self.md.f2953867.js
+++ b/assets/alogrithm_interview_self.md.c8309eff.js
@@ -1,4 +1,4 @@
-import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"数据结构辅助记忆","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/interview/self.md","filePath":"alogrithm/interview/self.md","lastUpdated":1694490311000}'),e={name:"alogrithm/interview/self.md"},p=n(`<h1 id="数据结构辅助记忆" tabindex="-1">数据结构辅助记忆 <a class="header-anchor" href="#数据结构辅助记忆" aria-label="Permalink to &quot;数据结构辅助记忆&quot;">​</a></h1><blockquote><p>适合自己的数据结构与算法的记忆方法</p></blockquote><h2 id="常见的数据结构" tabindex="-1">常见的数据结构 <a class="header-anchor" href="#常见的数据结构" aria-label="Permalink to &quot;常见的数据结构&quot;">​</a></h2><h3 id="堆" tabindex="-1">堆 <a class="header-anchor" href="#堆" aria-label="Permalink to &quot;堆&quot;">​</a></h3><p>小顶堆 大顶堆</p><ul><li>数组存储</li><li>左字节点下标 i 对应的父节点为 2 * i + 1</li><li>右字节点下标 i 对应的父节点为 2 * i + 2</li><li>建堆 <ul><li>自下向顶（递归父节点）</li><li>自顶向下（递归左右子节点）</li></ul></li><li>删除 <ul><li>删除的元素（相同的元素）</li><li>最后一个元素替换删除元素</li><li>重新建堆 <ul><li>没有左节点 自下向顶</li><li>有左节点且（没有父节点或者当前删除的节点与父节点比较）自顶向下</li></ul></li></ul></li><li>实例方法 <ul><li>insert</li><li>delete</li><li>find</li></ul></li><li>堆排序 <ul><li>每次取堆顶元素，重新向下建堆</li><li>直到堆为空</li></ul></li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 建堆</span></span>
+import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"数据结构辅助记忆","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/interview/self.md","filePath":"alogrithm/interview/self.md","lastUpdated":1694490311000}'),e={name:"alogrithm/interview/self.md"},p=n(`<h1 id="数据结构辅助记忆" tabindex="-1">数据结构辅助记忆 <a class="header-anchor" href="#数据结构辅助记忆" aria-label="Permalink to &quot;数据结构辅助记忆&quot;">​</a></h1><blockquote><p>适合自己的数据结构与算法的记忆方法</p></blockquote><h2 id="常见的数据结构" tabindex="-1">常见的数据结构 <a class="header-anchor" href="#常见的数据结构" aria-label="Permalink to &quot;常见的数据结构&quot;">​</a></h2><h3 id="堆" tabindex="-1">堆 <a class="header-anchor" href="#堆" aria-label="Permalink to &quot;堆&quot;">​</a></h3><p>小顶堆 大顶堆</p><ul><li>数组存储</li><li>左字节点下标 i 对应的父节点为 2 * i + 1</li><li>右字节点下标 i 对应的父节点为 2 * i + 2</li><li>建堆 <ul><li>自下向顶（递归父节点）</li><li>自顶向下（递归左右子节点）</li></ul></li><li>删除 <ul><li>删除的元素（相同的元素）</li><li>最后一个元素替换删除元素</li><li>重新建堆 <ul><li>没有左节点 自下向顶</li><li>有左节点且（没有父节点或者当前删除的节点与父节点比较）自顶向下</li></ul></li></ul></li><li>实例方法 <ul><li>insert</li><li>delete</li><li>find</li></ul></li><li>堆排序 <ul><li>每次取堆顶元素，重新向下建堆</li><li>直到堆为空</li></ul></li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 建堆</span></span>
 <span class="line"><span style="color:#F97583;">class</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">Heap</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">add</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">v</span><span style="color:#E1E4E8;">) {}</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">remove</span><span style="color:#E1E4E8;">() {},</span></span>
diff --git a/assets/alogrithm_interview_self.md.f2953867.lean.js b/assets/alogrithm_interview_self.md.c8309eff.lean.js
similarity index 72%
rename from assets/alogrithm_interview_self.md.f2953867.lean.js
rename to assets/alogrithm_interview_self.md.c8309eff.lean.js
index b3c42b9..6fe607d 100644
--- a/assets/alogrithm_interview_self.md.f2953867.lean.js
+++ b/assets/alogrithm_interview_self.md.c8309eff.lean.js
@@ -1 +1 @@
-import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"数据结构辅助记忆","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/interview/self.md","filePath":"alogrithm/interview/self.md","lastUpdated":1694490311000}'),e={name:"alogrithm/interview/self.md"},p=n("",37),o=[p];function i(t,r,c,E,y,d){return l(),a("div",null,o)}const b=s(e,[["render",i]]);export{h as __pageData,b as default};
+import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"数据结构辅助记忆","description":"","frontmatter":{},"headers":[],"relativePath":"alogrithm/interview/self.md","filePath":"alogrithm/interview/self.md","lastUpdated":1694490311000}'),e={name:"alogrithm/interview/self.md"},p=n("",37),o=[p];function i(t,r,c,E,y,d){return l(),a("div",null,o)}const b=s(e,[["render",i]]);export{h as __pageData,b as default};
diff --git a/assets/app.eb6611c3.js b/assets/app.2b2e5b4f.js
similarity index 90%
rename from assets/app.eb6611c3.js
rename to assets/app.2b2e5b4f.js
index 6a566da..d069ed3 100644
--- a/assets/app.eb6611c3.js
+++ b/assets/app.2b2e5b4f.js
@@ -1 +1 @@
-import{s,a3 as i,a4 as u,a5 as c,a6 as l,a7 as d,a8 as f,a9 as m,aa as h,ab as A,ac as g,X as P,d as v,u as y,j as C,y as w,ad as _,ae as b,af as E,ag as R}from"./chunks/framework.7c0fadea.js";import{t as D}from"./chunks/theme.668a0457.js";function p(e){if(e.extends){const a=p(e.extends);return{...a,...e,async enhanceApp(t){a.enhanceApp&&await a.enhanceApp(t),e.enhanceApp&&await e.enhanceApp(t)}}}return e}const o=p(D),j=v({name:"VitePressApp",setup(){const{site:e}=y();return C(()=>{w(()=>{document.documentElement.lang=e.value.lang,document.documentElement.dir=e.value.dir})}),_(),b(),E(),o.setup&&o.setup(),()=>R(o.Layout)}});async function O(){const e=T(),a=S();a.provide(u,e);const t=c(e.route);return a.provide(l,t),a.component("Content",d),a.component("ClientOnly",f),Object.defineProperties(a.config.globalProperties,{$frontmatter:{get(){return t.frontmatter.value}},$params:{get(){return t.page.value.params}}}),o.enhanceApp&&await o.enhanceApp({app:a,router:e,siteData:m}),{app:a,router:e,data:t}}function S(){return h(j)}function T(){let e=s,a;return A(t=>{let n=g(t),r=null;return n&&(e&&(a=n),(e||a===n)&&(n=n.replace(/\.js$/,".lean.js")),r=P(()=>import(n),[])),s&&(e=!1),r},o.NotFound)}s&&O().then(({app:e,router:a,data:t})=>{a.go().then(()=>{i(a.route,t.site),e.mount("#app")})});export{O as createApp};
+import{s,a3 as i,a4 as u,a5 as c,a6 as l,a7 as d,a8 as f,a9 as m,aa as h,ab as A,ac as g,X as P,d as v,u as y,j as C,y as w,ad as _,ae as b,af as E,ag as R}from"./chunks/framework.0e8ae64e.js";import{t as D}from"./chunks/theme.c533df5a.js";function p(e){if(e.extends){const a=p(e.extends);return{...a,...e,async enhanceApp(t){a.enhanceApp&&await a.enhanceApp(t),e.enhanceApp&&await e.enhanceApp(t)}}}return e}const o=p(D),j=v({name:"VitePressApp",setup(){const{site:e}=y();return C(()=>{w(()=>{document.documentElement.lang=e.value.lang,document.documentElement.dir=e.value.dir})}),_(),b(),E(),o.setup&&o.setup(),()=>R(o.Layout)}});async function O(){const e=T(),a=S();a.provide(u,e);const t=c(e.route);return a.provide(l,t),a.component("Content",d),a.component("ClientOnly",f),Object.defineProperties(a.config.globalProperties,{$frontmatter:{get(){return t.frontmatter.value}},$params:{get(){return t.page.value.params}}}),o.enhanceApp&&await o.enhanceApp({app:a,router:e,siteData:m}),{app:a,router:e,data:t}}function S(){return h(j)}function T(){let e=s,a;return A(t=>{let n=g(t),r=null;return n&&(e&&(a=n),(e||a===n)&&(n=n.replace(/\.js$/,".lean.js")),r=P(()=>import(n),[])),s&&(e=!1),r},o.NotFound)}s&&O().then(({app:e,router:a,data:t})=>{a.go().then(()=>{i(a.route,t.site),e.mount("#app")})});export{O as createApp};
diff --git a/assets/architecture_index.md.d9230efd.js b/assets/architecture_index.md.678a0502.js
similarity index 91%
rename from assets/architecture_index.md.d9230efd.js
rename to assets/architecture_index.md.678a0502.js
index 68c2945..3cc679b 100644
--- a/assets/architecture_index.md.d9230efd.js
+++ b/assets/architecture_index.md.678a0502.js
@@ -1 +1 @@
-import{_ as t,o as a,c as o,k as e,a as c}from"./chunks/framework.7c0fadea.js";const k=JSON.parse('{"title":"架构","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/index.md","filePath":"architecture/index.md","lastUpdated":1670330848000}'),n={name:"architecture/index.md"},r=e("h1",{id:"架构",tabindex:"-1"},[c("架构 "),e("a",{class:"header-anchor",href:"#架构","aria-label":'Permalink to "架构"'},"​")],-1),s=e("blockquote",null,[e("p",null,"开始对前端架构的思考")],-1),d=e("p",null,[e("code",null,"前端不止于技术，如何系统化，全方位串联起来，需要认真的思考。")],-1),i=[r,s,d];function l(_,h,p,u,m,f){return a(),o("div",null,i)}const $=t(n,[["render",l]]);export{k as __pageData,$ as default};
+import{_ as t,o as a,c as o,k as e,a as c}from"./chunks/framework.0e8ae64e.js";const k=JSON.parse('{"title":"架构","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/index.md","filePath":"architecture/index.md","lastUpdated":1670330848000}'),n={name:"architecture/index.md"},r=e("h1",{id:"架构",tabindex:"-1"},[c("架构 "),e("a",{class:"header-anchor",href:"#架构","aria-label":'Permalink to "架构"'},"​")],-1),s=e("blockquote",null,[e("p",null,"开始对前端架构的思考")],-1),d=e("p",null,[e("code",null,"前端不止于技术，如何系统化，全方位串联起来，需要认真的思考。")],-1),i=[r,s,d];function l(_,h,p,u,m,f){return a(),o("div",null,i)}const $=t(n,[["render",l]]);export{k as __pageData,$ as default};
diff --git a/assets/architecture_index.md.d9230efd.lean.js b/assets/architecture_index.md.678a0502.lean.js
similarity index 91%
rename from assets/architecture_index.md.d9230efd.lean.js
rename to assets/architecture_index.md.678a0502.lean.js
index 68c2945..3cc679b 100644
--- a/assets/architecture_index.md.d9230efd.lean.js
+++ b/assets/architecture_index.md.678a0502.lean.js
@@ -1 +1 @@
-import{_ as t,o as a,c as o,k as e,a as c}from"./chunks/framework.7c0fadea.js";const k=JSON.parse('{"title":"架构","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/index.md","filePath":"architecture/index.md","lastUpdated":1670330848000}'),n={name:"architecture/index.md"},r=e("h1",{id:"架构",tabindex:"-1"},[c("架构 "),e("a",{class:"header-anchor",href:"#架构","aria-label":'Permalink to "架构"'},"​")],-1),s=e("blockquote",null,[e("p",null,"开始对前端架构的思考")],-1),d=e("p",null,[e("code",null,"前端不止于技术，如何系统化，全方位串联起来，需要认真的思考。")],-1),i=[r,s,d];function l(_,h,p,u,m,f){return a(),o("div",null,i)}const $=t(n,[["render",l]]);export{k as __pageData,$ as default};
+import{_ as t,o as a,c as o,k as e,a as c}from"./chunks/framework.0e8ae64e.js";const k=JSON.parse('{"title":"架构","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/index.md","filePath":"architecture/index.md","lastUpdated":1670330848000}'),n={name:"architecture/index.md"},r=e("h1",{id:"架构",tabindex:"-1"},[c("架构 "),e("a",{class:"header-anchor",href:"#架构","aria-label":'Permalink to "架构"'},"​")],-1),s=e("blockquote",null,[e("p",null,"开始对前端架构的思考")],-1),d=e("p",null,[e("code",null,"前端不止于技术，如何系统化，全方位串联起来，需要认真的思考。")],-1),i=[r,s,d];function l(_,h,p,u,m,f){return a(),o("div",null,i)}const $=t(n,[["render",l]]);export{k as __pageData,$ as default};
diff --git a/assets/architecture_standard_A-YZ.md.bd642461.js b/assets/architecture_standard_A-YZ.md.a0e51b94.js
similarity index 95%
rename from assets/architecture_standard_A-YZ.md.bd642461.js
rename to assets/architecture_standard_A-YZ.md.a0e51b94.js
index e9e910b..7cbb817 100644
--- a/assets/architecture_standard_A-YZ.md.bd642461.js
+++ b/assets/architecture_standard_A-YZ.md.a0e51b94.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"A-YZ","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/A-YZ.md","filePath":"architecture/standard/A-YZ.md","lastUpdated":1670330848000}'),o={name:"architecture/standard/A-YZ.md"},i=r('<h1 id="a-yz" tabindex="-1">A-YZ <a class="header-anchor" href="#a-yz" aria-label="Permalink to &quot;A-YZ&quot;">​</a></h1><p><strong>Node 技术框架：业务层、基础框架层、通用组件、基础服务组件</strong></p><ol><li>针对整个业务层的 UI 自动化，核心接口，页面检测</li><li>针对 client 层的 sentry 报警</li><li>针对 server 层的接口测试、业务报警</li><li>针对基础框架和通用组件的单元测试</li><li>针对通用组件变更的版本变更报警</li><li>针对线上发布的流程规范、用例维护</li></ol><h3 id="ui-自动化" tabindex="-1">UI 自动化 <a class="header-anchor" href="#ui-自动化" aria-label="Permalink to &quot;UI 自动化&quot;">​</a></h3><p>[1] 框架选择</p><p><code>puppeteer + mocha + mochawesome</code></p><p>[2] 脚本编写</p><p><code>封装基础库 + 业务用例</code></p><p>[3] 执行逻辑</p><p><code>分环境执行 + 监控源码变更（gitlab webhook） + 每日定时执行</code></p><h3 id="接口测试" tabindex="-1">接口测试 <a class="header-anchor" href="#接口测试" aria-label="Permalink to &quot;接口测试&quot;">​</a></h3><p><code>istanbul jenkins 持续集成自动构建</code></p><h3 id="单元测试" tabindex="-1">单元测试 <a class="header-anchor" href="#单元测试" aria-label="Permalink to &quot;单元测试&quot;">​</a></h3><p><code>jest</code></p><h3 id="基础库变更报警" tabindex="-1">基础库变更报警 <a class="header-anchor" href="#基础库变更报警" aria-label="Permalink to &quot;基础库变更报警&quot;">​</a></h3><p><code>邮件发送变更</code></p><h3 id="sentry-报警" tabindex="-1">sentry 报警 <a class="header-anchor" href="#sentry-报警" aria-label="Permalink to &quot;sentry 报警&quot;">​</a></h3><h3 id="业务报警" tabindex="-1">业务报警 <a class="header-anchor" href="#业务报警" aria-label="Permalink to &quot;业务报警&quot;">​</a></h3><h3 id="约定规范" tabindex="-1">约定规范 <a class="header-anchor" href="#约定规范" aria-label="Permalink to &quot;约定规范&quot;">​</a></h3>',19),l=[i];function d(c,n,s,h,p,u){return e(),t("div",null,l)}const b=a(o,[["render",d]]);export{m as __pageData,b as default};
+import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"A-YZ","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/A-YZ.md","filePath":"architecture/standard/A-YZ.md","lastUpdated":1670330848000}'),o={name:"architecture/standard/A-YZ.md"},i=r('<h1 id="a-yz" tabindex="-1">A-YZ <a class="header-anchor" href="#a-yz" aria-label="Permalink to &quot;A-YZ&quot;">​</a></h1><p><strong>Node 技术框架：业务层、基础框架层、通用组件、基础服务组件</strong></p><ol><li>针对整个业务层的 UI 自动化，核心接口，页面检测</li><li>针对 client 层的 sentry 报警</li><li>针对 server 层的接口测试、业务报警</li><li>针对基础框架和通用组件的单元测试</li><li>针对通用组件变更的版本变更报警</li><li>针对线上发布的流程规范、用例维护</li></ol><h3 id="ui-自动化" tabindex="-1">UI 自动化 <a class="header-anchor" href="#ui-自动化" aria-label="Permalink to &quot;UI 自动化&quot;">​</a></h3><p>[1] 框架选择</p><p><code>puppeteer + mocha + mochawesome</code></p><p>[2] 脚本编写</p><p><code>封装基础库 + 业务用例</code></p><p>[3] 执行逻辑</p><p><code>分环境执行 + 监控源码变更（gitlab webhook） + 每日定时执行</code></p><h3 id="接口测试" tabindex="-1">接口测试 <a class="header-anchor" href="#接口测试" aria-label="Permalink to &quot;接口测试&quot;">​</a></h3><p><code>istanbul jenkins 持续集成自动构建</code></p><h3 id="单元测试" tabindex="-1">单元测试 <a class="header-anchor" href="#单元测试" aria-label="Permalink to &quot;单元测试&quot;">​</a></h3><p><code>jest</code></p><h3 id="基础库变更报警" tabindex="-1">基础库变更报警 <a class="header-anchor" href="#基础库变更报警" aria-label="Permalink to &quot;基础库变更报警&quot;">​</a></h3><p><code>邮件发送变更</code></p><h3 id="sentry-报警" tabindex="-1">sentry 报警 <a class="header-anchor" href="#sentry-报警" aria-label="Permalink to &quot;sentry 报警&quot;">​</a></h3><h3 id="业务报警" tabindex="-1">业务报警 <a class="header-anchor" href="#业务报警" aria-label="Permalink to &quot;业务报警&quot;">​</a></h3><h3 id="约定规范" tabindex="-1">约定规范 <a class="header-anchor" href="#约定规范" aria-label="Permalink to &quot;约定规范&quot;">​</a></h3>',19),l=[i];function d(c,n,s,h,p,u){return e(),t("div",null,l)}const b=a(o,[["render",d]]);export{m as __pageData,b as default};
diff --git a/assets/architecture_standard_A-YZ.md.bd642461.lean.js b/assets/architecture_standard_A-YZ.md.a0e51b94.lean.js
similarity index 71%
rename from assets/architecture_standard_A-YZ.md.bd642461.lean.js
rename to assets/architecture_standard_A-YZ.md.a0e51b94.lean.js
index 687645e..87e0c53 100644
--- a/assets/architecture_standard_A-YZ.md.bd642461.lean.js
+++ b/assets/architecture_standard_A-YZ.md.a0e51b94.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"A-YZ","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/A-YZ.md","filePath":"architecture/standard/A-YZ.md","lastUpdated":1670330848000}'),o={name:"architecture/standard/A-YZ.md"},i=r("",19),l=[i];function d(c,n,s,h,p,u){return e(),t("div",null,l)}const b=a(o,[["render",d]]);export{m as __pageData,b as default};
+import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"A-YZ","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/A-YZ.md","filePath":"architecture/standard/A-YZ.md","lastUpdated":1670330848000}'),o={name:"architecture/standard/A-YZ.md"},i=r("",19),l=[i];function d(c,n,s,h,p,u){return e(),t("div",null,l)}const b=a(o,[["render",d]]);export{m as __pageData,b as default};
diff --git a/assets/architecture_standard_comp-mod.md.f6f9cedd.js b/assets/architecture_standard_comp-mod.md.e027bdb0.js
similarity index 96%
rename from assets/architecture_standard_comp-mod.md.f6f9cedd.js
rename to assets/architecture_standard_comp-mod.md.e027bdb0.js
index 6195678..9dc61a1 100644
--- a/assets/architecture_standard_comp-mod.md.f6f9cedd.js
+++ b/assets/architecture_standard_comp-mod.md.e027bdb0.js
@@ -1 +1 @@
-import{_ as a,o as e,c as i,Q as l}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"组件化与模块化设计","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/comp-mod.md","filePath":"architecture/standard/comp-mod.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/comp-mod.md"},o=l('<h1 id="组件化与模块化设计" tabindex="-1">组件化与模块化设计 <a class="header-anchor" href="#组件化与模块化设计" aria-label="Permalink to &quot;组件化与模块化设计&quot;">​</a></h1><h2 id="模块化设计" tabindex="-1">模块化设计 <a class="header-anchor" href="#模块化设计" aria-label="Permalink to &quot;模块化设计&quot;">​</a></h2><h3 id="应用的模块与层级划分" tabindex="-1">应用的模块与层级划分 <a class="header-anchor" href="#应用的模块与层级划分" aria-label="Permalink to &quot;应用的模块与层级划分&quot;">​</a></h3><ul><li>对于简单的管理端应用，可以采用类似MVC结构进行拆分（视图模块、数据模块、逻辑控制模块）</li><li>对于页面内容丰富的应用，可以结合业务进行细分和组件拆分（核心模块、功能模块、公共组件）</li><li>对于交互和逻辑复杂的应用，可以根据系统架构将应用进行模块和层级的划分（渲染层、数据层、网络层）</li></ul><h3 id="模块划分与设计原则" tabindex="-1">模块划分与设计原则 <a class="header-anchor" href="#模块划分与设计原则" aria-label="Permalink to &quot;模块划分与设计原则&quot;">​</a></h3><ul><li>领域驱动设计（Domain-Driven Design DDD）：从业务领域的角度来对系统进行领域划分和建模</li><li>职责驱动设计（Responsibility-Driven Design RDD）：从系统内部的角度来进行职责划分，模块拆分以及协作方式</li></ul><h3 id="如何进行模块间依赖的解耦" tabindex="-1">如何进行模块间依赖的解耦 <a class="header-anchor" href="#如何进行模块间依赖的解耦" aria-label="Permalink to &quot;如何进行模块间依赖的解耦&quot;">​</a></h3><p><code>高内聚 低耦合</code></p><ul><li>低耦合基于抽象，使系统更具模块化，不相关的事物不应相互依赖</li><li>高内聚则意味着对象专注于单一职责</li></ul><p><code>依赖倒置</code></p><ul><li>高层次的模块不应该依赖低层次的模块，两者都应该依赖于抽象接口</li><li>抽象接口不应该依赖于具体实现，而具体实现则依赖于抽象接口</li></ul><p><code>事件驱动</code></p><ul><li>Nodejs 的 Event/Emitter</li></ul><h2 id="组件化设计" tabindex="-1">组件化设计 <a class="header-anchor" href="#组件化设计" aria-label="Permalink to &quot;组件化设计&quot;">​</a></h2><h3 id="组件划分" tabindex="-1">组件划分 <a class="header-anchor" href="#组件划分" aria-label="Permalink to &quot;组件划分&quot;">​</a></h3><ul><li>代码复用划分</li><li>视觉和交互划分</li></ul><h3 id="组件封装" tabindex="-1">组件封装 <a class="header-anchor" href="#组件封装" aria-label="Permalink to &quot;组件封装&quot;">​</a></h3><ul><li>组件内维护自身的数据和状态</li><li>组件内维护自身的事件</li><li>对外提供配置接口，控制展示以及具体功能</li><li>对外提供查询接口，获取组件的状态和数据</li></ul>',18),r=[o];function d(n,c,h,s,u,_){return e(),i("div",null,r)}const b=a(t,[["render",d]]);export{p as __pageData,b as default};
+import{_ as a,o as e,c as i,Q as l}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"组件化与模块化设计","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/comp-mod.md","filePath":"architecture/standard/comp-mod.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/comp-mod.md"},o=l('<h1 id="组件化与模块化设计" tabindex="-1">组件化与模块化设计 <a class="header-anchor" href="#组件化与模块化设计" aria-label="Permalink to &quot;组件化与模块化设计&quot;">​</a></h1><h2 id="模块化设计" tabindex="-1">模块化设计 <a class="header-anchor" href="#模块化设计" aria-label="Permalink to &quot;模块化设计&quot;">​</a></h2><h3 id="应用的模块与层级划分" tabindex="-1">应用的模块与层级划分 <a class="header-anchor" href="#应用的模块与层级划分" aria-label="Permalink to &quot;应用的模块与层级划分&quot;">​</a></h3><ul><li>对于简单的管理端应用，可以采用类似MVC结构进行拆分（视图模块、数据模块、逻辑控制模块）</li><li>对于页面内容丰富的应用，可以结合业务进行细分和组件拆分（核心模块、功能模块、公共组件）</li><li>对于交互和逻辑复杂的应用，可以根据系统架构将应用进行模块和层级的划分（渲染层、数据层、网络层）</li></ul><h3 id="模块划分与设计原则" tabindex="-1">模块划分与设计原则 <a class="header-anchor" href="#模块划分与设计原则" aria-label="Permalink to &quot;模块划分与设计原则&quot;">​</a></h3><ul><li>领域驱动设计（Domain-Driven Design DDD）：从业务领域的角度来对系统进行领域划分和建模</li><li>职责驱动设计（Responsibility-Driven Design RDD）：从系统内部的角度来进行职责划分，模块拆分以及协作方式</li></ul><h3 id="如何进行模块间依赖的解耦" tabindex="-1">如何进行模块间依赖的解耦 <a class="header-anchor" href="#如何进行模块间依赖的解耦" aria-label="Permalink to &quot;如何进行模块间依赖的解耦&quot;">​</a></h3><p><code>高内聚 低耦合</code></p><ul><li>低耦合基于抽象，使系统更具模块化，不相关的事物不应相互依赖</li><li>高内聚则意味着对象专注于单一职责</li></ul><p><code>依赖倒置</code></p><ul><li>高层次的模块不应该依赖低层次的模块，两者都应该依赖于抽象接口</li><li>抽象接口不应该依赖于具体实现，而具体实现则依赖于抽象接口</li></ul><p><code>事件驱动</code></p><ul><li>Nodejs 的 Event/Emitter</li></ul><h2 id="组件化设计" tabindex="-1">组件化设计 <a class="header-anchor" href="#组件化设计" aria-label="Permalink to &quot;组件化设计&quot;">​</a></h2><h3 id="组件划分" tabindex="-1">组件划分 <a class="header-anchor" href="#组件划分" aria-label="Permalink to &quot;组件划分&quot;">​</a></h3><ul><li>代码复用划分</li><li>视觉和交互划分</li></ul><h3 id="组件封装" tabindex="-1">组件封装 <a class="header-anchor" href="#组件封装" aria-label="Permalink to &quot;组件封装&quot;">​</a></h3><ul><li>组件内维护自身的数据和状态</li><li>组件内维护自身的事件</li><li>对外提供配置接口，控制展示以及具体功能</li><li>对外提供查询接口，获取组件的状态和数据</li></ul>',18),r=[o];function d(n,c,h,s,u,_){return e(),i("div",null,r)}const b=a(t,[["render",d]]);export{p as __pageData,b as default};
diff --git a/assets/architecture_standard_comp-mod.md.f6f9cedd.lean.js b/assets/architecture_standard_comp-mod.md.e027bdb0.lean.js
similarity index 73%
rename from assets/architecture_standard_comp-mod.md.f6f9cedd.lean.js
rename to assets/architecture_standard_comp-mod.md.e027bdb0.lean.js
index 32a47aa..e4d2671 100644
--- a/assets/architecture_standard_comp-mod.md.f6f9cedd.lean.js
+++ b/assets/architecture_standard_comp-mod.md.e027bdb0.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as i,Q as l}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"组件化与模块化设计","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/comp-mod.md","filePath":"architecture/standard/comp-mod.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/comp-mod.md"},o=l("",18),r=[o];function d(n,c,h,s,u,_){return e(),i("div",null,r)}const b=a(t,[["render",d]]);export{p as __pageData,b as default};
+import{_ as a,o as e,c as i,Q as l}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"组件化与模块化设计","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/comp-mod.md","filePath":"architecture/standard/comp-mod.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/comp-mod.md"},o=l("",18),r=[o];function d(n,c,h,s,u,_){return e(),i("div",null,r)}const b=a(t,[["render",d]]);export{p as __pageData,b as default};
diff --git a/assets/architecture_standard_monitor.md.ff5a8411.js b/assets/architecture_standard_monitor.md.6a6f7341.js
similarity index 96%
rename from assets/architecture_standard_monitor.md.ff5a8411.js
rename to assets/architecture_standard_monitor.md.6a6f7341.js
index 2056146..87b3c4e 100644
--- a/assets/architecture_standard_monitor.md.ff5a8411.js
+++ b/assets/architecture_standard_monitor.md.6a6f7341.js
@@ -1 +1 @@
-import{_ as a,o as e,c as l,Q as i}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"前端监控体系","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/monitor.md","filePath":"architecture/standard/monitor.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/monitor.md"},o=i('<h1 id="前端监控体系" tabindex="-1">前端监控体系 <a class="header-anchor" href="#前端监控体系" aria-label="Permalink to &quot;前端监控体系&quot;">​</a></h1><p>如何搭建一个前端监控体系</p><h2 id="为什么" tabindex="-1">为什么 <a class="header-anchor" href="#为什么" aria-label="Permalink to &quot;为什么&quot;">​</a></h2><ol><li>如何及时发现问题</li><li>如何快速定位并解决问题</li></ol><h2 id="监控内容" tabindex="-1">监控内容 <a class="header-anchor" href="#监控内容" aria-label="Permalink to &quot;监控内容&quot;">​</a></h2><ul><li>页面的整体访问情况，包括常见的 PV（page view）、UV（user view）、用户操作行为</li><li>页面的性能情况，包括页面加载耗时、接口耗时等各项数据统计</li></ul><h2 id="数据埋点与收集" tabindex="-1">数据埋点与收集 <a class="header-anchor" href="#数据埋点与收集" aria-label="Permalink to &quot;数据埋点与收集&quot;">​</a></h2><p>页面访问速度、页面稳定性/异常、外部调用服务情况</p><ol><li>系统的生命周期数据，（页面性能、整体访问）</li><li>HTTP 测试数据（外部服务调用、页面性能优化）</li><li>系统异常（系统稳定性、系统异常）</li><li>用户行为数据（页面稳定性、整体访问）</li><li>用户日志（反馈问题排查）</li></ol><h3 id="系统生命周期" tabindex="-1">系统生命周期 <a class="header-anchor" href="#系统生命周期" aria-label="Permalink to &quot;系统生命周期&quot;">​</a></h3><p><code>PerformanceTiming</code></p><ul><li>navigationstart、unloadEventStart/unloadEventEnd</li><li>domLoading、domInteractive、domContentLoadedEventStart/domContentLoadedEventEnd、loadEventStart/loadEventEnd</li></ul><p><code>document</code> 监听事件</p><ul><li>DOMContentLoaded</li><li>readystatechange</li><li>MutationObserver</li></ul><p><code>框架带有自身的生命周期</code></p><h3 id="系统异常" tabindex="-1">系统异常 <a class="header-anchor" href="#系统异常" aria-label="Permalink to &quot;系统异常&quot;">​</a></h3><ul><li>window.onerror</li><li>document.addEventListener(&#39;error&#39;)</li><li>xhr status</li></ul><h3 id="用户日志" tabindex="-1">用户日志 <a class="header-anchor" href="#用户日志" aria-label="Permalink to &quot;用户日志&quot;">​</a></h3><ul><li>类装饰器</li><li>类方法劫持</li></ul><h3 id="数据上报" tabindex="-1">数据上报 <a class="header-anchor" href="#数据上报" aria-label="Permalink to &quot;数据上报&quot;">​</a></h3><ul><li>定期/定量上报</li><li>关键生命周期上报</li><li>用户主动提交</li></ul><h3 id="数据监控" tabindex="-1">数据监控 <a class="header-anchor" href="#数据监控" aria-label="Permalink to &quot;数据监控&quot;">​</a></h3><ul><li>错误告警是否有新增错误，可通过报错内容找到报错位置修复</li><li>全版本监控观察：整体的功能点覆盖曲线是否正常，已否有异常涨跌</li><li>分版本监控观察：新版本是否所有功都能正常访问、灰度占比是否正常、新旧版本的转化率是否一致</li></ul>',23),r=[o];function n(d,h,c,s,u,m){return e(),l("div",null,r)}const b=a(t,[["render",n]]);export{p as __pageData,b as default};
+import{_ as a,o as e,c as l,Q as i}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"前端监控体系","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/monitor.md","filePath":"architecture/standard/monitor.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/monitor.md"},o=i('<h1 id="前端监控体系" tabindex="-1">前端监控体系 <a class="header-anchor" href="#前端监控体系" aria-label="Permalink to &quot;前端监控体系&quot;">​</a></h1><p>如何搭建一个前端监控体系</p><h2 id="为什么" tabindex="-1">为什么 <a class="header-anchor" href="#为什么" aria-label="Permalink to &quot;为什么&quot;">​</a></h2><ol><li>如何及时发现问题</li><li>如何快速定位并解决问题</li></ol><h2 id="监控内容" tabindex="-1">监控内容 <a class="header-anchor" href="#监控内容" aria-label="Permalink to &quot;监控内容&quot;">​</a></h2><ul><li>页面的整体访问情况，包括常见的 PV（page view）、UV（user view）、用户操作行为</li><li>页面的性能情况，包括页面加载耗时、接口耗时等各项数据统计</li></ul><h2 id="数据埋点与收集" tabindex="-1">数据埋点与收集 <a class="header-anchor" href="#数据埋点与收集" aria-label="Permalink to &quot;数据埋点与收集&quot;">​</a></h2><p>页面访问速度、页面稳定性/异常、外部调用服务情况</p><ol><li>系统的生命周期数据，（页面性能、整体访问）</li><li>HTTP 测试数据（外部服务调用、页面性能优化）</li><li>系统异常（系统稳定性、系统异常）</li><li>用户行为数据（页面稳定性、整体访问）</li><li>用户日志（反馈问题排查）</li></ol><h3 id="系统生命周期" tabindex="-1">系统生命周期 <a class="header-anchor" href="#系统生命周期" aria-label="Permalink to &quot;系统生命周期&quot;">​</a></h3><p><code>PerformanceTiming</code></p><ul><li>navigationstart、unloadEventStart/unloadEventEnd</li><li>domLoading、domInteractive、domContentLoadedEventStart/domContentLoadedEventEnd、loadEventStart/loadEventEnd</li></ul><p><code>document</code> 监听事件</p><ul><li>DOMContentLoaded</li><li>readystatechange</li><li>MutationObserver</li></ul><p><code>框架带有自身的生命周期</code></p><h3 id="系统异常" tabindex="-1">系统异常 <a class="header-anchor" href="#系统异常" aria-label="Permalink to &quot;系统异常&quot;">​</a></h3><ul><li>window.onerror</li><li>document.addEventListener(&#39;error&#39;)</li><li>xhr status</li></ul><h3 id="用户日志" tabindex="-1">用户日志 <a class="header-anchor" href="#用户日志" aria-label="Permalink to &quot;用户日志&quot;">​</a></h3><ul><li>类装饰器</li><li>类方法劫持</li></ul><h3 id="数据上报" tabindex="-1">数据上报 <a class="header-anchor" href="#数据上报" aria-label="Permalink to &quot;数据上报&quot;">​</a></h3><ul><li>定期/定量上报</li><li>关键生命周期上报</li><li>用户主动提交</li></ul><h3 id="数据监控" tabindex="-1">数据监控 <a class="header-anchor" href="#数据监控" aria-label="Permalink to &quot;数据监控&quot;">​</a></h3><ul><li>错误告警是否有新增错误，可通过报错内容找到报错位置修复</li><li>全版本监控观察：整体的功能点覆盖曲线是否正常，已否有异常涨跌</li><li>分版本监控观察：新版本是否所有功都能正常访问、灰度占比是否正常、新旧版本的转化率是否一致</li></ul>',23),r=[o];function n(d,h,c,s,u,m){return e(),l("div",null,r)}const b=a(t,[["render",n]]);export{p as __pageData,b as default};
diff --git a/assets/architecture_standard_monitor.md.ff5a8411.lean.js b/assets/architecture_standard_monitor.md.6a6f7341.lean.js
similarity index 72%
rename from assets/architecture_standard_monitor.md.ff5a8411.lean.js
rename to assets/architecture_standard_monitor.md.6a6f7341.lean.js
index 302d5c2..49ca597 100644
--- a/assets/architecture_standard_monitor.md.ff5a8411.lean.js
+++ b/assets/architecture_standard_monitor.md.6a6f7341.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as l,Q as i}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"前端监控体系","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/monitor.md","filePath":"architecture/standard/monitor.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/monitor.md"},o=i("",23),r=[o];function n(d,h,c,s,u,m){return e(),l("div",null,r)}const b=a(t,[["render",n]]);export{p as __pageData,b as default};
+import{_ as a,o as e,c as l,Q as i}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"前端监控体系","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/monitor.md","filePath":"architecture/standard/monitor.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/monitor.md"},o=i("",23),r=[o];function n(d,h,c,s,u,m){return e(),l("div",null,r)}const b=a(t,[["render",n]]);export{p as __pageData,b as default};
diff --git a/assets/architecture_standard_performance.md.c952558a.js b/assets/architecture_standard_performance.md.5df854dc.js
similarity index 97%
rename from assets/architecture_standard_performance.md.c952558a.js
rename to assets/architecture_standard_performance.md.5df854dc.js
index 0f2532c..bffd105 100644
--- a/assets/architecture_standard_performance.md.c952558a.js
+++ b/assets/architecture_standard_performance.md.5df854dc.js
@@ -1 +1 @@
-import{_ as a,o as l,c as i,Q as e}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"前端性能优化","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/performance.md","filePath":"architecture/standard/performance.md","lastUpdated":1670330848000}'),r={name:"architecture/standard/performance.md"},t=e('<h1 id="前端性能优化" tabindex="-1">前端性能优化 <a class="header-anchor" href="#前端性能优化" aria-label="Permalink to &quot;前端性能优化&quot;">​</a></h1><p>时间和空间</p><div class="warning custom-block"><p class="custom-block-title">性能分析指标</p><p><code>加载耗时、渲染耗时、网络耗时、脚本执行耗时</code> &amp; <code>CPU 占用、资源占用、本地缓存占用</code></p></div><h2 id="时间角度" tabindex="-1">时间角度 <a class="header-anchor" href="#时间角度" aria-label="Permalink to &quot;时间角度&quot;">​</a></h2><p>减少耗时</p><h3 id="网络请求优化" tabindex="-1">网络请求优化 <a class="header-anchor" href="#网络请求优化" aria-label="Permalink to &quot;网络请求优化&quot;">​</a></h3><ul><li>减少 DNS 查询时间，使用浏览器 DNS 缓存、计算机 DNS 缓存、服务器 DNS 缓存</li><li>合理地使用 CDN，有效的减少网络请求耗时</li><li>对请求资源进行缓存（浏览器缓存、HTTP 缓存、后台缓存）Service Worker、PWA 技术</li><li>Tree-shaking 代码分割</li><li>对请求资源进行合理的拆分，减少请求资源的体积</li><li>对资源进行压缩，减少传输数据大小</li><li>使用 HTTP2、HTTP3 提升资源请求速度</li><li>对请求进行优化（多个请求合并，减少通信次数；请求进行域名拆分，提升并发请求数量）</li></ul><h3 id="首屏加载优化" tabindex="-1">首屏加载优化 <a class="header-anchor" href="#首屏加载优化" aria-label="Permalink to &quot;首屏加载优化&quot;">​</a></h3><p>将页面尽快展示给用户看，减少白屏时间</p><ul><li>对页面进行分片/分屏加载，将页面可见/可交互时间提前</li><li>优化资源加载的顺序和粒度，仅加载需要的资源，采用异步加载的方式加载其他资源</li><li>按需加载（差异化服务，读写分离）</li><li>使用服务端渲染，减少页面二次请求和渲染的耗时</li><li>使用秒看技术，通过预览的方式提前给用户观看（图片）</li><li>配合客户端进行资源预请求和预加载（预热 Web 容器）</li><li>配合客户端将资源和数据进行离线，可用于下一次的页面快速渲染</li></ul><h3 id="渲染过程优化" tabindex="-1">渲染过程优化 <a class="header-anchor" href="#渲染过程优化" aria-label="Permalink to &quot;渲染过程优化&quot;">​</a></h3><ul><li>使用资源预加载，空闲时间将用户可能需要用到的资源进行获取并加载</li><li>减少 DOM 数量、减少/合并 DOM 操作，减少浏览器渲染过程中的计算耗时</li><li>通过合理使用浏览器 GPU 进程合成，提升浏览器渲染效率</li><li>使用离屏渲染，在页面不可见的地方进行提前渲染（Canvas 渲染）</li><li>通过将浏览帧率保持在 60FPS，提升页面交互和渲染的流畅度</li></ul><h3 id="计算-逻辑提速" tabindex="-1">计算/逻辑提速 <a class="header-anchor" href="#计算-逻辑提速" aria-label="Permalink to &quot;计算/逻辑提速&quot;">​</a></h3><ul><li>将 JavaScript 大任务拆解 + 并行计算的方式，有效的降低整体计算耗时（Web Worker)</li><li>使用更高运行效率的方式，减少计算耗时（Webassembly）</li><li>将计算过程提前，减少计算等待时长（AOT 技术）</li><li>使用更优的算法或数据结构，提升计算效率（红黑树）</li><li>将结果缓存，减少运行次数</li></ul><h2 id="空间角度" tabindex="-1">空间角度 <a class="header-anchor" href="#空间角度" aria-label="Permalink to &quot;空间角度&quot;">​</a></h2><h3 id="降低资源占用" tabindex="-1">降低资源占用 <a class="header-anchor" href="#降低资源占用" aria-label="Permalink to &quot;降低资源占用&quot;">​</a></h3><ul><li>合理使用缓存，不滥用用户的缓存资源（浏览器缓存，IndexDB）及时进行缓存清理</li><li>通过使用数据结构享元的方式，减少对象的创建，从而减少内存占用</li><li>避免存在内存泄漏（避免全局变量的使用，及时解除引用）</li><li>避免复杂/异常的递归调用，防止栈溢出</li></ul><h2 id="性能数据" tabindex="-1">性能数据 <a class="header-anchor" href="#性能数据" aria-label="Permalink to &quot;性能数据&quot;">​</a></h2><ul><li>网络资源请求时间。</li><li>Time To Start Render(TTSR)：浏览器开始渲染的时间。</li><li>Dom Ready：页面解析完成的时间。</li><li>Time To Interact(TTI))：页面可交互时间。</li><li>Total Blocking Time (TBT)：总阻塞时间，代表页面处于不可交互状态的耗时。</li><li>First Input Delay(FID)：从用户首次交互，到浏览器响应的时间。</li></ul>',19),o=[t];function c(n,d,h,s,u,m){return l(),i("div",null,o)}const T=a(r,[["render",c]]);export{_ as __pageData,T as default};
+import{_ as a,o as l,c as i,Q as e}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"前端性能优化","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/performance.md","filePath":"architecture/standard/performance.md","lastUpdated":1670330848000}'),r={name:"architecture/standard/performance.md"},t=e('<h1 id="前端性能优化" tabindex="-1">前端性能优化 <a class="header-anchor" href="#前端性能优化" aria-label="Permalink to &quot;前端性能优化&quot;">​</a></h1><p>时间和空间</p><div class="warning custom-block"><p class="custom-block-title">性能分析指标</p><p><code>加载耗时、渲染耗时、网络耗时、脚本执行耗时</code> &amp; <code>CPU 占用、资源占用、本地缓存占用</code></p></div><h2 id="时间角度" tabindex="-1">时间角度 <a class="header-anchor" href="#时间角度" aria-label="Permalink to &quot;时间角度&quot;">​</a></h2><p>减少耗时</p><h3 id="网络请求优化" tabindex="-1">网络请求优化 <a class="header-anchor" href="#网络请求优化" aria-label="Permalink to &quot;网络请求优化&quot;">​</a></h3><ul><li>减少 DNS 查询时间，使用浏览器 DNS 缓存、计算机 DNS 缓存、服务器 DNS 缓存</li><li>合理地使用 CDN，有效的减少网络请求耗时</li><li>对请求资源进行缓存（浏览器缓存、HTTP 缓存、后台缓存）Service Worker、PWA 技术</li><li>Tree-shaking 代码分割</li><li>对请求资源进行合理的拆分，减少请求资源的体积</li><li>对资源进行压缩，减少传输数据大小</li><li>使用 HTTP2、HTTP3 提升资源请求速度</li><li>对请求进行优化（多个请求合并，减少通信次数；请求进行域名拆分，提升并发请求数量）</li></ul><h3 id="首屏加载优化" tabindex="-1">首屏加载优化 <a class="header-anchor" href="#首屏加载优化" aria-label="Permalink to &quot;首屏加载优化&quot;">​</a></h3><p>将页面尽快展示给用户看，减少白屏时间</p><ul><li>对页面进行分片/分屏加载，将页面可见/可交互时间提前</li><li>优化资源加载的顺序和粒度，仅加载需要的资源，采用异步加载的方式加载其他资源</li><li>按需加载（差异化服务，读写分离）</li><li>使用服务端渲染，减少页面二次请求和渲染的耗时</li><li>使用秒看技术，通过预览的方式提前给用户观看（图片）</li><li>配合客户端进行资源预请求和预加载（预热 Web 容器）</li><li>配合客户端将资源和数据进行离线，可用于下一次的页面快速渲染</li></ul><h3 id="渲染过程优化" tabindex="-1">渲染过程优化 <a class="header-anchor" href="#渲染过程优化" aria-label="Permalink to &quot;渲染过程优化&quot;">​</a></h3><ul><li>使用资源预加载，空闲时间将用户可能需要用到的资源进行获取并加载</li><li>减少 DOM 数量、减少/合并 DOM 操作，减少浏览器渲染过程中的计算耗时</li><li>通过合理使用浏览器 GPU 进程合成，提升浏览器渲染效率</li><li>使用离屏渲染，在页面不可见的地方进行提前渲染（Canvas 渲染）</li><li>通过将浏览帧率保持在 60FPS，提升页面交互和渲染的流畅度</li></ul><h3 id="计算-逻辑提速" tabindex="-1">计算/逻辑提速 <a class="header-anchor" href="#计算-逻辑提速" aria-label="Permalink to &quot;计算/逻辑提速&quot;">​</a></h3><ul><li>将 JavaScript 大任务拆解 + 并行计算的方式，有效的降低整体计算耗时（Web Worker)</li><li>使用更高运行效率的方式，减少计算耗时（Webassembly）</li><li>将计算过程提前，减少计算等待时长（AOT 技术）</li><li>使用更优的算法或数据结构，提升计算效率（红黑树）</li><li>将结果缓存，减少运行次数</li></ul><h2 id="空间角度" tabindex="-1">空间角度 <a class="header-anchor" href="#空间角度" aria-label="Permalink to &quot;空间角度&quot;">​</a></h2><h3 id="降低资源占用" tabindex="-1">降低资源占用 <a class="header-anchor" href="#降低资源占用" aria-label="Permalink to &quot;降低资源占用&quot;">​</a></h3><ul><li>合理使用缓存，不滥用用户的缓存资源（浏览器缓存，IndexDB）及时进行缓存清理</li><li>通过使用数据结构享元的方式，减少对象的创建，从而减少内存占用</li><li>避免存在内存泄漏（避免全局变量的使用，及时解除引用）</li><li>避免复杂/异常的递归调用，防止栈溢出</li></ul><h2 id="性能数据" tabindex="-1">性能数据 <a class="header-anchor" href="#性能数据" aria-label="Permalink to &quot;性能数据&quot;">​</a></h2><ul><li>网络资源请求时间。</li><li>Time To Start Render(TTSR)：浏览器开始渲染的时间。</li><li>Dom Ready：页面解析完成的时间。</li><li>Time To Interact(TTI))：页面可交互时间。</li><li>Total Blocking Time (TBT)：总阻塞时间，代表页面处于不可交互状态的耗时。</li><li>First Input Delay(FID)：从用户首次交互，到浏览器响应的时间。</li></ul>',19),o=[t];function c(n,d,h,s,u,m){return l(),i("div",null,o)}const T=a(r,[["render",c]]);export{_ as __pageData,T as default};
diff --git a/assets/architecture_standard_performance.md.c952558a.lean.js b/assets/architecture_standard_performance.md.5df854dc.lean.js
similarity index 73%
rename from assets/architecture_standard_performance.md.c952558a.lean.js
rename to assets/architecture_standard_performance.md.5df854dc.lean.js
index d00c868..ffaf79a 100644
--- a/assets/architecture_standard_performance.md.c952558a.lean.js
+++ b/assets/architecture_standard_performance.md.5df854dc.lean.js
@@ -1 +1 @@
-import{_ as a,o as l,c as i,Q as e}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"前端性能优化","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/performance.md","filePath":"architecture/standard/performance.md","lastUpdated":1670330848000}'),r={name:"architecture/standard/performance.md"},t=e("",19),o=[t];function c(n,d,h,s,u,m){return l(),i("div",null,o)}const T=a(r,[["render",c]]);export{_ as __pageData,T as default};
+import{_ as a,o as l,c as i,Q as e}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"前端性能优化","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/performance.md","filePath":"architecture/standard/performance.md","lastUpdated":1670330848000}'),r={name:"architecture/standard/performance.md"},t=e("",19),o=[t];function c(n,d,h,s,u,m){return l(),i("div",null,o)}const T=a(r,[["render",c]]);export{_ as __pageData,T as default};
diff --git a/assets/architecture_standard_project-design.md.1e6aae9a.js b/assets/architecture_standard_project-design.md.491238a5.js
similarity index 97%
rename from assets/architecture_standard_project-design.md.1e6aae9a.js
rename to assets/architecture_standard_project-design.md.491238a5.js
index 89a0249..cf65f0f 100644
--- a/assets/architecture_standard_project-design.md.1e6aae9a.js
+++ b/assets/architecture_standard_project-design.md.491238a5.js
@@ -1 +1 @@
-import{_ as l,o as i,c as a,Q as e}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"项目设计","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/project-design.md","filePath":"architecture/standard/project-design.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/project-design.md"},o=e('<h1 id="项目设计" tabindex="-1">项目设计 <a class="header-anchor" href="#项目设计" aria-label="Permalink to &quot;项目设计&quot;">​</a></h1><p>如何设计一个项目，如何面对项目中的一些痛点？</p><h2 id="技术方案设计与选型" tabindex="-1">技术方案设计与选型 <a class="header-anchor" href="#技术方案设计与选型" aria-label="Permalink to &quot;技术方案设计与选型&quot;">​</a></h2><p>从 0 搭建一个项目</p><ol><li>前端框架与脚手架</li><li>状态管理工具</li><li>路由管理工具</li><li>代码构建与编译工具</li></ol><h3 id="技术选型的影响因素" tabindex="-1">技术选型的影响因素 <a class="header-anchor" href="#技术选型的影响因素" aria-label="Permalink to &quot;技术选型的影响因素&quot;">​</a></h3><ol><li>项目规模、功能交互、面向用户</li><li>多人协作、团队规模</li><li>团队技术栈、新技术的接受程度</li><li>参考现有的技术方案、调整</li></ol><ul><li>前端框架和工具选型</li></ul><ol><li>使用开源/现有框架</li><li>造轮子</li></ol><ul><li>选择适合团队的技术栈</li></ul><ol><li>团队现有的技术栈</li><li>团队成员对现有框架/工具的熟悉程度</li><li>团队成员是否有倾向的框架/工具</li></ol><h3 id="多人协作与团队规范" tabindex="-1">多人协作与团队规范 <a class="header-anchor" href="#多人协作与团队规范" aria-label="Permalink to &quot;多人协作与团队规范&quot;">​</a></h3><ul><li>编码规范</li></ul><p>Eslint、Prettier、Git Commit Hooks</p><ul><li>代码流程规范</li></ul><p>创建分支过程、提交代码过程、分支提交过程、合入主干过程、代码发布过程（CI/CD）</p><h2 id="前端工程化" tabindex="-1">前端工程化 <a class="header-anchor" href="#前端工程化" aria-label="Permalink to &quot;前端工程化&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">前端工程化</p><p>从工程学角度来看，前端工程化致力于提升工程的开发效率、协作效率、项目质量、贯穿项目设计、开发、测试、上线、维护的整个过程。</p></div><p>通过项目设计和架构优化，提升系统质量；通过自动化的方式，将项目研发与发布流程进行优化，提升开发效率</p><h2 id="大型项目痛点" tabindex="-1">大型项目痛点 <a class="header-anchor" href="#大型项目痛点" aria-label="Permalink to &quot;大型项目痛点&quot;">​</a></h2><p>前端团队人数 10+、模块数量 30+、代码量 30w+</p><h3 id="模块耦合严重" tabindex="-1">模块耦合严重 <a class="header-anchor" href="#模块耦合严重" aria-label="Permalink to &quot;模块耦合严重&quot;">​</a></h3><ol><li>项目规模调整后，对现有架构设计进行分析，不合适进行及时的设计调整与优化</li><li>使用模块解耦的技术方案，将各个模块统一交由框架处理</li><li>梳理各个模块的职责，明确每个模块负责的工作和提供的功能，确定各个模块间的边界和调用方式</li></ol><p><code>避免耦合</code></p><ul><li>依赖倒置</li><li>事件通信（Event/Emitter)</li></ul><h3 id="项目复杂熟悉成本过高" tabindex="-1">项目复杂熟悉成本过高 <a class="header-anchor" href="#项目复杂熟悉成本过高" aria-label="Permalink to &quot;项目复杂熟悉成本过高&quot;">​</a></h3><ol><li>每个开发者都认领（或分配）一个或多个模块，并要求掌握熟悉模块的细节，并维护文档</li><li>需求开发、bug 修复、技术优化，找对应的模块负责人进行风险评估以及代码 review</li><li>模块的负责人负责自身模块的技术优化方案，性能优化、自动化测试、代码规范调整</li><li>对于核心复杂模块，可由多个负责人共同维护，协商技术细节</li></ol><h3 id="项目代码量过大" tabindex="-1">项目代码量过大 <a class="header-anchor" href="#项目代码量过大" aria-label="Permalink to &quot;项目代码量过大&quot;">​</a></h3><ul><li>拆：拆模块、拆公共库、拆组件库</li><li>分：分流程、分步骤</li></ul><ol><li>代码按需引入，移除不必要的代码（Tree-shaking）</li><li>异步加载模块</li><li>加载流程优化，分析首屏</li><li>差异化服务，不同场景只加载所需要的模块内容（读写分离）</li><li>代码复用，封装</li></ol><p><code>项目管理</code></p><ul><li>multirepo 多包管理，体积代码量小，构建可选（缺点：问题定位困难，模块变动其他模块配置都需更新）</li><li>monorepo 单包管理，配合 lerna，方便调试以及修复（缺点：体积大，代码可维护性、可测试性要求高，版本控制以及 Git 工作流要求高）</li></ul><h3 id="问题定位效率低" tabindex="-1">问题定位效率低 <a class="header-anchor" href="#问题定位效率低" aria-label="Permalink to &quot;问题定位效率低&quot;">​</a></h3><ol><li>模块负责人对自身模块执行的关键点进行标记，在开发+调试模式下，其他开发可通过开启断点方式来直接定位问题</li><li>查看调用栈自行分析</li></ol><h2 id="项目前期准备与复盘" tabindex="-1">项目前期准备与复盘 <a class="header-anchor" href="#项目前期准备与复盘" aria-label="Permalink to &quot;项目前期准备与复盘&quot;">​</a></h2><p>前期准备</p><ul><li>预期功能</li><li>预计工作量和分工排期</li><li>每个阶段（开发、联调、产品体验、提测、发布）的时间点</li><li>延期风险（交互、设计、接口协议）</li></ul><p>复盘</p><ul><li>时间维度</li><li>质量维度</li></ul>',39),r=[o];function h(d,n,c,s,u,p){return i(),a("div",null,r)}const b=l(t,[["render",h]]);export{_ as __pageData,b as default};
+import{_ as l,o as i,c as a,Q as e}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"项目设计","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/project-design.md","filePath":"architecture/standard/project-design.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/project-design.md"},o=e('<h1 id="项目设计" tabindex="-1">项目设计 <a class="header-anchor" href="#项目设计" aria-label="Permalink to &quot;项目设计&quot;">​</a></h1><p>如何设计一个项目，如何面对项目中的一些痛点？</p><h2 id="技术方案设计与选型" tabindex="-1">技术方案设计与选型 <a class="header-anchor" href="#技术方案设计与选型" aria-label="Permalink to &quot;技术方案设计与选型&quot;">​</a></h2><p>从 0 搭建一个项目</p><ol><li>前端框架与脚手架</li><li>状态管理工具</li><li>路由管理工具</li><li>代码构建与编译工具</li></ol><h3 id="技术选型的影响因素" tabindex="-1">技术选型的影响因素 <a class="header-anchor" href="#技术选型的影响因素" aria-label="Permalink to &quot;技术选型的影响因素&quot;">​</a></h3><ol><li>项目规模、功能交互、面向用户</li><li>多人协作、团队规模</li><li>团队技术栈、新技术的接受程度</li><li>参考现有的技术方案、调整</li></ol><ul><li>前端框架和工具选型</li></ul><ol><li>使用开源/现有框架</li><li>造轮子</li></ol><ul><li>选择适合团队的技术栈</li></ul><ol><li>团队现有的技术栈</li><li>团队成员对现有框架/工具的熟悉程度</li><li>团队成员是否有倾向的框架/工具</li></ol><h3 id="多人协作与团队规范" tabindex="-1">多人协作与团队规范 <a class="header-anchor" href="#多人协作与团队规范" aria-label="Permalink to &quot;多人协作与团队规范&quot;">​</a></h3><ul><li>编码规范</li></ul><p>Eslint、Prettier、Git Commit Hooks</p><ul><li>代码流程规范</li></ul><p>创建分支过程、提交代码过程、分支提交过程、合入主干过程、代码发布过程（CI/CD）</p><h2 id="前端工程化" tabindex="-1">前端工程化 <a class="header-anchor" href="#前端工程化" aria-label="Permalink to &quot;前端工程化&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">前端工程化</p><p>从工程学角度来看，前端工程化致力于提升工程的开发效率、协作效率、项目质量、贯穿项目设计、开发、测试、上线、维护的整个过程。</p></div><p>通过项目设计和架构优化，提升系统质量；通过自动化的方式，将项目研发与发布流程进行优化，提升开发效率</p><h2 id="大型项目痛点" tabindex="-1">大型项目痛点 <a class="header-anchor" href="#大型项目痛点" aria-label="Permalink to &quot;大型项目痛点&quot;">​</a></h2><p>前端团队人数 10+、模块数量 30+、代码量 30w+</p><h3 id="模块耦合严重" tabindex="-1">模块耦合严重 <a class="header-anchor" href="#模块耦合严重" aria-label="Permalink to &quot;模块耦合严重&quot;">​</a></h3><ol><li>项目规模调整后，对现有架构设计进行分析，不合适进行及时的设计调整与优化</li><li>使用模块解耦的技术方案，将各个模块统一交由框架处理</li><li>梳理各个模块的职责，明确每个模块负责的工作和提供的功能，确定各个模块间的边界和调用方式</li></ol><p><code>避免耦合</code></p><ul><li>依赖倒置</li><li>事件通信（Event/Emitter)</li></ul><h3 id="项目复杂熟悉成本过高" tabindex="-1">项目复杂熟悉成本过高 <a class="header-anchor" href="#项目复杂熟悉成本过高" aria-label="Permalink to &quot;项目复杂熟悉成本过高&quot;">​</a></h3><ol><li>每个开发者都认领（或分配）一个或多个模块，并要求掌握熟悉模块的细节，并维护文档</li><li>需求开发、bug 修复、技术优化，找对应的模块负责人进行风险评估以及代码 review</li><li>模块的负责人负责自身模块的技术优化方案，性能优化、自动化测试、代码规范调整</li><li>对于核心复杂模块，可由多个负责人共同维护，协商技术细节</li></ol><h3 id="项目代码量过大" tabindex="-1">项目代码量过大 <a class="header-anchor" href="#项目代码量过大" aria-label="Permalink to &quot;项目代码量过大&quot;">​</a></h3><ul><li>拆：拆模块、拆公共库、拆组件库</li><li>分：分流程、分步骤</li></ul><ol><li>代码按需引入，移除不必要的代码（Tree-shaking）</li><li>异步加载模块</li><li>加载流程优化，分析首屏</li><li>差异化服务，不同场景只加载所需要的模块内容（读写分离）</li><li>代码复用，封装</li></ol><p><code>项目管理</code></p><ul><li>multirepo 多包管理，体积代码量小，构建可选（缺点：问题定位困难，模块变动其他模块配置都需更新）</li><li>monorepo 单包管理，配合 lerna，方便调试以及修复（缺点：体积大，代码可维护性、可测试性要求高，版本控制以及 Git 工作流要求高）</li></ul><h3 id="问题定位效率低" tabindex="-1">问题定位效率低 <a class="header-anchor" href="#问题定位效率低" aria-label="Permalink to &quot;问题定位效率低&quot;">​</a></h3><ol><li>模块负责人对自身模块执行的关键点进行标记，在开发+调试模式下，其他开发可通过开启断点方式来直接定位问题</li><li>查看调用栈自行分析</li></ol><h2 id="项目前期准备与复盘" tabindex="-1">项目前期准备与复盘 <a class="header-anchor" href="#项目前期准备与复盘" aria-label="Permalink to &quot;项目前期准备与复盘&quot;">​</a></h2><p>前期准备</p><ul><li>预期功能</li><li>预计工作量和分工排期</li><li>每个阶段（开发、联调、产品体验、提测、发布）的时间点</li><li>延期风险（交互、设计、接口协议）</li></ul><p>复盘</p><ul><li>时间维度</li><li>质量维度</li></ul>',39),r=[o];function h(d,n,c,s,u,p){return i(),a("div",null,r)}const b=l(t,[["render",h]]);export{_ as __pageData,b as default};
diff --git a/assets/architecture_standard_project-design.md.1e6aae9a.lean.js b/assets/architecture_standard_project-design.md.491238a5.lean.js
similarity index 73%
rename from assets/architecture_standard_project-design.md.1e6aae9a.lean.js
rename to assets/architecture_standard_project-design.md.491238a5.lean.js
index db011ac..986f44c 100644
--- a/assets/architecture_standard_project-design.md.1e6aae9a.lean.js
+++ b/assets/architecture_standard_project-design.md.491238a5.lean.js
@@ -1 +1 @@
-import{_ as l,o as i,c as a,Q as e}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"项目设计","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/project-design.md","filePath":"architecture/standard/project-design.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/project-design.md"},o=e("",39),r=[o];function h(d,n,c,s,u,p){return i(),a("div",null,r)}const b=l(t,[["render",h]]);export{_ as __pageData,b as default};
+import{_ as l,o as i,c as a,Q as e}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"项目设计","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/standard/project-design.md","filePath":"architecture/standard/project-design.md","lastUpdated":1670330848000}'),t={name:"architecture/standard/project-design.md"},o=e("",39),r=[o];function h(d,n,c,s,u,p){return i(),a("div",null,r)}const b=l(t,[["render",h]]);export{_ as __pageData,b as default};
diff --git a/assets/architecture_websecure_xss.md.63b7ea5b.js b/assets/architecture_websecure_xss.md.b68d323d.js
similarity index 90%
rename from assets/architecture_websecure_xss.md.63b7ea5b.js
rename to assets/architecture_websecure_xss.md.b68d323d.js
index d6510af..9c0d948 100644
--- a/assets/architecture_websecure_xss.md.63b7ea5b.js
+++ b/assets/architecture_websecure_xss.md.b68d323d.js
@@ -1 +1 @@
-import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"XSS","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/websecure/xss.md","filePath":"architecture/websecure/xss.md","lastUpdated":1670330848000}'),s={name:"architecture/websecure/xss.md"},o=r('<h1 id="xss" tabindex="-1">XSS <a class="header-anchor" href="#xss" aria-label="Permalink to &quot;XSS&quot;">​</a></h1><p>跨站脚本攻击（Cross Site Scripting）</p><h2 id="类型" tabindex="-1">类型 <a class="header-anchor" href="#类型" aria-label="Permalink to &quot;类型&quot;">​</a></h2><p>三种类型</p><h3 id="反射型" tabindex="-1">反射型 <a class="header-anchor" href="#反射型" aria-label="Permalink to &quot;反射型&quot;">​</a></h3><ul><li>一次性</li></ul><h3 id="存储型" tabindex="-1">存储型 <a class="header-anchor" href="#存储型" aria-label="Permalink to &quot;存储型&quot;">​</a></h3><ul><li>存储在服务器</li></ul><h3 id="dom-跨站" tabindex="-1">DOM 跨站 <a class="header-anchor" href="#dom-跨站" aria-label="Permalink to &quot;DOM 跨站&quot;">​</a></h3><p>DOM XSS（document object model 文档对象模型）</p>',10),i=[o];function c(l,n,d,h,_,u){return a(),t("div",null,i)}const S=e(s,[["render",c]]);export{m as __pageData,S as default};
+import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"XSS","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/websecure/xss.md","filePath":"architecture/websecure/xss.md","lastUpdated":1670330848000}'),s={name:"architecture/websecure/xss.md"},o=r('<h1 id="xss" tabindex="-1">XSS <a class="header-anchor" href="#xss" aria-label="Permalink to &quot;XSS&quot;">​</a></h1><p>跨站脚本攻击（Cross Site Scripting）</p><h2 id="类型" tabindex="-1">类型 <a class="header-anchor" href="#类型" aria-label="Permalink to &quot;类型&quot;">​</a></h2><p>三种类型</p><h3 id="反射型" tabindex="-1">反射型 <a class="header-anchor" href="#反射型" aria-label="Permalink to &quot;反射型&quot;">​</a></h3><ul><li>一次性</li></ul><h3 id="存储型" tabindex="-1">存储型 <a class="header-anchor" href="#存储型" aria-label="Permalink to &quot;存储型&quot;">​</a></h3><ul><li>存储在服务器</li></ul><h3 id="dom-跨站" tabindex="-1">DOM 跨站 <a class="header-anchor" href="#dom-跨站" aria-label="Permalink to &quot;DOM 跨站&quot;">​</a></h3><p>DOM XSS（document object model 文档对象模型）</p>',10),i=[o];function c(l,n,d,h,_,u){return a(),t("div",null,i)}const S=e(s,[["render",c]]);export{m as __pageData,S as default};
diff --git a/assets/architecture_websecure_xss.md.63b7ea5b.lean.js b/assets/architecture_websecure_xss.md.b68d323d.lean.js
similarity index 71%
rename from assets/architecture_websecure_xss.md.63b7ea5b.lean.js
rename to assets/architecture_websecure_xss.md.b68d323d.lean.js
index ae5473c..1db20c1 100644
--- a/assets/architecture_websecure_xss.md.63b7ea5b.lean.js
+++ b/assets/architecture_websecure_xss.md.b68d323d.lean.js
@@ -1 +1 @@
-import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"XSS","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/websecure/xss.md","filePath":"architecture/websecure/xss.md","lastUpdated":1670330848000}'),s={name:"architecture/websecure/xss.md"},o=r("",10),i=[o];function c(l,n,d,h,_,u){return a(),t("div",null,i)}const S=e(s,[["render",c]]);export{m as __pageData,S as default};
+import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"XSS","description":"","frontmatter":{},"headers":[],"relativePath":"architecture/websecure/xss.md","filePath":"architecture/websecure/xss.md","lastUpdated":1670330848000}'),s={name:"architecture/websecure/xss.md"},o=r("",10),i=[o];function c(l,n,d,h,_,u){return a(),t("div",null,i)}const S=e(s,[["render",c]]);export{m as __pageData,S as default};
diff --git a/assets/articles_advanced_debounce.md.5bbfcaa3.js b/assets/articles_advanced_debounce.md.c37622c0.js
similarity index 99%
rename from assets/articles_advanced_debounce.md.5bbfcaa3.js
rename to assets/articles_advanced_debounce.md.c37622c0.js
index feeef9a..3af795d 100644
--- a/assets/articles_advanced_debounce.md.5bbfcaa3.js
+++ b/assets/articles_advanced_debounce.md.c37622c0.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"防抖节流","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/debounce.md","filePath":"articles/advanced/debounce.md","lastUpdated":1698285484000}'),p={name:"articles/advanced/debounce.md"},o=l(`<h1 id="防抖节流" tabindex="-1">防抖节流 <a class="header-anchor" href="#防抖节流" aria-label="Permalink to &quot;防抖节流&quot;">​</a></h1><p>结合 lodash 的防抖节流，实现多种完整版的防抖节流。</p><h2 id="防抖" tabindex="-1">防抖 <a class="header-anchor" href="#防抖" aria-label="Permalink to &quot;防抖&quot;">​</a></h2><p>你知道的防抖是怎样呢？</p><h3 id="正常防抖" tabindex="-1">正常防抖 <a class="header-anchor" href="#正常防抖" aria-label="Permalink to &quot;正常防抖&quot;">​</a></h3><blockquote><p>每次输入完毕，两秒之后执行</p></blockquote><h4 id="代码实现" tabindex="-1">代码实现 <a class="header-anchor" href="#代码实现" aria-label="Permalink to &quot;代码实现&quot;">​</a></h4><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">debounce</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">fn</span><span style="color:#E1E4E8;">, </span><span style="color:#FFAB70;">delay</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">2000</span><span style="color:#E1E4E8;">) {</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"防抖节流","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/debounce.md","filePath":"articles/advanced/debounce.md","lastUpdated":1698285484000}'),p={name:"articles/advanced/debounce.md"},o=l(`<h1 id="防抖节流" tabindex="-1">防抖节流 <a class="header-anchor" href="#防抖节流" aria-label="Permalink to &quot;防抖节流&quot;">​</a></h1><p>结合 lodash 的防抖节流，实现多种完整版的防抖节流。</p><h2 id="防抖" tabindex="-1">防抖 <a class="header-anchor" href="#防抖" aria-label="Permalink to &quot;防抖&quot;">​</a></h2><p>你知道的防抖是怎样呢？</p><h3 id="正常防抖" tabindex="-1">正常防抖 <a class="header-anchor" href="#正常防抖" aria-label="Permalink to &quot;正常防抖&quot;">​</a></h3><blockquote><p>每次输入完毕，两秒之后执行</p></blockquote><h4 id="代码实现" tabindex="-1">代码实现 <a class="header-anchor" href="#代码实现" aria-label="Permalink to &quot;代码实现&quot;">​</a></h4><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">debounce</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">fn</span><span style="color:#E1E4E8;">, </span><span style="color:#FFAB70;">delay</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">2000</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> timerId </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">null</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">return</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> (</span><span style="color:#F97583;">...</span><span style="color:#FFAB70;">args</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#F97583;">if</span><span style="color:#E1E4E8;"> (timerId) </span><span style="color:#B392F0;">clearTimeout</span><span style="color:#E1E4E8;">(timerId);</span></span>
diff --git a/assets/articles_advanced_debounce.md.5bbfcaa3.lean.js b/assets/articles_advanced_debounce.md.c37622c0.lean.js
similarity index 72%
rename from assets/articles_advanced_debounce.md.5bbfcaa3.lean.js
rename to assets/articles_advanced_debounce.md.c37622c0.lean.js
index f440d08..fffe479 100644
--- a/assets/articles_advanced_debounce.md.5bbfcaa3.lean.js
+++ b/assets/articles_advanced_debounce.md.c37622c0.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"防抖节流","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/debounce.md","filePath":"articles/advanced/debounce.md","lastUpdated":1698285484000}'),p={name:"articles/advanced/debounce.md"},o=l("",58),e=[o];function t(c,r,E,y,i,F){return n(),a("div",null,e)}const m=s(p,[["render",t]]);export{u as __pageData,m as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"防抖节流","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/debounce.md","filePath":"articles/advanced/debounce.md","lastUpdated":1698285484000}'),p={name:"articles/advanced/debounce.md"},o=l("",58),e=[o];function t(c,r,E,y,i,F){return n(),a("div",null,e)}const m=s(p,[["render",t]]);export{u as __pageData,m as default};
diff --git a/assets/articles_advanced_devServer.md.7df25eb4.js b/assets/articles_advanced_devServer.md.adf19849.js
similarity index 99%
rename from assets/articles_advanced_devServer.md.7df25eb4.js
rename to assets/articles_advanced_devServer.md.adf19849.js
index 42eeae6..7758ed2 100644
--- a/assets/articles_advanced_devServer.md.7df25eb4.js
+++ b/assets/articles_advanced_devServer.md.adf19849.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"实现一个简易热更新","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/devServer.md","filePath":"articles/advanced/devServer.md","lastUpdated":1670330848000}'),p={name:"articles/advanced/devServer.md"},e=l(`<h1 id="实现一个简易热更新" tabindex="-1">实现一个简易热更新 <a class="header-anchor" href="#实现一个简易热更新" aria-label="Permalink to &quot;实现一个简易热更新&quot;">​</a></h1><p>使用 Webpack + Nodejs(Express) 实现热更新</p><p><a href="https://github.com/LIUeng/webpack-server" target="_blank" rel="noreferrer">项目地址</a></p><h2 id="实现思考" tabindex="-1">实现思考？ <a class="header-anchor" href="#实现思考" aria-label="Permalink to &quot;实现思考？&quot;">​</a></h2><p>保存代码，webpack 监听编译代码，编译完成，通知浏览器更新页面（抛出想法，解决问题）</p><h3 id="思考一" tabindex="-1">思考一 <a class="header-anchor" href="#思考一" aria-label="Permalink to &quot;思考一&quot;">​</a></h3><p><em><strong>项目利用 Nodejs(Http) + Express 启动一个端口服务作为服务端</strong></em></p><h4 id="解答" tabindex="-1"><code>解答</code> <a class="header-anchor" href="#解答" aria-label="Permalink to &quot;\`解答\`&quot;">​</a></h4><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"实现一个简易热更新","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/devServer.md","filePath":"articles/advanced/devServer.md","lastUpdated":1670330848000}'),p={name:"articles/advanced/devServer.md"},e=l(`<h1 id="实现一个简易热更新" tabindex="-1">实现一个简易热更新 <a class="header-anchor" href="#实现一个简易热更新" aria-label="Permalink to &quot;实现一个简易热更新&quot;">​</a></h1><p>使用 Webpack + Nodejs(Express) 实现热更新</p><p><a href="https://github.com/LIUeng/webpack-server" target="_blank" rel="noreferrer">项目地址</a></p><h2 id="实现思考" tabindex="-1">实现思考？ <a class="header-anchor" href="#实现思考" aria-label="Permalink to &quot;实现思考？&quot;">​</a></h2><p>保存代码，webpack 监听编译代码，编译完成，通知浏览器更新页面（抛出想法，解决问题）</p><h3 id="思考一" tabindex="-1">思考一 <a class="header-anchor" href="#思考一" aria-label="Permalink to &quot;思考一&quot;">​</a></h3><p><em><strong>项目利用 Nodejs(Http) + Express 启动一个端口服务作为服务端</strong></em></p><h4 id="解答" tabindex="-1"><code>解答</code> <a class="header-anchor" href="#解答" aria-label="Permalink to &quot;\`解答\`&quot;">​</a></h4><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"></span>
 <span class="line"><span style="color:#6A737D;">// 项目目录 servers/Server.js</span></span>
 <span class="line"><span style="color:#6A737D;">// 启动端口</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> app </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">express</span><span style="color:#E1E4E8;">();</span></span>
diff --git a/assets/articles_advanced_devServer.md.7df25eb4.lean.js b/assets/articles_advanced_devServer.md.adf19849.lean.js
similarity index 73%
rename from assets/articles_advanced_devServer.md.7df25eb4.lean.js
rename to assets/articles_advanced_devServer.md.adf19849.lean.js
index 5b83bdf..8e00541 100644
--- a/assets/articles_advanced_devServer.md.7df25eb4.lean.js
+++ b/assets/articles_advanced_devServer.md.adf19849.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"实现一个简易热更新","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/devServer.md","filePath":"articles/advanced/devServer.md","lastUpdated":1670330848000}'),p={name:"articles/advanced/devServer.md"},e=l("",28),o=[e];function t(c,r,i,y,E,d){return a(),n("div",null,o)}const v=s(p,[["render",t]]);export{u as __pageData,v as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"实现一个简易热更新","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/devServer.md","filePath":"articles/advanced/devServer.md","lastUpdated":1670330848000}'),p={name:"articles/advanced/devServer.md"},e=l("",28),o=[e];function t(c,r,i,y,E,d){return a(),n("div",null,o)}const v=s(p,[["render",t]]);export{u as __pageData,v as default};
diff --git a/assets/articles_advanced_docs.md.74a9328e.js b/assets/articles_advanced_docs.md.501fd43f.js
similarity index 99%
rename from assets/articles_advanced_docs.md.74a9328e.js
rename to assets/articles_advanced_docs.md.501fd43f.js
index e65a9f0..bd5e4d4 100644
--- a/assets/articles_advanced_docs.md.74a9328e.js
+++ b/assets/articles_advanced_docs.md.501fd43f.js
@@ -1,4 +1,4 @@
-import{_ as a,o as t,c as l,Q as s}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"前端文档","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/docs.md","filePath":"articles/advanced/docs.md","lastUpdated":1670330848000}'),n={name:"articles/advanced/docs.md"},e=s(`<h1 id="前端文档" tabindex="-1">前端文档 <a class="header-anchor" href="#前端文档" aria-label="Permalink to &quot;前端文档&quot;">​</a></h1><blockquote><p>以下图片失效，有兴趣打开原文阅读</p></blockquote><p><a href="https://juejin.cn/post/6844904192792870919" target="_blank" rel="noreferrer">原文阅读</a></p><ul><li>文档桌面应用客户端 ------ word excel ppt wps ···</li><li>在线文档(类似) ------ <a href="https://docs.google.com" target="_blank" rel="noreferrer">google 文档</a></li></ul><h2 id="前端文档浅思考" tabindex="-1">前端文档浅思考 <a class="header-anchor" href="#前端文档浅思考" aria-label="Permalink to &quot;前端文档浅思考&quot;">​</a></h2><p><strong>如果你去开发你会怎么做</strong></p><ul><li>input?</li><li>textarea?</li><li>div?contenteditable?(富文本可编辑属性)</li></ul><h3 id="富文本编辑" tabindex="-1">富文本编辑 <a class="header-anchor" href="#富文本编辑" aria-label="Permalink to &quot;富文本编辑&quot;">​</a></h3><p>以下 API 来自[JavaScript 高级程序设计第三版]</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 文档执行预定义命令，接收三个参数</span></span>
+import{_ as a,o as t,c as l,Q as s}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"前端文档","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/docs.md","filePath":"articles/advanced/docs.md","lastUpdated":1670330848000}'),n={name:"articles/advanced/docs.md"},e=s(`<h1 id="前端文档" tabindex="-1">前端文档 <a class="header-anchor" href="#前端文档" aria-label="Permalink to &quot;前端文档&quot;">​</a></h1><blockquote><p>以下图片失效，有兴趣打开原文阅读</p></blockquote><p><a href="https://juejin.cn/post/6844904192792870919" target="_blank" rel="noreferrer">原文阅读</a></p><ul><li>文档桌面应用客户端 ------ word excel ppt wps ···</li><li>在线文档(类似) ------ <a href="https://docs.google.com" target="_blank" rel="noreferrer">google 文档</a></li></ul><h2 id="前端文档浅思考" tabindex="-1">前端文档浅思考 <a class="header-anchor" href="#前端文档浅思考" aria-label="Permalink to &quot;前端文档浅思考&quot;">​</a></h2><p><strong>如果你去开发你会怎么做</strong></p><ul><li>input?</li><li>textarea?</li><li>div?contenteditable?(富文本可编辑属性)</li></ul><h3 id="富文本编辑" tabindex="-1">富文本编辑 <a class="header-anchor" href="#富文本编辑" aria-label="Permalink to &quot;富文本编辑&quot;">​</a></h3><p>以下 API 来自[JavaScript 高级程序设计第三版]</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 文档执行预定义命令，接收三个参数</span></span>
 <span class="line"><span style="color:#6A737D;">// 1. 要执行的命令名称</span></span>
 <span class="line"><span style="color:#6A737D;">// 2. 浏览器是否应该为当前的命令用户界面提供一个布尔值（兼容性，始终为false)</span></span>
 <span class="line"><span style="color:#6A737D;">// 3. 执行命令必须的一个值(无 =&gt; null)</span></span>
diff --git a/assets/articles_advanced_docs.md.74a9328e.lean.js b/assets/articles_advanced_docs.md.501fd43f.lean.js
similarity index 71%
rename from assets/articles_advanced_docs.md.74a9328e.lean.js
rename to assets/articles_advanced_docs.md.501fd43f.lean.js
index 4279258..34f4bba 100644
--- a/assets/articles_advanced_docs.md.74a9328e.lean.js
+++ b/assets/articles_advanced_docs.md.501fd43f.lean.js
@@ -1 +1 @@
-import{_ as a,o as t,c as l,Q as s}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"前端文档","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/docs.md","filePath":"articles/advanced/docs.md","lastUpdated":1670330848000}'),n={name:"articles/advanced/docs.md"},e=s("",50),o=[e];function r(p,d,c,i,u,h){return t(),l("div",null,o)}const b=a(n,[["render",r]]);export{E as __pageData,b as default};
+import{_ as a,o as t,c as l,Q as s}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"前端文档","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/docs.md","filePath":"articles/advanced/docs.md","lastUpdated":1670330848000}'),n={name:"articles/advanced/docs.md"},e=s("",50),o=[e];function r(p,d,c,i,u,h){return t(),l("div",null,o)}const b=a(n,[["render",r]]);export{E as __pageData,b as default};
diff --git a/assets/articles_advanced_htmlWebpackPlugin.md.4a93efb9.js b/assets/articles_advanced_htmlWebpackPlugin.md.b19e7406.js
similarity index 99%
rename from assets/articles_advanced_htmlWebpackPlugin.md.4a93efb9.js
rename to assets/articles_advanced_htmlWebpackPlugin.md.b19e7406.js
index d30e6b5..23b52b9 100644
--- a/assets/articles_advanced_htmlWebpackPlugin.md.4a93efb9.js
+++ b/assets/articles_advanced_htmlWebpackPlugin.md.b19e7406.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"HtmlWepbackPlugin 源码分析","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/htmlWebpackPlugin.md","filePath":"articles/advanced/htmlWebpackPlugin.md","lastUpdated":1670330848000}'),p={name:"articles/advanced/htmlWebpackPlugin.md"},o=l(`<h1 id="htmlwepbackplugin-源码分析" tabindex="-1">HtmlWepbackPlugin 源码分析 <a class="header-anchor" href="#htmlwepbackplugin-源码分析" aria-label="Permalink to &quot;HtmlWepbackPlugin 源码分析&quot;">​</a></h1><p><strong>注：本文中 HWP 即 html-webpack-plugin 缩写</strong></p><p><code>html-webpack-plugin插件实现代码还是挺复杂的，需要与webpack源码配合起来，有兴趣可以查看webpack源码</code></p><hr><h2 id="简易的写一个-hwp-插件" tabindex="-1">简易的写一个 HWP 插件 <a class="header-anchor" href="#简易的写一个-hwp-插件" aria-label="Permalink to &quot;简易的写一个 HWP 插件&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">/**</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"HtmlWepbackPlugin 源码分析","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/htmlWebpackPlugin.md","filePath":"articles/advanced/htmlWebpackPlugin.md","lastUpdated":1670330848000}'),p={name:"articles/advanced/htmlWebpackPlugin.md"},o=l(`<h1 id="htmlwepbackplugin-源码分析" tabindex="-1">HtmlWepbackPlugin 源码分析 <a class="header-anchor" href="#htmlwepbackplugin-源码分析" aria-label="Permalink to &quot;HtmlWepbackPlugin 源码分析&quot;">​</a></h1><p><strong>注：本文中 HWP 即 html-webpack-plugin 缩写</strong></p><p><code>html-webpack-plugin插件实现代码还是挺复杂的，需要与webpack源码配合起来，有兴趣可以查看webpack源码</code></p><hr><h2 id="简易的写一个-hwp-插件" tabindex="-1">简易的写一个 HWP 插件 <a class="header-anchor" href="#简易的写一个-hwp-插件" aria-label="Permalink to &quot;简易的写一个 HWP 插件&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">/**</span></span>
 <span class="line"><span style="color:#6A737D;"> * 关于如何把webpack的输出文件注入到模板文件当中</span></span>
 <span class="line"><span style="color:#6A737D;"> * 自己注入标签，无任何副作用，自由实现</span></span>
 <span class="line"><span style="color:#6A737D;"> */</span></span>
diff --git a/assets/articles_advanced_htmlWebpackPlugin.md.4a93efb9.lean.js b/assets/articles_advanced_htmlWebpackPlugin.md.b19e7406.lean.js
similarity index 74%
rename from assets/articles_advanced_htmlWebpackPlugin.md.4a93efb9.lean.js
rename to assets/articles_advanced_htmlWebpackPlugin.md.b19e7406.lean.js
index 48432bb..39a1d91 100644
--- a/assets/articles_advanced_htmlWebpackPlugin.md.4a93efb9.lean.js
+++ b/assets/articles_advanced_htmlWebpackPlugin.md.b19e7406.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"HtmlWepbackPlugin 源码分析","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/htmlWebpackPlugin.md","filePath":"articles/advanced/htmlWebpackPlugin.md","lastUpdated":1670330848000}'),p={name:"articles/advanced/htmlWebpackPlugin.md"},o=l("",58),e=[o];function t(c,r,E,y,i,F){return n(),a("div",null,e)}const h=s(p,[["render",t]]);export{m as __pageData,h as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"HtmlWepbackPlugin 源码分析","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/htmlWebpackPlugin.md","filePath":"articles/advanced/htmlWebpackPlugin.md","lastUpdated":1670330848000}'),p={name:"articles/advanced/htmlWebpackPlugin.md"},o=l("",58),e=[o];function t(c,r,E,y,i,F){return n(),a("div",null,e)}const h=s(p,[["render",t]]);export{m as __pageData,h as default};
diff --git a/assets/articles_advanced_knowledge.js.md.4f4856e0.js b/assets/articles_advanced_knowledge.js.md.8a7fac43.js
similarity index 96%
rename from assets/articles_advanced_knowledge.js.md.4f4856e0.js
rename to assets/articles_advanced_knowledge.js.md.8a7fac43.js
index de31574..f20ed23 100644
--- a/assets/articles_advanced_knowledge.js.md.4f4856e0.js
+++ b/assets/articles_advanced_knowledge.js.md.8a7fac43.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as e}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"你不知道的 JS","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/knowledge.js.md","filePath":"articles/advanced/knowledge.js.md","lastUpdated":1670330848000}'),l={name:"articles/advanced/knowledge.js.md"},p=e(`<h1 id="你不知道的-js" tabindex="-1">你不知道的 JS <a class="header-anchor" href="#你不知道的-js" aria-label="Permalink to &quot;你不知道的 JS&quot;">​</a></h1><h2 id="matchmedia" tabindex="-1">matchMedia <a class="header-anchor" href="#matchmedia" aria-label="Permalink to &quot;matchMedia&quot;">​</a></h2><ul><li>匹配媒体属性相关的信息</li></ul><blockquote><p>比如</p></blockquote><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 获取系统主题</span></span>
+import{_ as s,o as a,c as n,Q as e}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"你不知道的 JS","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/knowledge.js.md","filePath":"articles/advanced/knowledge.js.md","lastUpdated":1670330848000}'),l={name:"articles/advanced/knowledge.js.md"},p=e(`<h1 id="你不知道的-js" tabindex="-1">你不知道的 JS <a class="header-anchor" href="#你不知道的-js" aria-label="Permalink to &quot;你不知道的 JS&quot;">​</a></h1><h2 id="matchmedia" tabindex="-1">matchMedia <a class="header-anchor" href="#matchmedia" aria-label="Permalink to &quot;matchMedia&quot;">​</a></h2><ul><li>匹配媒体属性相关的信息</li></ul><blockquote><p>比如</p></blockquote><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 获取系统主题</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> mediaQueryList </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> window.</span><span style="color:#B392F0;">matchMedia</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;(prefers-color-scheme: dark)&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#6A737D;">/**</span></span>
diff --git a/assets/articles_advanced_knowledge.js.md.4f4856e0.lean.js b/assets/articles_advanced_knowledge.js.md.8a7fac43.lean.js
similarity index 73%
rename from assets/articles_advanced_knowledge.js.md.4f4856e0.lean.js
rename to assets/articles_advanced_knowledge.js.md.8a7fac43.lean.js
index c1f7f69..a42178c 100644
--- a/assets/articles_advanced_knowledge.js.md.4f4856e0.lean.js
+++ b/assets/articles_advanced_knowledge.js.md.8a7fac43.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as e}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"你不知道的 JS","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/knowledge.js.md","filePath":"articles/advanced/knowledge.js.md","lastUpdated":1670330848000}'),l={name:"articles/advanced/knowledge.js.md"},p=e("",5),o=[p];function c(t,r,i,d,y,h){return a(),n("div",null,o)}const A=s(l,[["render",c]]);export{_ as __pageData,A as default};
+import{_ as s,o as a,c as n,Q as e}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"你不知道的 JS","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/knowledge.js.md","filePath":"articles/advanced/knowledge.js.md","lastUpdated":1670330848000}'),l={name:"articles/advanced/knowledge.js.md"},p=e("",5),o=[p];function c(t,r,i,d,y,h){return a(),n("div",null,o)}const A=s(l,[["render",c]]);export{_ as __pageData,A as default};
diff --git a/assets/articles_advanced_mutationObserver.md.cb0eb7f3.js b/assets/articles_advanced_mutationObserver.md.1d6f3539.js
similarity index 99%
rename from assets/articles_advanced_mutationObserver.md.cb0eb7f3.js
rename to assets/articles_advanced_mutationObserver.md.1d6f3539.js
index dd5adcd..ba24f44 100644
--- a/assets/articles_advanced_mutationObserver.md.cb0eb7f3.js
+++ b/assets/articles_advanced_mutationObserver.md.1d6f3539.js
@@ -1,4 +1,4 @@
-import{_ as s}from"./chunks/mutationObserver.a5873c86.js";import{_ as a,o as n,c as l,Q as p}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"MutationObserver","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/mutationObserver.md","filePath":"articles/advanced/mutationObserver.md","lastUpdated":1670379203000}'),o={name:"articles/advanced/mutationObserver.md"},e=p('<h1 id="mutationobserver" tabindex="-1">MutationObserver <a class="header-anchor" href="#mutationobserver" aria-label="Permalink to &quot;MutationObserver&quot;">​</a></h1><h2 id="概念" tabindex="-1">概念 <a class="header-anchor" href="#概念" aria-label="Permalink to &quot;概念&quot;">​</a></h2><blockquote><p>当 DOM 变化时，可以异步执行回调监听 DOM 的变化 监听范围：document, dom subtree, single element, attributes, childNodes, textNode</p></blockquote><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><img src="'+s+`" alt="mutaion observer browser compatible"><h2 id="用法" tabindex="-1">用法 <a class="header-anchor" href="#用法" aria-label="Permalink to &quot;用法&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;DOM was mutated!&#39;</span><span style="color:#E1E4E8;">));</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> observer </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">MutationObserver</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;DOM was mutated!&#39;</span><span style="color:#24292E;">));</span></span></code></pre></div><h2 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><p>api 介绍</p><h3 id="observe-方法" tabindex="-1">observe 方法 <a class="header-anchor" href="#observe-方法" aria-label="Permalink to &quot;observe 方法&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
+import{_ as s}from"./chunks/mutationObserver.46371927.js";import{_ as a,o as n,c as l,Q as p}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"MutationObserver","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/mutationObserver.md","filePath":"articles/advanced/mutationObserver.md","lastUpdated":1670379203000}'),o={name:"articles/advanced/mutationObserver.md"},e=p('<h1 id="mutationobserver" tabindex="-1">MutationObserver <a class="header-anchor" href="#mutationobserver" aria-label="Permalink to &quot;MutationObserver&quot;">​</a></h1><h2 id="概念" tabindex="-1">概念 <a class="header-anchor" href="#概念" aria-label="Permalink to &quot;概念&quot;">​</a></h2><blockquote><p>当 DOM 变化时，可以异步执行回调监听 DOM 的变化 监听范围：document, dom subtree, single element, attributes, childNodes, textNode</p></blockquote><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><img src="'+s+`" alt="mutaion observer browser compatible"><h2 id="用法" tabindex="-1">用法 <a class="header-anchor" href="#用法" aria-label="Permalink to &quot;用法&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;DOM was mutated!&#39;</span><span style="color:#E1E4E8;">));</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> observer </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">MutationObserver</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;DOM was mutated!&#39;</span><span style="color:#24292E;">));</span></span></code></pre></div><h2 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><p>api 介绍</p><h3 id="observe-方法" tabindex="-1">observe 方法 <a class="header-anchor" href="#observe-方法" aria-label="Permalink to &quot;observe 方法&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;document has changed!!!&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">});</span></span>
 <span class="line"><span style="color:#E1E4E8;">observer.</span><span style="color:#B392F0;">observe</span><span style="color:#E1E4E8;">(document.body, { attributes: </span><span style="color:#79B8FF;">true</span><span style="color:#E1E4E8;"> });</span></span>
diff --git a/assets/articles_advanced_mutationObserver.md.cb0eb7f3.lean.js b/assets/articles_advanced_mutationObserver.md.1d6f3539.lean.js
similarity index 76%
rename from assets/articles_advanced_mutationObserver.md.cb0eb7f3.lean.js
rename to assets/articles_advanced_mutationObserver.md.1d6f3539.lean.js
index 5243118..5855289 100644
--- a/assets/articles_advanced_mutationObserver.md.cb0eb7f3.lean.js
+++ b/assets/articles_advanced_mutationObserver.md.1d6f3539.lean.js
@@ -1 +1 @@
-import{_ as s}from"./chunks/mutationObserver.a5873c86.js";import{_ as a,o as n,c as l,Q as p}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"MutationObserver","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/mutationObserver.md","filePath":"articles/advanced/mutationObserver.md","lastUpdated":1670379203000}'),o={name:"articles/advanced/mutationObserver.md"},e=p("",38),t=[e];function c(r,y,E,i,d,u){return n(),l("div",null,t)}const h=a(o,[["render",c]]);export{m as __pageData,h as default};
+import{_ as s}from"./chunks/mutationObserver.46371927.js";import{_ as a,o as n,c as l,Q as p}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"MutationObserver","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/mutationObserver.md","filePath":"articles/advanced/mutationObserver.md","lastUpdated":1670379203000}'),o={name:"articles/advanced/mutationObserver.md"},e=p("",38),t=[e];function c(r,y,E,i,d,u){return n(),l("div",null,t)}const h=a(o,[["render",c]]);export{m as __pageData,h as default};
diff --git a/assets/articles_advanced_transitionAnimation.md.f629e671.js b/assets/articles_advanced_transitionAnimation.md.e283b702.js
similarity index 92%
rename from assets/articles_advanced_transitionAnimation.md.f629e671.js
rename to assets/articles_advanced_transitionAnimation.md.e283b702.js
index 1abedde..f14d127 100644
--- a/assets/articles_advanced_transitionAnimation.md.f629e671.js
+++ b/assets/articles_advanced_transitionAnimation.md.e283b702.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const p="/learning-docs2/assets/images/browser-work.png",o="/learning-docs2/assets/images/user-interface.png",A=JSON.parse('{"title":"CSSJS 动画那些事","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/transitionAnimation.md","filePath":"articles/advanced/transitionAnimation.md","lastUpdated":1670379203000}'),e={name:"articles/advanced/transitionAnimation.md"},t=l('<h1 id="cssjs-动画那些事" tabindex="-1">CSSJS 动画那些事 <a class="header-anchor" href="#cssjs-动画那些事" aria-label="Permalink to &quot;CSSJS 动画那些事&quot;">​</a></h1><p>先来了解一下重绘与回流</p><h2 id="回流与重绘" tabindex="-1">回流与重绘 <a class="header-anchor" href="#回流与重绘" aria-label="Permalink to &quot;回流与重绘&quot;">​</a></h2><p><code>回流必将引起重绘，重绘不一定回流</code></p><p><strong>浏览器工作原理</strong></p><img src="'+p+'" alt="浏览器工作原理图"><p><strong>浏览器用户界面</strong></p><img src="'+o+`" alt="user interface"><ul><li>重绘 <code>外观发生变化，元素可见性，不会改变布局</code></li><li>回流 <code>重新计算元素的位置和几何形状</code></li></ul><h2 id="css-动画" tabindex="-1">CSS 动画 <a class="header-anchor" href="#css-动画" aria-label="Permalink to &quot;CSS 动画&quot;">​</a></h2><p>先回顾一下 css 的 transition 和 animation 属性</p><ul><li><p>transition 属性</p><ul><li>transition-property: string</li><li>transition-duration: number</li><li>transition-timing-function: cubic-bezier | &#39;ease&#39; | &#39;ease-in&#39; | &#39;ease-in-out&#39; | &#39;ease-out&#39; | steps | step-start | step-middle | step-end</li><li>transition-delay: number</li></ul></li><li><p>animation 属性</p><ul><li>animation-duration: number</li><li>animation-timing-function: ^</li><li>animation-delay: number</li><li>animation-iteration-count: infinite</li><li>animation-direction: alternate | alternate-reverse | reverse</li><li>animation-fill-mode: backwards | forwards | both | none</li><li>animation-play-state: paused | running</li><li>animation-name: string</li></ul></li></ul><h2 id="js-动画" tabindex="-1">JS 动画 <a class="header-anchor" href="#js-动画" aria-label="Permalink to &quot;JS 动画&quot;">​</a></h2><p>接下来介绍一下 js 和 css 结合的动画</p><p>DOM 事件中有: <code>transitionstart, transitionend, animationstart, animationend</code> 事件</p><div class="tip custom-block"><p class="custom-block-title">思考</p><p>enter active leave 三种状态</p></div><p><strong>抛出问题：</strong></p><ol><li><p>我们是否用过 display 切换 block 和 none 两种状态，想实现点动画过渡效果，但是 display 是立即消失立即隐藏？</p></li><li><p>你可能会想到用 settimeout 设置一个时间来控制显示隐藏，而中间恰好利用这段时间来进行动画过渡的操作？</p></li><li><p>那如何在中间这段时间加上动画呢？</p></li></ol><p><code>从以下一个例子中来讲：</code></p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const p="/assets/images/browser-work.png",o="/assets/images/user-interface.png",A=JSON.parse('{"title":"CSSJS 动画那些事","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/transitionAnimation.md","filePath":"articles/advanced/transitionAnimation.md","lastUpdated":1670379203000}'),e={name:"articles/advanced/transitionAnimation.md"},t=l('<h1 id="cssjs-动画那些事" tabindex="-1">CSSJS 动画那些事 <a class="header-anchor" href="#cssjs-动画那些事" aria-label="Permalink to &quot;CSSJS 动画那些事&quot;">​</a></h1><p>先来了解一下重绘与回流</p><h2 id="回流与重绘" tabindex="-1">回流与重绘 <a class="header-anchor" href="#回流与重绘" aria-label="Permalink to &quot;回流与重绘&quot;">​</a></h2><p><code>回流必将引起重绘，重绘不一定回流</code></p><p><strong>浏览器工作原理</strong></p><img src="'+p+'" alt="浏览器工作原理图"><p><strong>浏览器用户界面</strong></p><img src="'+o+`" alt="user interface"><ul><li>重绘 <code>外观发生变化，元素可见性，不会改变布局</code></li><li>回流 <code>重新计算元素的位置和几何形状</code></li></ul><h2 id="css-动画" tabindex="-1">CSS 动画 <a class="header-anchor" href="#css-动画" aria-label="Permalink to &quot;CSS 动画&quot;">​</a></h2><p>先回顾一下 css 的 transition 和 animation 属性</p><ul><li><p>transition 属性</p><ul><li>transition-property: string</li><li>transition-duration: number</li><li>transition-timing-function: cubic-bezier | &#39;ease&#39; | &#39;ease-in&#39; | &#39;ease-in-out&#39; | &#39;ease-out&#39; | steps | step-start | step-middle | step-end</li><li>transition-delay: number</li></ul></li><li><p>animation 属性</p><ul><li>animation-duration: number</li><li>animation-timing-function: ^</li><li>animation-delay: number</li><li>animation-iteration-count: infinite</li><li>animation-direction: alternate | alternate-reverse | reverse</li><li>animation-fill-mode: backwards | forwards | both | none</li><li>animation-play-state: paused | running</li><li>animation-name: string</li></ul></li></ul><h2 id="js-动画" tabindex="-1">JS 动画 <a class="header-anchor" href="#js-动画" aria-label="Permalink to &quot;JS 动画&quot;">​</a></h2><p>接下来介绍一下 js 和 css 结合的动画</p><p>DOM 事件中有: <code>transitionstart, transitionend, animationstart, animationend</code> 事件</p><div class="tip custom-block"><p class="custom-block-title">思考</p><p>enter active leave 三种状态</p></div><p><strong>抛出问题：</strong></p><ol><li><p>我们是否用过 display 切换 block 和 none 两种状态，想实现点动画过渡效果，但是 display 是立即消失立即隐藏？</p></li><li><p>你可能会想到用 settimeout 设置一个时间来控制显示隐藏，而中间恰好利用这段时间来进行动画过渡的操作？</p></li><li><p>那如何在中间这段时间加上动画呢？</p></li></ol><p><code>从以下一个例子中来讲：</code></p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;点我显示/隐藏&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">style</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#85E89D;">*</span><span style="color:#E1E4E8;"> {</span></span>
diff --git a/assets/articles_advanced_transitionAnimation.md.e283b702.lean.js b/assets/articles_advanced_transitionAnimation.md.e283b702.lean.js
new file mode 100644
index 0000000..00d4340
--- /dev/null
+++ b/assets/articles_advanced_transitionAnimation.md.e283b702.lean.js
@@ -0,0 +1 @@
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const p="/assets/images/browser-work.png",o="/assets/images/user-interface.png",A=JSON.parse('{"title":"CSSJS 动画那些事","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/transitionAnimation.md","filePath":"articles/advanced/transitionAnimation.md","lastUpdated":1670379203000}'),e={name:"articles/advanced/transitionAnimation.md"},t=l("",28),c=[t];function r(E,y,i,d,F,u){return n(),a("div",null,c)}const v=s(e,[["render",r]]);export{A as __pageData,v as default};
diff --git a/assets/articles_advanced_transitionAnimation.md.f629e671.lean.js b/assets/articles_advanced_transitionAnimation.md.f629e671.lean.js
deleted file mode 100644
index 0188779..0000000
--- a/assets/articles_advanced_transitionAnimation.md.f629e671.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const p="/learning-docs2/assets/images/browser-work.png",o="/learning-docs2/assets/images/user-interface.png",A=JSON.parse('{"title":"CSSJS 动画那些事","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/transitionAnimation.md","filePath":"articles/advanced/transitionAnimation.md","lastUpdated":1670379203000}'),e={name:"articles/advanced/transitionAnimation.md"},t=l("",28),c=[t];function r(E,y,i,d,F,u){return n(),a("div",null,c)}const v=s(e,[["render",r]]);export{A as __pageData,v as default};
diff --git a/assets/articles_advanced_v8-code.md.40cd5ff2.js b/assets/articles_advanced_v8-code.md.40cd5ff2.js
deleted file mode 100644
index 6f78225..0000000
--- a/assets/articles_advanced_v8-code.md.40cd5ff2.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as a,o as e,c as l,Q as i}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/compiler.jpg",t="/learning-docs2/assets/images/v8-code.jpg",m=JSON.parse('{"title":"V8","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/v8-code.md","filePath":"articles/advanced/v8-code.md","lastUpdated":1670379203000}'),r={name:"articles/advanced/v8-code.md"},c=i('<h1 id="v8" tabindex="-1">V8 <a class="header-anchor" href="#v8" aria-label="Permalink to &quot;V8&quot;">​</a></h1><h2 id="解释器和执行器" tabindex="-1">解释器和执行器 <a class="header-anchor" href="#解释器和执行器" aria-label="Permalink to &quot;解释器和执行器&quot;">​</a></h2><img src="'+o+'" alt="解释器和执行器"><ul><li><p>在编译型语言的编译过程中，编译器首先会依次对源代码进行词法分析、语法分析，生成抽象语法树（AST），然后是优化代码，最后再生成处理器能够理解的机器码。如果编译成功，将会生成一个可执行的文件。但如果编译过程发生了语法或者其他的错误，那么编译器就会抛出异常，最后的二进制文件也不会生成成功</p></li><li><p>在解释型语言的解释过程中，同样解释器也会对源代码进行词法分析、语法分析，并生成抽象语法树（AST），不过它会再基于抽象语法树生成字节码，最后再根据字节码来执行程序、输出结果</p></li></ul><h2 id="v8-执行代码" tabindex="-1">V8 执行代码 <a class="header-anchor" href="#v8-执行代码" aria-label="Permalink to &quot;V8 执行代码&quot;">​</a></h2><img src="'+t+'" alt="v8 执行代码"><h3 id="生成抽象语法树和执行上下文" tabindex="-1">生成抽象语法树和执行上下文 <a class="header-anchor" href="#生成抽象语法树和执行上下文" aria-label="Permalink to &quot;生成抽象语法树和执行上下文&quot;">​</a></h3><ul><li>分词（tokenize），词法分析</li></ul><p>将源码拆成一个个 token（语法上不能再分的、最小的单个字符或字符串）</p><ul><li>解析（parse），语法分析</li></ul><p>将上一步生成的 token 数据，根据语法规则转成抽象语法树（存在语法错误，会终止抛出错误）</p><h3 id="生成字节码" tabindex="-1">生成字节码 <a class="header-anchor" href="#生成字节码" aria-label="Permalink to &quot;生成字节码&quot;">​</a></h3><p>字节码是介于 AST 和机器码之间的一种代码。但是与特定类型的机器码无关，字节码需要通过解释器将其转换为机器码后才能执行（体积小）</p><h3 id="执行代码" tabindex="-1">执行代码 <a class="header-anchor" href="#执行代码" aria-label="Permalink to &quot;执行代码&quot;">​</a></h3><p>解释器 Ignition</p><ul><li>第一次执行的字节码，解释器逐条解释执行</li><li>解释器解析生成字节码，还有一个作用就是解释执行字节码</li><li>执行字节码过程中，有热点代码（重复执行多次），后台编译器（TurboFan）把这段代码编译成机器码，提高执行效率</li></ul><p><code>JIT 即时编译</code></p><p>解释器 Ignition 在解释执行字节码的同时，收集代码信息，发现是热点代码之后，TurboFan 编译器把热点的字节码编译成机器码，并保存起来以供下次使用</p><h2 id="垃圾回收" tabindex="-1">垃圾回收 <a class="header-anchor" href="#垃圾回收" aria-label="Permalink to &quot;垃圾回收&quot;">​</a></h2><p><a href="https://time.geekbang.org/column/article/131233" target="_blank" rel="noreferrer">V8 的垃圾回收</a></p><h3 id="栈空间" tabindex="-1">栈空间 <a class="header-anchor" href="#栈空间" aria-label="Permalink to &quot;栈空间&quot;">​</a></h3><p>原始数据类型存放与栈空间中</p><p><code>函数执行上下文 -&gt; 全局执行上下文（采用调用栈的形式记录数据）</code></p><h3 id="堆空间" tabindex="-1">堆空间 <a class="header-anchor" href="#堆空间" aria-label="Permalink to &quot;堆空间&quot;">​</a></h3><p>引用类型使用堆空间存储（栈中存储的是引用地址）</p><h3 id="堆空间的垃圾回收" tabindex="-1">堆空间的垃圾回收 <a class="header-anchor" href="#堆空间的垃圾回收" aria-label="Permalink to &quot;堆空间的垃圾回收&quot;">​</a></h3><blockquote><p>代际假说</p></blockquote><ol><li>对象一般不会存储太久，一经分配内存，很快就会变得不可访问</li><li>不死的对象活的更久</li></ol><h3 id="新生代" tabindex="-1">新生代 <a class="header-anchor" href="#新生代" aria-label="Permalink to &quot;新生代&quot;">​</a></h3><p>对象存放的时间较短（1-8M 的存储空间）</p><h3 id="老生代" tabindex="-1">老生代 <a class="header-anchor" href="#老生代" aria-label="Permalink to &quot;老生代&quot;">​</a></h3><p>对象存放的时间较长</p><h3 id="垃圾回收流程" tabindex="-1">垃圾回收流程 <a class="header-anchor" href="#垃圾回收流程" aria-label="Permalink to &quot;垃圾回收流程&quot;">​</a></h3><p>所有垃圾回收机制，都有一套完整的统一流程</p><ul><li>标记空间中的活动对象和非活动对象 <ul><li>活动对象 = 正在使用中的对象</li><li>非活动对象 = 需要垃圾回收的对象</li></ul></li><li>回收非活动对象占用的空间 <ul><li>所有标记完成之后，统一清理内存中所有被标记为可回收的对象</li></ul></li><li>内存整理 <ul><li>整理内存碎片（不连续的内存空间）</li></ul></li></ul><h3 id="副垃圾回收器" tabindex="-1">副垃圾回收器 <a class="header-anchor" href="#副垃圾回收器" aria-label="Permalink to &quot;副垃圾回收器&quot;">​</a></h3><p>主要负责新生代区间的垃圾回收</p><blockquote><p>Scanvenge 算法 -&gt; 新生区区间划分为两个区域：对象区域、空闲区域</p></blockquote><ul><li><p>新加入的对象会加入对象区域，对象区域存满之后，会执行一次垃圾回收操作</p></li><li><p>对对象区域中的垃圾进行标记</p></li><li><p>标记完毕，副垃圾回收器会对没有进行标记的对象进行复制，<code>复制</code>到空闲区域，同时还会排列起来（内存整理）</p></li><li><p>对象区域和空闲区域角色反转（对象区域=空闲区域 空闲区域=对象区域）两块区域重复利用</p></li></ul><blockquote><p>对象晋升策略</p></blockquote><p>为了执行效率，新生代的空间一般不会设置得太大，因此<code>经过两次垃圾回收的活动对象依然存在</code>，会被放入到老生代区间中</p><h3 id="主垃圾回收器" tabindex="-1">主垃圾回收器 <a class="header-anchor" href="#主垃圾回收器" aria-label="Permalink to &quot;主垃圾回收器&quot;">​</a></h3><p>主要负责老生代区间的垃圾回收</p><ul><li>空间大</li><li>对象存活时间长</li></ul><blockquote><p>标记 - 清除（Mark - Sweep）</p></blockquote><ul><li>从一组根元素开始</li><li>递归遍历根元素（能访问到的元素为活动对象，不能访问到的元素为垃圾数据）</li></ul><blockquote><p>标记 - 整理（Mark - Compact）</p></blockquote><p>标记清除算法会产生大量的不连续内存碎片，导致大对象无法分配一块连续空间的内存</p><ul><li>所有的活动对象都向一端移动，然后直接清理掉端边界以外的内存</li></ul><h3 id="全停顿" tabindex="-1">全停顿 <a class="header-anchor" href="#全停顿" aria-label="Permalink to &quot;全停顿&quot;">​</a></h3><p>Stop-The-World</p><p><code>JavaScript 是运行在主线程之上，一旦执行垃圾回收算法，脚本执行需要停顿，待垃圾回收完毕之后恢复脚本的执行</code></p><h3 id="增量标记" tabindex="-1">增量标记 <a class="header-anchor" href="#增量标记" aria-label="Permalink to &quot;增量标记&quot;">​</a></h3><p>Incremental Marking</p><p>全停顿算法，一旦垃圾回收算法执行时间过长，页面会出现卡顿现象，导致用户体验下降</p><ul><li>一个完整的垃圾回收任务拆分成很小的任务</li><li>小任务执行时间很短，穿插在 JavaScript 任务中</li></ul>',56),n=[c];function h(d,p,u,s,b,q){return e(),l("div",null,n)}const _=a(r,[["render",h]]);export{m as __pageData,_ as default};
diff --git a/assets/articles_advanced_v8-code.md.40cd5ff2.lean.js b/assets/articles_advanced_v8-code.md.40cd5ff2.lean.js
deleted file mode 100644
index 78484e5..0000000
--- a/assets/articles_advanced_v8-code.md.40cd5ff2.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as a,o as e,c as l,Q as i}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/compiler.jpg",t="/learning-docs2/assets/images/v8-code.jpg",m=JSON.parse('{"title":"V8","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/v8-code.md","filePath":"articles/advanced/v8-code.md","lastUpdated":1670379203000}'),r={name:"articles/advanced/v8-code.md"},c=i("",56),n=[c];function h(d,p,u,s,b,q){return e(),l("div",null,n)}const _=a(r,[["render",h]]);export{m as __pageData,_ as default};
diff --git a/assets/articles_advanced_v8-code.md.aa1e9c3f.js b/assets/articles_advanced_v8-code.md.aa1e9c3f.js
new file mode 100644
index 0000000..e49fe9e
--- /dev/null
+++ b/assets/articles_advanced_v8-code.md.aa1e9c3f.js
@@ -0,0 +1 @@
+import{_ as a,o as e,c as l,Q as i}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/compiler.jpg",t="/assets/images/v8-code.jpg",m=JSON.parse('{"title":"V8","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/v8-code.md","filePath":"articles/advanced/v8-code.md","lastUpdated":1670379203000}'),r={name:"articles/advanced/v8-code.md"},c=i('<h1 id="v8" tabindex="-1">V8 <a class="header-anchor" href="#v8" aria-label="Permalink to &quot;V8&quot;">​</a></h1><h2 id="解释器和执行器" tabindex="-1">解释器和执行器 <a class="header-anchor" href="#解释器和执行器" aria-label="Permalink to &quot;解释器和执行器&quot;">​</a></h2><img src="'+o+'" alt="解释器和执行器"><ul><li><p>在编译型语言的编译过程中，编译器首先会依次对源代码进行词法分析、语法分析，生成抽象语法树（AST），然后是优化代码，最后再生成处理器能够理解的机器码。如果编译成功，将会生成一个可执行的文件。但如果编译过程发生了语法或者其他的错误，那么编译器就会抛出异常，最后的二进制文件也不会生成成功</p></li><li><p>在解释型语言的解释过程中，同样解释器也会对源代码进行词法分析、语法分析，并生成抽象语法树（AST），不过它会再基于抽象语法树生成字节码，最后再根据字节码来执行程序、输出结果</p></li></ul><h2 id="v8-执行代码" tabindex="-1">V8 执行代码 <a class="header-anchor" href="#v8-执行代码" aria-label="Permalink to &quot;V8 执行代码&quot;">​</a></h2><img src="'+t+'" alt="v8 执行代码"><h3 id="生成抽象语法树和执行上下文" tabindex="-1">生成抽象语法树和执行上下文 <a class="header-anchor" href="#生成抽象语法树和执行上下文" aria-label="Permalink to &quot;生成抽象语法树和执行上下文&quot;">​</a></h3><ul><li>分词（tokenize），词法分析</li></ul><p>将源码拆成一个个 token（语法上不能再分的、最小的单个字符或字符串）</p><ul><li>解析（parse），语法分析</li></ul><p>将上一步生成的 token 数据，根据语法规则转成抽象语法树（存在语法错误，会终止抛出错误）</p><h3 id="生成字节码" tabindex="-1">生成字节码 <a class="header-anchor" href="#生成字节码" aria-label="Permalink to &quot;生成字节码&quot;">​</a></h3><p>字节码是介于 AST 和机器码之间的一种代码。但是与特定类型的机器码无关，字节码需要通过解释器将其转换为机器码后才能执行（体积小）</p><h3 id="执行代码" tabindex="-1">执行代码 <a class="header-anchor" href="#执行代码" aria-label="Permalink to &quot;执行代码&quot;">​</a></h3><p>解释器 Ignition</p><ul><li>第一次执行的字节码，解释器逐条解释执行</li><li>解释器解析生成字节码，还有一个作用就是解释执行字节码</li><li>执行字节码过程中，有热点代码（重复执行多次），后台编译器（TurboFan）把这段代码编译成机器码，提高执行效率</li></ul><p><code>JIT 即时编译</code></p><p>解释器 Ignition 在解释执行字节码的同时，收集代码信息，发现是热点代码之后，TurboFan 编译器把热点的字节码编译成机器码，并保存起来以供下次使用</p><h2 id="垃圾回收" tabindex="-1">垃圾回收 <a class="header-anchor" href="#垃圾回收" aria-label="Permalink to &quot;垃圾回收&quot;">​</a></h2><p><a href="https://time.geekbang.org/column/article/131233" target="_blank" rel="noreferrer">V8 的垃圾回收</a></p><h3 id="栈空间" tabindex="-1">栈空间 <a class="header-anchor" href="#栈空间" aria-label="Permalink to &quot;栈空间&quot;">​</a></h3><p>原始数据类型存放与栈空间中</p><p><code>函数执行上下文 -&gt; 全局执行上下文（采用调用栈的形式记录数据）</code></p><h3 id="堆空间" tabindex="-1">堆空间 <a class="header-anchor" href="#堆空间" aria-label="Permalink to &quot;堆空间&quot;">​</a></h3><p>引用类型使用堆空间存储（栈中存储的是引用地址）</p><h3 id="堆空间的垃圾回收" tabindex="-1">堆空间的垃圾回收 <a class="header-anchor" href="#堆空间的垃圾回收" aria-label="Permalink to &quot;堆空间的垃圾回收&quot;">​</a></h3><blockquote><p>代际假说</p></blockquote><ol><li>对象一般不会存储太久，一经分配内存，很快就会变得不可访问</li><li>不死的对象活的更久</li></ol><h3 id="新生代" tabindex="-1">新生代 <a class="header-anchor" href="#新生代" aria-label="Permalink to &quot;新生代&quot;">​</a></h3><p>对象存放的时间较短（1-8M 的存储空间）</p><h3 id="老生代" tabindex="-1">老生代 <a class="header-anchor" href="#老生代" aria-label="Permalink to &quot;老生代&quot;">​</a></h3><p>对象存放的时间较长</p><h3 id="垃圾回收流程" tabindex="-1">垃圾回收流程 <a class="header-anchor" href="#垃圾回收流程" aria-label="Permalink to &quot;垃圾回收流程&quot;">​</a></h3><p>所有垃圾回收机制，都有一套完整的统一流程</p><ul><li>标记空间中的活动对象和非活动对象 <ul><li>活动对象 = 正在使用中的对象</li><li>非活动对象 = 需要垃圾回收的对象</li></ul></li><li>回收非活动对象占用的空间 <ul><li>所有标记完成之后，统一清理内存中所有被标记为可回收的对象</li></ul></li><li>内存整理 <ul><li>整理内存碎片（不连续的内存空间）</li></ul></li></ul><h3 id="副垃圾回收器" tabindex="-1">副垃圾回收器 <a class="header-anchor" href="#副垃圾回收器" aria-label="Permalink to &quot;副垃圾回收器&quot;">​</a></h3><p>主要负责新生代区间的垃圾回收</p><blockquote><p>Scanvenge 算法 -&gt; 新生区区间划分为两个区域：对象区域、空闲区域</p></blockquote><ul><li><p>新加入的对象会加入对象区域，对象区域存满之后，会执行一次垃圾回收操作</p></li><li><p>对对象区域中的垃圾进行标记</p></li><li><p>标记完毕，副垃圾回收器会对没有进行标记的对象进行复制，<code>复制</code>到空闲区域，同时还会排列起来（内存整理）</p></li><li><p>对象区域和空闲区域角色反转（对象区域=空闲区域 空闲区域=对象区域）两块区域重复利用</p></li></ul><blockquote><p>对象晋升策略</p></blockquote><p>为了执行效率，新生代的空间一般不会设置得太大，因此<code>经过两次垃圾回收的活动对象依然存在</code>，会被放入到老生代区间中</p><h3 id="主垃圾回收器" tabindex="-1">主垃圾回收器 <a class="header-anchor" href="#主垃圾回收器" aria-label="Permalink to &quot;主垃圾回收器&quot;">​</a></h3><p>主要负责老生代区间的垃圾回收</p><ul><li>空间大</li><li>对象存活时间长</li></ul><blockquote><p>标记 - 清除（Mark - Sweep）</p></blockquote><ul><li>从一组根元素开始</li><li>递归遍历根元素（能访问到的元素为活动对象，不能访问到的元素为垃圾数据）</li></ul><blockquote><p>标记 - 整理（Mark - Compact）</p></blockquote><p>标记清除算法会产生大量的不连续内存碎片，导致大对象无法分配一块连续空间的内存</p><ul><li>所有的活动对象都向一端移动，然后直接清理掉端边界以外的内存</li></ul><h3 id="全停顿" tabindex="-1">全停顿 <a class="header-anchor" href="#全停顿" aria-label="Permalink to &quot;全停顿&quot;">​</a></h3><p>Stop-The-World</p><p><code>JavaScript 是运行在主线程之上，一旦执行垃圾回收算法，脚本执行需要停顿，待垃圾回收完毕之后恢复脚本的执行</code></p><h3 id="增量标记" tabindex="-1">增量标记 <a class="header-anchor" href="#增量标记" aria-label="Permalink to &quot;增量标记&quot;">​</a></h3><p>Incremental Marking</p><p>全停顿算法，一旦垃圾回收算法执行时间过长，页面会出现卡顿现象，导致用户体验下降</p><ul><li>一个完整的垃圾回收任务拆分成很小的任务</li><li>小任务执行时间很短，穿插在 JavaScript 任务中</li></ul>',56),h=[c];function n(d,p,u,s,b,q){return e(),l("div",null,h)}const _=a(r,[["render",n]]);export{m as __pageData,_ as default};
diff --git a/assets/articles_advanced_v8-code.md.aa1e9c3f.lean.js b/assets/articles_advanced_v8-code.md.aa1e9c3f.lean.js
new file mode 100644
index 0000000..a993cf8
--- /dev/null
+++ b/assets/articles_advanced_v8-code.md.aa1e9c3f.lean.js
@@ -0,0 +1 @@
+import{_ as a,o as e,c as l,Q as i}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/compiler.jpg",t="/assets/images/v8-code.jpg",m=JSON.parse('{"title":"V8","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/v8-code.md","filePath":"articles/advanced/v8-code.md","lastUpdated":1670379203000}'),r={name:"articles/advanced/v8-code.md"},c=i("",56),h=[c];function n(d,p,u,s,b,q){return e(),l("div",null,h)}const _=a(r,[["render",n]]);export{m as __pageData,_ as default};
diff --git a/assets/articles_advanced_virtualList.md.6b763d2e.js b/assets/articles_advanced_virtualList.md.0c9b0049.js
similarity index 96%
rename from assets/articles_advanced_virtualList.md.6b763d2e.js
rename to assets/articles_advanced_virtualList.md.0c9b0049.js
index ba9f3ad..b8134a8 100644
--- a/assets/articles_advanced_virtualList.md.6b763d2e.js
+++ b/assets/articles_advanced_virtualList.md.0c9b0049.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const p="/learning-docs2/assets/images/virtual_list.png",d=JSON.parse('{"title":"PC虚拟列表如何处理","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/virtualList.md","filePath":"articles/advanced/virtualList.md","lastUpdated":1675328164000}'),o={name:"articles/advanced/virtualList.md"},e=l('<h1 id="pc虚拟列表如何处理" tabindex="-1">PC虚拟列表如何处理 <a class="header-anchor" href="#pc虚拟列表如何处理" aria-label="Permalink to &quot;PC虚拟列表如何处理&quot;">​</a></h1><img src="'+p+`"><p><code>针对场景</code></p><blockquote><p>页面需要渲染上千个上万个节点甚至更多，导致页面卡顿</p></blockquote><h2 id="常见解决方案" tabindex="-1">常见解决方案 <a class="header-anchor" href="#常见解决方案" aria-label="Permalink to &quot;常见解决方案&quot;">​</a></h2><ul><li>分页</li><li>滚动到底部加载（如果不对上一页数据节点处理，照样会造成页面节点太多卡顿的问题）</li></ul><h2 id="iscroll-方案-使用-transform-或者-top" tabindex="-1">IScroll 方案 (使用 transform 或者 top) <a class="header-anchor" href="#iscroll-方案-使用-transform-或者-top" aria-label="Permalink to &quot;IScroll 方案 (使用 transform 或者 top)&quot;">​</a></h2><p>假设：固定渲染每页大小 10 条，每一项高度固定 100</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">style</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;overflow: auto;&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const p="/assets/images/virtual_list.png",d=JSON.parse('{"title":"PC虚拟列表如何处理","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/virtualList.md","filePath":"articles/advanced/virtualList.md","lastUpdated":1675328164000}'),o={name:"articles/advanced/virtualList.md"},e=l('<h1 id="pc虚拟列表如何处理" tabindex="-1">PC虚拟列表如何处理 <a class="header-anchor" href="#pc虚拟列表如何处理" aria-label="Permalink to &quot;PC虚拟列表如何处理&quot;">​</a></h1><img src="'+p+`"><p><code>针对场景</code></p><blockquote><p>页面需要渲染上千个上万个节点甚至更多，导致页面卡顿</p></blockquote><h2 id="常见解决方案" tabindex="-1">常见解决方案 <a class="header-anchor" href="#常见解决方案" aria-label="Permalink to &quot;常见解决方案&quot;">​</a></h2><ul><li>分页</li><li>滚动到底部加载（如果不对上一页数据节点处理，照样会造成页面节点太多卡顿的问题）</li></ul><h2 id="iscroll-方案-使用-transform-或者-top" tabindex="-1">IScroll 方案 (使用 transform 或者 top) <a class="header-anchor" href="#iscroll-方案-使用-transform-或者-top" aria-label="Permalink to &quot;IScroll 方案 (使用 transform 或者 top)&quot;">​</a></h2><p>假设：固定渲染每页大小 10 条，每一项高度固定 100</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">style</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;overflow: auto;&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;scroll-container&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">style</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;position: absolute; width: 100%;&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">    &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;row&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">style</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;position: absolute; top: 0px; height: 100px; width: 100%;&quot;</span><span style="color:#E1E4E8;">&gt;1&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">    ...</span></span>
diff --git a/assets/articles_advanced_virtualList.md.0c9b0049.lean.js b/assets/articles_advanced_virtualList.md.0c9b0049.lean.js
new file mode 100644
index 0000000..1b4ed89
--- /dev/null
+++ b/assets/articles_advanced_virtualList.md.0c9b0049.lean.js
@@ -0,0 +1 @@
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const p="/assets/images/virtual_list.png",d=JSON.parse('{"title":"PC虚拟列表如何处理","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/virtualList.md","filePath":"articles/advanced/virtualList.md","lastUpdated":1675328164000}'),o={name:"articles/advanced/virtualList.md"},e=l("",32),t=[e];function c(r,E,y,i,F,A){return n(),a("div",null,t)}const h=s(o,[["render",c]]);export{d as __pageData,h as default};
diff --git a/assets/articles_advanced_virtualList.md.6b763d2e.lean.js b/assets/articles_advanced_virtualList.md.6b763d2e.lean.js
deleted file mode 100644
index eae8980..0000000
--- a/assets/articles_advanced_virtualList.md.6b763d2e.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const p="/learning-docs2/assets/images/virtual_list.png",d=JSON.parse('{"title":"PC虚拟列表如何处理","description":"","frontmatter":{},"headers":[],"relativePath":"articles/advanced/virtualList.md","filePath":"articles/advanced/virtualList.md","lastUpdated":1675328164000}'),o={name:"articles/advanced/virtualList.md"},e=l("",32),t=[e];function c(r,E,y,i,F,A){return n(),a("div",null,t)}const h=s(o,[["render",c]]);export{d as __pageData,h as default};
diff --git a/assets/articles_basic_clipboard.md.b53c3e95.js b/assets/articles_basic_clipboard.md.a48ade2d.js
similarity index 99%
rename from assets/articles_basic_clipboard.md.b53c3e95.js
rename to assets/articles_basic_clipboard.md.a48ade2d.js
index a97ad12..819e054 100644
--- a/assets/articles_basic_clipboard.md.b53c3e95.js
+++ b/assets/articles_basic_clipboard.md.a48ade2d.js
@@ -1,4 +1,4 @@
-import{_ as l,C as p,o,c as e,k as s,a,H as t,Q as c}from"./chunks/framework.7c0fadea.js";const v=JSON.parse('{"title":"JS 如何实现复制","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/clipboard.md","filePath":"articles/basic/clipboard.md","lastUpdated":1670379203000}'),r={name:"articles/basic/clipboard.md"},E=s("h1",{id:"js-如何实现复制",tabindex:"-1"},[a("JS 如何实现复制 "),s("a",{class:"header-anchor",href:"#js-如何实现复制","aria-label":'Permalink to "JS 如何实现复制"'},"​")],-1),y={id:"document-execcommand",tabindex:"-1"},i=s("a",{class:"header-anchor",href:"#document-execcommand","aria-label":'Permalink to "document.execCommand <Badge text="Deprecated" type="warn"/>"'},"​",-1),d=c(`<p>Web 规范中表示 <code>document.exceCommand</code> 不会再支持了，但是有些浏览器还是可以继续支持</p><ul><li>w3c</li><li>whatwg</li><li>mdn</li></ul><h3 id="实现" tabindex="-1">实现 <a class="header-anchor" href="#实现" aria-label="Permalink to &quot;实现&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;btn&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">date-text</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;copy me&quot;</span><span style="color:#E1E4E8;">&gt;复制&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">button</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">id</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;btn&quot;</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">date-text</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;copy me&quot;</span><span style="color:#24292E;">&gt;复制&lt;</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 这是一种实现方式</span></span>
+import{_ as l,C as p,o,c as e,k as s,a,H as t,Q as c}from"./chunks/framework.0e8ae64e.js";const v=JSON.parse('{"title":"JS 如何实现复制","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/clipboard.md","filePath":"articles/basic/clipboard.md","lastUpdated":1670379203000}'),r={name:"articles/basic/clipboard.md"},E=s("h1",{id:"js-如何实现复制",tabindex:"-1"},[a("JS 如何实现复制 "),s("a",{class:"header-anchor",href:"#js-如何实现复制","aria-label":'Permalink to "JS 如何实现复制"'},"​")],-1),y={id:"document-execcommand",tabindex:"-1"},i=s("a",{class:"header-anchor",href:"#document-execcommand","aria-label":'Permalink to "document.execCommand <Badge text="Deprecated" type="warn"/>"'},"​",-1),d=c(`<p>Web 规范中表示 <code>document.exceCommand</code> 不会再支持了，但是有些浏览器还是可以继续支持</p><ul><li>w3c</li><li>whatwg</li><li>mdn</li></ul><h3 id="实现" tabindex="-1">实现 <a class="header-anchor" href="#实现" aria-label="Permalink to &quot;实现&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;btn&quot;</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">date-text</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;copy me&quot;</span><span style="color:#E1E4E8;">&gt;复制&lt;</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">button</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">button</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">id</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;btn&quot;</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">date-text</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;copy me&quot;</span><span style="color:#24292E;">&gt;复制&lt;</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">button</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 这是一种实现方式</span></span>
 <span class="line"><span style="color:#6A737D;">// 还可以采用 textarea 元素选中的方式</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> btn </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> document.</span><span style="color:#B392F0;">getElementById</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;btn&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"></span>
diff --git a/assets/articles_basic_clipboard.md.b53c3e95.lean.js b/assets/articles_basic_clipboard.md.a48ade2d.lean.js
similarity index 93%
rename from assets/articles_basic_clipboard.md.b53c3e95.lean.js
rename to assets/articles_basic_clipboard.md.a48ade2d.lean.js
index 54533fa..0089c3c 100644
--- a/assets/articles_basic_clipboard.md.b53c3e95.lean.js
+++ b/assets/articles_basic_clipboard.md.a48ade2d.lean.js
@@ -1 +1 @@
-import{_ as l,C as p,o,c as e,k as s,a,H as t,Q as c}from"./chunks/framework.7c0fadea.js";const v=JSON.parse('{"title":"JS 如何实现复制","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/clipboard.md","filePath":"articles/basic/clipboard.md","lastUpdated":1670379203000}'),r={name:"articles/basic/clipboard.md"},E=s("h1",{id:"js-如何实现复制",tabindex:"-1"},[a("JS 如何实现复制 "),s("a",{class:"header-anchor",href:"#js-如何实现复制","aria-label":'Permalink to "JS 如何实现复制"'},"​")],-1),y={id:"document-execcommand",tabindex:"-1"},i=s("a",{class:"header-anchor",href:"#document-execcommand","aria-label":'Permalink to "document.execCommand <Badge text="Deprecated" type="warn"/>"'},"​",-1),d=c("",45);function F(b,h,u,m,g,C){const n=p("Badge");return o(),e("div",null,[E,s("h2",y,[a("document.execCommand "),t(n,{text:"Deprecated",type:"warn"}),a(),i]),d])}const B=l(r,[["render",F]]);export{v as __pageData,B as default};
+import{_ as l,C as p,o,c as e,k as s,a,H as t,Q as c}from"./chunks/framework.0e8ae64e.js";const v=JSON.parse('{"title":"JS 如何实现复制","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/clipboard.md","filePath":"articles/basic/clipboard.md","lastUpdated":1670379203000}'),r={name:"articles/basic/clipboard.md"},E=s("h1",{id:"js-如何实现复制",tabindex:"-1"},[a("JS 如何实现复制 "),s("a",{class:"header-anchor",href:"#js-如何实现复制","aria-label":'Permalink to "JS 如何实现复制"'},"​")],-1),y={id:"document-execcommand",tabindex:"-1"},i=s("a",{class:"header-anchor",href:"#document-execcommand","aria-label":'Permalink to "document.execCommand <Badge text="Deprecated" type="warn"/>"'},"​",-1),d=c("",45);function F(b,h,u,m,g,C){const n=p("Badge");return o(),e("div",null,[E,s("h2",y,[a("document.execCommand "),t(n,{text:"Deprecated",type:"warn"}),a(),i]),d])}const B=l(r,[["render",F]]);export{v as __pageData,B as default};
diff --git a/assets/articles_basic_color_convert.md.8302e80d.js b/assets/articles_basic_color_convert.md.2cce2798.js
similarity index 99%
rename from assets/articles_basic_color_convert.md.8302e80d.js
rename to assets/articles_basic_color_convert.md.2cce2798.js
index ca22a38..981827d 100644
--- a/assets/articles_basic_color_convert.md.8302e80d.js
+++ b/assets/articles_basic_color_convert.md.2cce2798.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const D=JSON.parse('{"title":"颜色值变换","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/color_convert.md","filePath":"articles/basic/color_convert.md","lastUpdated":1671437626000}'),p={name:"articles/basic/color_convert.md"},o=l(`<h1 id="颜色值变换" tabindex="-1">颜色值变换 <a class="header-anchor" href="#颜色值变换" aria-label="Permalink to &quot;颜色值变换&quot;">​</a></h1><h2 id="十六进制转换成-rgb" tabindex="-1">十六进制转换成 RGB <a class="header-anchor" href="#十六进制转换成-rgb" aria-label="Permalink to &quot;十六进制转换成 RGB&quot;">​</a></h2><ul><li>hex to rgb</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// hex to rgb</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const D=JSON.parse('{"title":"颜色值变换","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/color_convert.md","filePath":"articles/basic/color_convert.md","lastUpdated":1671437626000}'),p={name:"articles/basic/color_convert.md"},o=l(`<h1 id="颜色值变换" tabindex="-1">颜色值变换 <a class="header-anchor" href="#颜色值变换" aria-label="Permalink to &quot;颜色值变换&quot;">​</a></h1><h2 id="十六进制转换成-rgb" tabindex="-1">十六进制转换成 RGB <a class="header-anchor" href="#十六进制转换成-rgb" aria-label="Permalink to &quot;十六进制转换成 RGB&quot;">​</a></h2><ul><li>hex to rgb</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// hex to rgb</span></span>
 <span class="line"><span style="color:#6A737D;">// hex 形式是 3位 4位 6位</span></span>
 <span class="line"><span style="color:#6A737D;">// hex 多少位补位规则 === chrome css</span></span>
 <span class="line"><span style="color:#6A737D;">// 3位 #efd = #eeffdd</span></span>
diff --git a/assets/articles_basic_color_convert.md.8302e80d.lean.js b/assets/articles_basic_color_convert.md.2cce2798.lean.js
similarity index 72%
rename from assets/articles_basic_color_convert.md.8302e80d.lean.js
rename to assets/articles_basic_color_convert.md.2cce2798.lean.js
index b5b519f..b42457d 100644
--- a/assets/articles_basic_color_convert.md.8302e80d.lean.js
+++ b/assets/articles_basic_color_convert.md.2cce2798.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const D=JSON.parse('{"title":"颜色值变换","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/color_convert.md","filePath":"articles/basic/color_convert.md","lastUpdated":1671437626000}'),p={name:"articles/basic/color_convert.md"},o=l("",15),e=[o];function c(r,t,E,y,F,i){return n(),a("div",null,e)}const C=s(p,[["render",c]]);export{D as __pageData,C as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const D=JSON.parse('{"title":"颜色值变换","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/color_convert.md","filePath":"articles/basic/color_convert.md","lastUpdated":1671437626000}'),p={name:"articles/basic/color_convert.md"},o=l("",15),e=[o];function c(r,t,E,y,F,i){return n(),a("div",null,e)}const C=s(p,[["render",c]]);export{D as __pageData,C as default};
diff --git a/assets/articles_basic_dom_events.md.6bad1c68.js b/assets/articles_basic_dom_events.md.70d1d757.js
similarity index 99%
rename from assets/articles_basic_dom_events.md.6bad1c68.js
rename to assets/articles_basic_dom_events.md.70d1d757.js
index 570dccd..85e604f 100644
--- a/assets/articles_basic_dom_events.md.6bad1c68.js
+++ b/assets/articles_basic_dom_events.md.70d1d757.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"DOM BOM 事件流","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/dom_events.md","filePath":"articles/basic/dom_events.md","lastUpdated":1670330848000}'),e={name:"articles/basic/dom_events.md"},o=n(`<h1 id="dom-bom-事件流" tabindex="-1">DOM BOM 事件流 <a class="header-anchor" href="#dom-bom-事件流" aria-label="Permalink to &quot;DOM BOM 事件流&quot;">​</a></h1><p>兼容性：IE9、Opera、Firefox、Chrome 和 Safari 支持 DOM 事件流</p><h2 id="事件冒泡" tabindex="-1">事件冒泡 <a class="header-anchor" href="#事件冒泡" aria-label="Permalink to &quot;事件冒泡&quot;">​</a></h2><p>事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，逐级向上传播到较为不具体的节点（文档 document）</p><h2 id="事件捕获" tabindex="-1">事件捕获 <a class="header-anchor" href="#事件捕获" aria-label="Permalink to &quot;事件捕获&quot;">​</a></h2><p>document 文档接收到事件，然后逐级向下传播的到最具体元素接收事件</p><h2 id="事件处理程序" tabindex="-1">事件处理程序 <a class="header-anchor" href="#事件处理程序" aria-label="Permalink to &quot;事件处理程序&quot;">​</a></h2><h3 id="html-事件处理程序" tabindex="-1">HTML 事件处理程序 <a class="header-anchor" href="#html-事件处理程序" aria-label="Permalink to &quot;HTML 事件处理程序&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">onclick</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;</span><span style="color:#B392F0;">alert</span><span style="color:#9ECBFF;">(&#39;HELLO&#39;)&quot;</span><span style="color:#E1E4E8;">&gt;&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">div</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">onclick</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;</span><span style="color:#6F42C1;">alert</span><span style="color:#032F62;">(&#39;HELLO&#39;)&quot;</span><span style="color:#24292E;">&gt;&lt;</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h3 id="dom0-级事件处理程序" tabindex="-1">DOM0 级事件处理程序 <a class="header-anchor" href="#dom0-级事件处理程序" aria-label="Permalink to &quot;DOM0 级事件处理程序&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// &lt;div id=&quot;app&quot;&gt;&lt;/div&gt;</span></span>
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"DOM BOM 事件流","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/dom_events.md","filePath":"articles/basic/dom_events.md","lastUpdated":1670330848000}'),e={name:"articles/basic/dom_events.md"},o=n(`<h1 id="dom-bom-事件流" tabindex="-1">DOM BOM 事件流 <a class="header-anchor" href="#dom-bom-事件流" aria-label="Permalink to &quot;DOM BOM 事件流&quot;">​</a></h1><p>兼容性：IE9、Opera、Firefox、Chrome 和 Safari 支持 DOM 事件流</p><h2 id="事件冒泡" tabindex="-1">事件冒泡 <a class="header-anchor" href="#事件冒泡" aria-label="Permalink to &quot;事件冒泡&quot;">​</a></h2><p>事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，逐级向上传播到较为不具体的节点（文档 document）</p><h2 id="事件捕获" tabindex="-1">事件捕获 <a class="header-anchor" href="#事件捕获" aria-label="Permalink to &quot;事件捕获&quot;">​</a></h2><p>document 文档接收到事件，然后逐级向下传播的到最具体元素接收事件</p><h2 id="事件处理程序" tabindex="-1">事件处理程序 <a class="header-anchor" href="#事件处理程序" aria-label="Permalink to &quot;事件处理程序&quot;">​</a></h2><h3 id="html-事件处理程序" tabindex="-1">HTML 事件处理程序 <a class="header-anchor" href="#html-事件处理程序" aria-label="Permalink to &quot;HTML 事件处理程序&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">onclick</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;</span><span style="color:#B392F0;">alert</span><span style="color:#9ECBFF;">(&#39;HELLO&#39;)&quot;</span><span style="color:#E1E4E8;">&gt;&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">div</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">onclick</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;</span><span style="color:#6F42C1;">alert</span><span style="color:#032F62;">(&#39;HELLO&#39;)&quot;</span><span style="color:#24292E;">&gt;&lt;</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">div</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h3 id="dom0-级事件处理程序" tabindex="-1">DOM0 级事件处理程序 <a class="header-anchor" href="#dom0-级事件处理程序" aria-label="Permalink to &quot;DOM0 级事件处理程序&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// &lt;div id=&quot;app&quot;&gt;&lt;/div&gt;</span></span>
 <span class="line"><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">app</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> document.</span><span style="color:#B392F0;">getElementById</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;app&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">app.</span><span style="color:#B392F0;">onclick</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">alert</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;HELLO&#39;</span><span style="color:#E1E4E8;">);</span></span>
diff --git a/assets/articles_basic_dom_events.md.6bad1c68.lean.js b/assets/articles_basic_dom_events.md.70d1d757.lean.js
similarity index 72%
rename from assets/articles_basic_dom_events.md.6bad1c68.lean.js
rename to assets/articles_basic_dom_events.md.70d1d757.lean.js
index fbed89e..2d54d7f 100644
--- a/assets/articles_basic_dom_events.md.6bad1c68.lean.js
+++ b/assets/articles_basic_dom_events.md.70d1d757.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"DOM BOM 事件流","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/dom_events.md","filePath":"articles/basic/dom_events.md","lastUpdated":1670330848000}'),e={name:"articles/basic/dom_events.md"},o=n("",108),t=[o];function p(c,r,i,d,E,y){return a(),l("div",null,t)}const m=s(e,[["render",p]]);export{h as __pageData,m as default};
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"DOM BOM 事件流","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/dom_events.md","filePath":"articles/basic/dom_events.md","lastUpdated":1670330848000}'),e={name:"articles/basic/dom_events.md"},o=n("",108),t=[o];function p(c,r,i,d,E,y){return a(),l("div",null,t)}const m=s(e,[["render",p]]);export{h as __pageData,m as default};
diff --git a/assets/articles_basic_eslint.md.8aa0db41.js b/assets/articles_basic_eslint.md.bea7edfe.js
similarity index 99%
rename from assets/articles_basic_eslint.md.8aa0db41.js
rename to assets/articles_basic_eslint.md.bea7edfe.js
index ecf4ec7..099c9bc 100644
--- a/assets/articles_basic_eslint.md.8aa0db41.js
+++ b/assets/articles_basic_eslint.md.bea7edfe.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const C=JSON.parse('{"title":"ESLint","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/eslint.md","filePath":"articles/basic/eslint.md","lastUpdated":1670330848000}'),p={name:"articles/basic/eslint.md"},o=l(`<h1 id="eslint" tabindex="-1">ESLint <a class="header-anchor" href="#eslint" aria-label="Permalink to &quot;ESLint&quot;">​</a></h1><blockquote><p>eslint优化完善项目代码</p></blockquote><h2 id="配置" tabindex="-1">配置 <a class="header-anchor" href="#配置" aria-label="Permalink to &quot;配置&quot;">​</a></h2><ul><li>注释 /* */</li><li>配置文件 ./eslintrc.* 或者在package.json中配置eslintConfig</li><li>其他 environment/globals/rules</li></ul><h2 id="指定解析选项" tabindex="-1">指定解析选项 <a class="header-anchor" href="#指定解析选项" aria-label="Permalink to &quot;指定解析选项&quot;">​</a></h2><ul><li>ecmaVersion: 2 | 3 | 4 | 5 | 6 =&gt; (3, 5 默认值) =&gt; Number[] | String</li><li>sourceType: &#39;script&#39;(默认值) | &#39;module&#39;</li><li>ecmaFeatures: &#39;globalReturn&#39;(允许全局使用return语句) | &#39;impliedStrict&#39;(严格模式) | &#39;jsx&#39; =&gt; Boolean</li></ul><h2 id="指定解析" tabindex="-1">指定解析 <a class="header-anchor" href="#指定解析" aria-label="Permalink to &quot;指定解析&quot;">​</a></h2><ul><li>parser: &#39;esprima&#39;(默认值) | &#39;babel-eslint&#39; | &#39;@typescript-eslint/parser&#39; | &#39;自定义解析&#39;</li></ul><h2 id="指定预处理器-processor" tabindex="-1">指定预处理器 processor <a class="header-anchor" href="#指定预处理器-processor" aria-label="Permalink to &quot;指定预处理器 processor&quot;">​</a></h2><p>覆盖指定文件配置 overrides</p><div class="language-json vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">{</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const C=JSON.parse('{"title":"ESLint","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/eslint.md","filePath":"articles/basic/eslint.md","lastUpdated":1670330848000}'),p={name:"articles/basic/eslint.md"},o=l(`<h1 id="eslint" tabindex="-1">ESLint <a class="header-anchor" href="#eslint" aria-label="Permalink to &quot;ESLint&quot;">​</a></h1><blockquote><p>eslint优化完善项目代码</p></blockquote><h2 id="配置" tabindex="-1">配置 <a class="header-anchor" href="#配置" aria-label="Permalink to &quot;配置&quot;">​</a></h2><ul><li>注释 /* */</li><li>配置文件 ./eslintrc.* 或者在package.json中配置eslintConfig</li><li>其他 environment/globals/rules</li></ul><h2 id="指定解析选项" tabindex="-1">指定解析选项 <a class="header-anchor" href="#指定解析选项" aria-label="Permalink to &quot;指定解析选项&quot;">​</a></h2><ul><li>ecmaVersion: 2 | 3 | 4 | 5 | 6 =&gt; (3, 5 默认值) =&gt; Number[] | String</li><li>sourceType: &#39;script&#39;(默认值) | &#39;module&#39;</li><li>ecmaFeatures: &#39;globalReturn&#39;(允许全局使用return语句) | &#39;impliedStrict&#39;(严格模式) | &#39;jsx&#39; =&gt; Boolean</li></ul><h2 id="指定解析" tabindex="-1">指定解析 <a class="header-anchor" href="#指定解析" aria-label="Permalink to &quot;指定解析&quot;">​</a></h2><ul><li>parser: &#39;esprima&#39;(默认值) | &#39;babel-eslint&#39; | &#39;@typescript-eslint/parser&#39; | &#39;自定义解析&#39;</li></ul><h2 id="指定预处理器-processor" tabindex="-1">指定预处理器 processor <a class="header-anchor" href="#指定预处理器-processor" aria-label="Permalink to &quot;指定预处理器 processor&quot;">​</a></h2><p>覆盖指定文件配置 overrides</p><div class="language-json vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">json</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">{</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#79B8FF;">&quot;plugins&quot;</span><span style="color:#E1E4E8;">: [</span><span style="color:#9ECBFF;">&quot;a-plugin&quot;</span><span style="color:#E1E4E8;">],</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#79B8FF;">&quot;processor&quot;</span><span style="color:#E1E4E8;">: </span><span style="color:#9ECBFF;">&quot;a-plugin/a-processor&quot;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span>
diff --git a/assets/articles_basic_eslint.md.8aa0db41.lean.js b/assets/articles_basic_eslint.md.bea7edfe.lean.js
similarity index 70%
rename from assets/articles_basic_eslint.md.8aa0db41.lean.js
rename to assets/articles_basic_eslint.md.bea7edfe.lean.js
index ab53057..2ec8dd1 100644
--- a/assets/articles_basic_eslint.md.8aa0db41.lean.js
+++ b/assets/articles_basic_eslint.md.bea7edfe.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const C=JSON.parse('{"title":"ESLint","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/eslint.md","filePath":"articles/basic/eslint.md","lastUpdated":1670330848000}'),p={name:"articles/basic/eslint.md"},o=l("",45),e=[o];function t(c,r,E,y,i,F){return n(),a("div",null,e)}const d=s(p,[["render",t]]);export{C as __pageData,d as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const C=JSON.parse('{"title":"ESLint","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/eslint.md","filePath":"articles/basic/eslint.md","lastUpdated":1670330848000}'),p={name:"articles/basic/eslint.md"},o=l("",45),e=[o];function t(c,r,E,y,i,F){return n(),a("div",null,e)}const d=s(p,[["render",t]]);export{C as __pageData,d as default};
diff --git a/assets/articles_basic_git.md.abbfc6c6.js b/assets/articles_basic_git.md.8f01f6d4.js
similarity index 99%
rename from assets/articles_basic_git.md.abbfc6c6.js
rename to assets/articles_basic_git.md.8f01f6d4.js
index 6963f7d..704a1a8 100644
--- a/assets/articles_basic_git.md.abbfc6c6.js
+++ b/assets/articles_basic_git.md.8f01f6d4.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as l,Q as o}from"./chunks/framework.7c0fadea.js";const g=JSON.parse('{"title":"GIT","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/git.md","filePath":"articles/basic/git.md","lastUpdated":1670330848000}'),n={name:"articles/basic/git.md"},p=o(`<h1 id="git" tabindex="-1">GIT <a class="header-anchor" href="#git" aria-label="Permalink to &quot;GIT&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">GIT CMD</p><p>GIT 命令</p></div><h2 id="git-rebase" tabindex="-1">git rebase <a class="header-anchor" href="#git-rebase" aria-label="Permalink to &quot;git rebase&quot;">​</a></h2><p><code>重新 commit 依赖的上游 top 分支</code></p><h3 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h3><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">rebase</span><span style="color:#E1E4E8;"> [-i </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--interactive][&lt;options&gt;]</span><span style="color:#E1E4E8;"> [--exec </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">cm</span><span style="color:#E1E4E8;">d</span><span style="color:#F97583;">&gt;</span><span style="color:#9ECBFF;">][--onto</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">newbas</span><span style="color:#E1E4E8;">e</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--keep-base]</span><span style="color:#E1E4E8;"> [&lt;upstream&gt; [&lt;branch&gt;]]</span></span>
+import{_ as s,o as a,c as l,Q as o}from"./chunks/framework.0e8ae64e.js";const g=JSON.parse('{"title":"GIT","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/git.md","filePath":"articles/basic/git.md","lastUpdated":1670330848000}'),n={name:"articles/basic/git.md"},p=o(`<h1 id="git" tabindex="-1">GIT <a class="header-anchor" href="#git" aria-label="Permalink to &quot;GIT&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">GIT CMD</p><p>GIT 命令</p></div><h2 id="git-rebase" tabindex="-1">git rebase <a class="header-anchor" href="#git-rebase" aria-label="Permalink to &quot;git rebase&quot;">​</a></h2><p><code>重新 commit 依赖的上游 top 分支</code></p><h3 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h3><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">rebase</span><span style="color:#E1E4E8;"> [-i </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--interactive][&lt;options&gt;]</span><span style="color:#E1E4E8;"> [--exec </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">cm</span><span style="color:#E1E4E8;">d</span><span style="color:#F97583;">&gt;</span><span style="color:#9ECBFF;">][--onto</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">newbas</span><span style="color:#E1E4E8;">e</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--keep-base]</span><span style="color:#E1E4E8;"> [&lt;upstream&gt; [&lt;branch&gt;]]</span></span>
 <span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">rebase</span><span style="color:#E1E4E8;"> [-i </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--interactive][&lt;options&gt;]</span><span style="color:#E1E4E8;"> [--exec </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">cm</span><span style="color:#E1E4E8;">d</span><span style="color:#F97583;">&gt;</span><span style="color:#9ECBFF;">][--onto</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">newbas</span><span style="color:#E1E4E8;">e</span><span style="color:#F97583;">&gt;</span><span style="color:#9ECBFF;">]</span></span>
 <span class="line"><span style="color:#B392F0;">--root</span><span style="color:#E1E4E8;"> [&lt;branch&gt;]</span></span>
 <span class="line"><span style="color:#B392F0;">git</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">rebase</span><span style="color:#E1E4E8;"> (--continue </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--skip</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--abort</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--quit</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--edit-todo</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">|</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">--show-current-patch</span><span style="color:#E1E4E8;">)</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">git</span><span style="color:#24292E;"> </span><span style="color:#032F62;">rebase</span><span style="color:#24292E;"> [-i </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--interactive][&lt;options&gt;]</span><span style="color:#24292E;"> [--exec </span><span style="color:#D73A49;">&lt;</span><span style="color:#032F62;">cm</span><span style="color:#24292E;">d</span><span style="color:#D73A49;">&gt;</span><span style="color:#032F62;">][--onto</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">&lt;</span><span style="color:#032F62;">newbas</span><span style="color:#24292E;">e</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">|</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">--keep-base]</span><span style="color:#24292E;"> [&lt;upstream&gt; [&lt;branch&gt;]]</span></span>
diff --git a/assets/articles_basic_git.md.abbfc6c6.lean.js b/assets/articles_basic_git.md.8f01f6d4.lean.js
similarity index 69%
rename from assets/articles_basic_git.md.abbfc6c6.lean.js
rename to assets/articles_basic_git.md.8f01f6d4.lean.js
index 8d11c6b..249a1a5 100644
--- a/assets/articles_basic_git.md.abbfc6c6.lean.js
+++ b/assets/articles_basic_git.md.8f01f6d4.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as l,Q as o}from"./chunks/framework.7c0fadea.js";const g=JSON.parse('{"title":"GIT","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/git.md","filePath":"articles/basic/git.md","lastUpdated":1670330848000}'),n={name:"articles/basic/git.md"},p=o("",31),e=[p];function t(r,c,y,E,i,F){return a(),l("div",null,e)}const d=s(n,[["render",t]]);export{g as __pageData,d as default};
+import{_ as s,o as a,c as l,Q as o}from"./chunks/framework.0e8ae64e.js";const g=JSON.parse('{"title":"GIT","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/git.md","filePath":"articles/basic/git.md","lastUpdated":1670330848000}'),n={name:"articles/basic/git.md"},p=o("",31),e=[p];function t(r,c,y,E,i,F){return a(),l("div",null,e)}const d=s(n,[["render",t]]);export{g as __pageData,d as default};
diff --git a/assets/articles_basic_history.md.4e7d878f.js b/assets/articles_basic_history.md.bb6472e8.js
similarity index 98%
rename from assets/articles_basic_history.md.4e7d878f.js
rename to assets/articles_basic_history.md.bb6472e8.js
index af3d44e..6fd08b2 100644
--- a/assets/articles_basic_history.md.4e7d878f.js
+++ b/assets/articles_basic_history.md.bb6472e8.js
@@ -1,4 +1,4 @@
-import{_ as l,o as s,c as o,Q as a}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"History API","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/history.md","filePath":"articles/basic/history.md","lastUpdated":1670330848000}'),n={name:"articles/basic/history.md"},t=a(`<h1 id="history-api" tabindex="-1">History API <a class="header-anchor" href="#history-api" aria-label="Permalink to &quot;History API&quot;">​</a></h1><h2 id="window-history" tabindex="-1">window.history <a class="header-anchor" href="#window-history" aria-label="Permalink to &quot;window.history&quot;">​</a></h2><ul><li>back Function 后退一页</li><li>forward Function 前进一页</li><li>go Function(Number) | String)</li></ul><ol><li>负数 history.go(-1) 后退一页</li><li>正数 history.go(2) 前进两页</li><li>参数为字符串时，跳到最近的页面（可能后退也可能前进）history.go(&#39;google.com&#39;);</li></ol><ul><li>pushState Function</li></ul><ol><li>接收三个参数：状态对象、新状态的标题（浏览器暂未实现）、相对地址 url</li><li>会创建新的历史状态</li></ol><ul><li>replaceState Function</li></ul><ol><li>接收三个参数：状态对象、新状态的标题（浏览器暂未实现）、相对地址 url</li><li>更新当前页面的历史状态，不会计入历史状态</li></ol><blockquote><p>手动调用 pushState，window history 对象每切换不同的页面长度(前进后退) length + 1，replaceState 则不会</p></blockquote><ul><li>state</li></ul><p><code>页面的 history 状态，可以使用 history.state 获取，设置 state 为调用 pushState, replaceState 的第一个参数状态对象</code></p><ul><li>scrollRestoration</li></ul><ol><li>允许 web 应用在历史记录导航上设置默认滚动行为</li><li>取值：auto manual 默认值为 auto</li></ol><h2 id="browser-浏览器路由" tabindex="-1">Browser 浏览器路由 <a class="header-anchor" href="#browser-浏览器路由" aria-label="Permalink to &quot;Browser 浏览器路由&quot;">​</a></h2><p><code>单页应用，浏览器路由需要配合服务端配置</code></p><ul><li>nginx</li></ul><div class="language-nginx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">nginx</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">location</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">/ </span><span style="color:#E1E4E8;">{</span></span>
+import{_ as l,o as s,c as o,Q as a}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"History API","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/history.md","filePath":"articles/basic/history.md","lastUpdated":1670330848000}'),n={name:"articles/basic/history.md"},t=a(`<h1 id="history-api" tabindex="-1">History API <a class="header-anchor" href="#history-api" aria-label="Permalink to &quot;History API&quot;">​</a></h1><h2 id="window-history" tabindex="-1">window.history <a class="header-anchor" href="#window-history" aria-label="Permalink to &quot;window.history&quot;">​</a></h2><ul><li>back Function 后退一页</li><li>forward Function 前进一页</li><li>go Function(Number) | String)</li></ul><ol><li>负数 history.go(-1) 后退一页</li><li>正数 history.go(2) 前进两页</li><li>参数为字符串时，跳到最近的页面（可能后退也可能前进）history.go(&#39;google.com&#39;);</li></ol><ul><li>pushState Function</li></ul><ol><li>接收三个参数：状态对象、新状态的标题（浏览器暂未实现）、相对地址 url</li><li>会创建新的历史状态</li></ol><ul><li>replaceState Function</li></ul><ol><li>接收三个参数：状态对象、新状态的标题（浏览器暂未实现）、相对地址 url</li><li>更新当前页面的历史状态，不会计入历史状态</li></ol><blockquote><p>手动调用 pushState，window history 对象每切换不同的页面长度(前进后退) length + 1，replaceState 则不会</p></blockquote><ul><li>state</li></ul><p><code>页面的 history 状态，可以使用 history.state 获取，设置 state 为调用 pushState, replaceState 的第一个参数状态对象</code></p><ul><li>scrollRestoration</li></ul><ol><li>允许 web 应用在历史记录导航上设置默认滚动行为</li><li>取值：auto manual 默认值为 auto</li></ol><h2 id="browser-浏览器路由" tabindex="-1">Browser 浏览器路由 <a class="header-anchor" href="#browser-浏览器路由" aria-label="Permalink to &quot;Browser 浏览器路由&quot;">​</a></h2><p><code>单页应用，浏览器路由需要配合服务端配置</code></p><ul><li>nginx</li></ul><div class="language-nginx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">nginx</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">location</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">/ </span><span style="color:#E1E4E8;">{</span></span>
 <span class="line"><span style="color:#E1E4E8;">   </span><span style="color:#F97583;"> try_files </span><span style="color:#E1E4E8;">$uri $uri/ /index.html;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">location</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">/ </span><span style="color:#24292E;">{</span></span>
 <span class="line"><span style="color:#24292E;">   </span><span style="color:#D73A49;"> try_files </span><span style="color:#24292E;">$uri $uri/ /index.html;</span></span>
diff --git a/assets/articles_basic_history.md.4e7d878f.lean.js b/assets/articles_basic_history.md.bb6472e8.lean.js
similarity index 71%
rename from assets/articles_basic_history.md.4e7d878f.lean.js
rename to assets/articles_basic_history.md.bb6472e8.lean.js
index aba3a65..46665a3 100644
--- a/assets/articles_basic_history.md.4e7d878f.lean.js
+++ b/assets/articles_basic_history.md.bb6472e8.lean.js
@@ -1 +1 @@
-import{_ as l,o as s,c as o,Q as a}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"History API","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/history.md","filePath":"articles/basic/history.md","lastUpdated":1670330848000}'),n={name:"articles/basic/history.md"},t=a("",40),e=[t];function i(p,c,r,h,d,u){return s(),o("div",null,e)}const g=l(n,[["render",i]]);export{E as __pageData,g as default};
+import{_ as l,o as s,c as o,Q as a}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"History API","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/history.md","filePath":"articles/basic/history.md","lastUpdated":1670330848000}'),n={name:"articles/basic/history.md"},t=a("",40),e=[t];function i(p,c,r,h,d,u){return s(),o("div",null,e)}const g=l(n,[["render",i]]);export{E as __pageData,g as default};
diff --git a/assets/articles_basic_ieee.md.f4f18348.js b/assets/articles_basic_ieee.md.04dcfb91.js
similarity index 98%
rename from assets/articles_basic_ieee.md.f4f18348.js
rename to assets/articles_basic_ieee.md.04dcfb91.js
index 84f538a..382825d 100644
--- a/assets/articles_basic_ieee.md.f4f18348.js
+++ b/assets/articles_basic_ieee.md.04dcfb91.js
@@ -1,4 +1,4 @@
-import{_ as a,o as e,c as t,Q as l}from"./chunks/framework.7c0fadea.js";const q=JSON.parse('{"title":"IEEE 754","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/ieee.md","filePath":"articles/basic/ieee.md","lastUpdated":1701138872000}'),o={name:"articles/basic/ieee.md"},d=l(`<h1 id="ieee-754" tabindex="-1">IEEE 754 <a class="header-anchor" href="#ieee-754" aria-label="Permalink to &quot;IEEE 754&quot;">​</a></h1><blockquote><p>现代计算机中的浮点</p></blockquote><h2 id="基本格式" tabindex="-1">基本格式 <a class="header-anchor" href="#基本格式" aria-label="Permalink to &quot;基本格式&quot;">​</a></h2><h3 id="单精度" tabindex="-1">单精度 <a class="header-anchor" href="#单精度" aria-label="Permalink to &quot;单精度&quot;">​</a></h3><p>占用 32 位（4 字节）的二进制格式，其有效数字为 24 位（约 7 个十进制数）的精度</p><h3 id="双精度" tabindex="-1">双精度 <a class="header-anchor" href="#双精度" aria-label="Permalink to &quot;双精度&quot;">​</a></h3><p>占用 64 位（8 字节）的二进制格式，其有效数字为 53 位（约 15 - 17 个十进制数）的精度</p><h3 id="双重扩展" tabindex="-1">双重扩展 <a class="header-anchor" href="#双重扩展" aria-label="Permalink to &quot;双重扩展&quot;">​</a></h3><p>二进制格式至少占用 79 位（约 19 个十进制数）的精度</p><h3 id="四倍精度" tabindex="-1">四倍精度 <a class="header-anchor" href="#四倍精度" aria-label="Permalink to &quot;四倍精度&quot;">​</a></h3><p>128 位（16 字节）的二进制格式（约 34 个十进制数）的精度</p><h3 id="decimal64-decimal128" tabindex="-1">Decimal64 decimal128 <a class="header-anchor" href="#decimal64-decimal128" aria-label="Permalink to &quot;Decimal64 decimal128&quot;">​</a></h3><p>十进制舍入</p><h3 id="半精度" tabindex="-1">半精度 <a class="header-anchor" href="#半精度" aria-label="Permalink to &quot;半精度&quot;">​</a></h3><p>binary16 16 位浮点值</p><h2 id="浮点数范围" tabindex="-1">浮点数范围 <a class="header-anchor" href="#浮点数范围" aria-label="Permalink to &quot;浮点数范围&quot;">​</a></h2><blockquote><p>64 位双精度 = 具有 53 位（包含一个隐含位）1 个符号位 11 个指数位的系数（指数可以表示的数 2^-1022 ≈ 2×10^-308 - 2^1024 ≈ 2 x 10^308)</p></blockquote><h3 id="字节序-endian" tabindex="-1">字节序（Endian） <a class="header-anchor" href="#字节序-endian" aria-label="Permalink to &quot;字节序（Endian）&quot;">​</a></h3><p>浮点数以大字节序形式表示，整数以小字节序表示</p><h3 id="整数值的精度限制" tabindex="-1">整数值的精度限制 <a class="header-anchor" href="#整数值的精度限制" aria-label="Permalink to &quot;整数值的精度限制&quot;">​</a></h3><ul><li>可以精确表示从-2^53 到 2^53（−9007199254740992 到 9007199254740992）的整数</li><li>2^53 和 2^54 之间的整数= 18014398509481984，取整为 2 的倍数（偶数）</li><li>2^54 和 2^55 之间的整数= 36028797018963968 舍入为 4 的倍数</li></ul><h2 id="内部表示" tabindex="-1">内部表示 <a class="header-anchor" href="#内部表示" aria-label="Permalink to &quot;内部表示&quot;">​</a></h2><table><thead><tr><th>类型</th><th>标志</th><th>指数</th><th>有效域</th><th>总位数</th><th>指数偏差</th><th>位精度</th><th>小数位数</th></tr></thead><tbody><tr><td>16（IEEE 754-2008）</td><td>1 个</td><td>5</td><td>10</td><td>16</td><td>15</td><td>11</td><td>〜3.3</td></tr><tr><td>32</td><td>1 个</td><td>8</td><td>23</td><td>32</td><td>127</td><td>24</td><td>〜7.2</td></tr><tr><td>64</td><td>1 个</td><td>11</td><td>52</td><td>64</td><td>1023</td><td>53</td><td>〜15.9</td></tr><tr><td>x86</td><td>1 个</td><td>15</td><td>64</td><td>80</td><td>16383</td><td>64</td><td>〜19.2</td></tr><tr><td>128</td><td>1 个</td><td>15</td><td>112</td><td>128</td><td>16383</td><td>113</td><td>〜34.0</td></tr></tbody></table><h2 id="javascript-数表示" tabindex="-1">JavaScript 数表示 <a class="header-anchor" href="#javascript-数表示" aria-label="Permalink to &quot;JavaScript 数表示&quot;">​</a></h2><p><code>JavaScript</code> 中采用 <code>IEEE754 64</code> 位浮点数标准，<code>1</code> 位表示标志位，<code>11</code> 位指数位，<code>52</code> 位有效域（有效数字 <code>53</code> 位，包含一位隐含位）</p><h2 id="进制转换" tabindex="-1">进制转换 <a class="header-anchor" href="#进制转换" aria-label="Permalink to &quot;进制转换&quot;">​</a></h2><h3 id="二进制转换" tabindex="-1">二进制转换 <a class="header-anchor" href="#二进制转换" aria-label="Permalink to &quot;二进制转换&quot;">​</a></h3><h4 id="整数" tabindex="-1">整数 <a class="header-anchor" href="#整数" aria-label="Permalink to &quot;整数&quot;">​</a></h4><p>整数除余法</p><p>8 / 2 = 4 余 0 4 / 2 = 2 余 0 2 / 2 = 1 余 0</p><p>十进制 8 转换为二进制为 1000</p><h4 id="小数" tabindex="-1">小数 <a class="header-anchor" href="#小数" aria-label="Permalink to &quot;小数&quot;">​</a></h4><p>长乘法</p><p>0.1 _ 2 = 0.2 --- 0 0.2 _ 2 = 0.4 --- 0 0.4 _ 2 = 0.8 --- 0 0.8 _ 2 = 1.6 --- 1 0.6 _ 2 = 1.2 --- 1 0.2 _ 2 = 0.4 --- 0</p><p>依次类推</p><h3 id="十六进制转换" tabindex="-1">十六进制转换 <a class="header-anchor" href="#十六进制转换" aria-label="Permalink to &quot;十六进制转换&quot;">​</a></h3><p>二进制 -&gt; 十六进制 2 ^ 4 = 16</p><p>3A(16) = 00111010(2) E7(16) = 11100111(2)</p><h3 id="八进制转换" tabindex="-1">八进制转换 <a class="header-anchor" href="#八进制转换" aria-label="Permalink to &quot;八进制转换&quot;">​</a></h3><p>二进制 -&gt; 八进制 2 ^ 3 = 8</p><p>65(8) = 110101(2) 17(8) = 001111(2)</p><h2 id="计算机编码方式" tabindex="-1">计算机编码方式 <a class="header-anchor" href="#计算机编码方式" aria-label="Permalink to &quot;计算机编码方式&quot;">​</a></h2><div class="language-tip vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tip</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">带符号位的机器数对应的真正数值称为机器数的真值</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">带符号位的机器数对应的真正数值称为机器数的真值</span></span></code></pre></div><p>机器存储一个具体数字的编码方式</p><h3 id="原码" tabindex="-1">原码 <a class="header-anchor" href="#原码" aria-label="Permalink to &quot;原码&quot;">​</a></h3><p>符号位加上真值的绝对值，即用第一位表示符号，其余位表示值</p><h3 id="反码" tabindex="-1">反码 <a class="header-anchor" href="#反码" aria-label="Permalink to &quot;反码&quot;">​</a></h3><p>正数的反码是其本身，负数的反码是在其原码的基础上，符号位不变，其余各个位取反</p><blockquote><p>减法 存在两个编码问题</p></blockquote><h3 id="补码" tabindex="-1">补码 <a class="header-anchor" href="#补码" aria-label="Permalink to &quot;补码&quot;">​</a></h3><blockquote><p>解决了两个编码问题[+0] [-0] 扩充了负数的最小值，以8位二进制为例[10000000, 01111111] = [-128, 127]</p></blockquote><p>反码 + 1</p><blockquote><p>负数二进制可以用补码表示</p></blockquote><ul><li>补码具有两种表示形式：0：00000000（+0）和 11111111（-0）</li></ul><p>二进制十进制(+1)</p><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">    11111110 -1</span></span>
+import{_ as a,o as e,c as t,Q as l}from"./chunks/framework.0e8ae64e.js";const q=JSON.parse('{"title":"IEEE 754","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/ieee.md","filePath":"articles/basic/ieee.md","lastUpdated":1701138872000}'),o={name:"articles/basic/ieee.md"},d=l(`<h1 id="ieee-754" tabindex="-1">IEEE 754 <a class="header-anchor" href="#ieee-754" aria-label="Permalink to &quot;IEEE 754&quot;">​</a></h1><blockquote><p>现代计算机中的浮点</p></blockquote><h2 id="基本格式" tabindex="-1">基本格式 <a class="header-anchor" href="#基本格式" aria-label="Permalink to &quot;基本格式&quot;">​</a></h2><h3 id="单精度" tabindex="-1">单精度 <a class="header-anchor" href="#单精度" aria-label="Permalink to &quot;单精度&quot;">​</a></h3><p>占用 32 位（4 字节）的二进制格式，其有效数字为 24 位（约 7 个十进制数）的精度</p><h3 id="双精度" tabindex="-1">双精度 <a class="header-anchor" href="#双精度" aria-label="Permalink to &quot;双精度&quot;">​</a></h3><p>占用 64 位（8 字节）的二进制格式，其有效数字为 53 位（约 15 - 17 个十进制数）的精度</p><h3 id="双重扩展" tabindex="-1">双重扩展 <a class="header-anchor" href="#双重扩展" aria-label="Permalink to &quot;双重扩展&quot;">​</a></h3><p>二进制格式至少占用 79 位（约 19 个十进制数）的精度</p><h3 id="四倍精度" tabindex="-1">四倍精度 <a class="header-anchor" href="#四倍精度" aria-label="Permalink to &quot;四倍精度&quot;">​</a></h3><p>128 位（16 字节）的二进制格式（约 34 个十进制数）的精度</p><h3 id="decimal64-decimal128" tabindex="-1">Decimal64 decimal128 <a class="header-anchor" href="#decimal64-decimal128" aria-label="Permalink to &quot;Decimal64 decimal128&quot;">​</a></h3><p>十进制舍入</p><h3 id="半精度" tabindex="-1">半精度 <a class="header-anchor" href="#半精度" aria-label="Permalink to &quot;半精度&quot;">​</a></h3><p>binary16 16 位浮点值</p><h2 id="浮点数范围" tabindex="-1">浮点数范围 <a class="header-anchor" href="#浮点数范围" aria-label="Permalink to &quot;浮点数范围&quot;">​</a></h2><blockquote><p>64 位双精度 = 具有 53 位（包含一个隐含位）1 个符号位 11 个指数位的系数（指数可以表示的数 2^-1022 ≈ 2×10^-308 - 2^1024 ≈ 2 x 10^308)</p></blockquote><h3 id="字节序-endian" tabindex="-1">字节序（Endian） <a class="header-anchor" href="#字节序-endian" aria-label="Permalink to &quot;字节序（Endian）&quot;">​</a></h3><p>浮点数以大字节序形式表示，整数以小字节序表示</p><h3 id="整数值的精度限制" tabindex="-1">整数值的精度限制 <a class="header-anchor" href="#整数值的精度限制" aria-label="Permalink to &quot;整数值的精度限制&quot;">​</a></h3><ul><li>可以精确表示从-2^53 到 2^53（−9007199254740992 到 9007199254740992）的整数</li><li>2^53 和 2^54 之间的整数= 18014398509481984，取整为 2 的倍数（偶数）</li><li>2^54 和 2^55 之间的整数= 36028797018963968 舍入为 4 的倍数</li></ul><h2 id="内部表示" tabindex="-1">内部表示 <a class="header-anchor" href="#内部表示" aria-label="Permalink to &quot;内部表示&quot;">​</a></h2><table><thead><tr><th>类型</th><th>标志</th><th>指数</th><th>有效域</th><th>总位数</th><th>指数偏差</th><th>位精度</th><th>小数位数</th></tr></thead><tbody><tr><td>16（IEEE 754-2008）</td><td>1 个</td><td>5</td><td>10</td><td>16</td><td>15</td><td>11</td><td>〜3.3</td></tr><tr><td>32</td><td>1 个</td><td>8</td><td>23</td><td>32</td><td>127</td><td>24</td><td>〜7.2</td></tr><tr><td>64</td><td>1 个</td><td>11</td><td>52</td><td>64</td><td>1023</td><td>53</td><td>〜15.9</td></tr><tr><td>x86</td><td>1 个</td><td>15</td><td>64</td><td>80</td><td>16383</td><td>64</td><td>〜19.2</td></tr><tr><td>128</td><td>1 个</td><td>15</td><td>112</td><td>128</td><td>16383</td><td>113</td><td>〜34.0</td></tr></tbody></table><h2 id="javascript-数表示" tabindex="-1">JavaScript 数表示 <a class="header-anchor" href="#javascript-数表示" aria-label="Permalink to &quot;JavaScript 数表示&quot;">​</a></h2><p><code>JavaScript</code> 中采用 <code>IEEE754 64</code> 位浮点数标准，<code>1</code> 位表示标志位，<code>11</code> 位指数位，<code>52</code> 位有效域（有效数字 <code>53</code> 位，包含一位隐含位）</p><h2 id="进制转换" tabindex="-1">进制转换 <a class="header-anchor" href="#进制转换" aria-label="Permalink to &quot;进制转换&quot;">​</a></h2><h3 id="二进制转换" tabindex="-1">二进制转换 <a class="header-anchor" href="#二进制转换" aria-label="Permalink to &quot;二进制转换&quot;">​</a></h3><h4 id="整数" tabindex="-1">整数 <a class="header-anchor" href="#整数" aria-label="Permalink to &quot;整数&quot;">​</a></h4><p>整数除余法</p><p>8 / 2 = 4 余 0 4 / 2 = 2 余 0 2 / 2 = 1 余 0</p><p>十进制 8 转换为二进制为 1000</p><h4 id="小数" tabindex="-1">小数 <a class="header-anchor" href="#小数" aria-label="Permalink to &quot;小数&quot;">​</a></h4><p>长乘法</p><p>0.1 _ 2 = 0.2 --- 0 0.2 _ 2 = 0.4 --- 0 0.4 _ 2 = 0.8 --- 0 0.8 _ 2 = 1.6 --- 1 0.6 _ 2 = 1.2 --- 1 0.2 _ 2 = 0.4 --- 0</p><p>依次类推</p><h3 id="十六进制转换" tabindex="-1">十六进制转换 <a class="header-anchor" href="#十六进制转换" aria-label="Permalink to &quot;十六进制转换&quot;">​</a></h3><p>二进制 -&gt; 十六进制 2 ^ 4 = 16</p><p>3A(16) = 00111010(2) E7(16) = 11100111(2)</p><h3 id="八进制转换" tabindex="-1">八进制转换 <a class="header-anchor" href="#八进制转换" aria-label="Permalink to &quot;八进制转换&quot;">​</a></h3><p>二进制 -&gt; 八进制 2 ^ 3 = 8</p><p>65(8) = 110101(2) 17(8) = 001111(2)</p><h2 id="计算机编码方式" tabindex="-1">计算机编码方式 <a class="header-anchor" href="#计算机编码方式" aria-label="Permalink to &quot;计算机编码方式&quot;">​</a></h2><div class="language-tip vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">tip</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">带符号位的机器数对应的真正数值称为机器数的真值</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">带符号位的机器数对应的真正数值称为机器数的真值</span></span></code></pre></div><p>机器存储一个具体数字的编码方式</p><h3 id="原码" tabindex="-1">原码 <a class="header-anchor" href="#原码" aria-label="Permalink to &quot;原码&quot;">​</a></h3><p>符号位加上真值的绝对值，即用第一位表示符号，其余位表示值</p><h3 id="反码" tabindex="-1">反码 <a class="header-anchor" href="#反码" aria-label="Permalink to &quot;反码&quot;">​</a></h3><p>正数的反码是其本身，负数的反码是在其原码的基础上，符号位不变，其余各个位取反</p><blockquote><p>减法 存在两个编码问题</p></blockquote><h3 id="补码" tabindex="-1">补码 <a class="header-anchor" href="#补码" aria-label="Permalink to &quot;补码&quot;">​</a></h3><blockquote><p>解决了两个编码问题[+0] [-0] 扩充了负数的最小值，以8位二进制为例[10000000, 01111111] = [-128, 127]</p></blockquote><p>反码 + 1</p><blockquote><p>负数二进制可以用补码表示</p></blockquote><ul><li>补码具有两种表示形式：0：00000000（+0）和 11111111（-0）</li></ul><p>二进制十进制(+1)</p><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">    11111110 -1</span></span>
 <span class="line"><span style="color:#e1e4e8;">+   00000010 +2</span></span>
 <span class="line"><span style="color:#e1e4e8;">────────────</span></span>
 <span class="line"><span style="color:#e1e4e8;">    100000000 0 ← 不是正确的答案</span></span>
diff --git a/assets/articles_basic_ieee.md.f4f18348.lean.js b/assets/articles_basic_ieee.md.04dcfb91.lean.js
similarity index 70%
rename from assets/articles_basic_ieee.md.f4f18348.lean.js
rename to assets/articles_basic_ieee.md.04dcfb91.lean.js
index 619c673..a8a69c2 100644
--- a/assets/articles_basic_ieee.md.f4f18348.lean.js
+++ b/assets/articles_basic_ieee.md.04dcfb91.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as l}from"./chunks/framework.7c0fadea.js";const q=JSON.parse('{"title":"IEEE 754","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/ieee.md","filePath":"articles/basic/ieee.md","lastUpdated":1701138872000}'),o={name:"articles/basic/ieee.md"},d=l("",73),s=[d];function i(n,r,p,c,h,u){return e(),t("div",null,s)}const k=a(o,[["render",i]]);export{q as __pageData,k as default};
+import{_ as a,o as e,c as t,Q as l}from"./chunks/framework.0e8ae64e.js";const q=JSON.parse('{"title":"IEEE 754","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/ieee.md","filePath":"articles/basic/ieee.md","lastUpdated":1701138872000}'),o={name:"articles/basic/ieee.md"},d=l("",73),s=[d];function i(n,r,p,c,h,u){return e(),t("div",null,s)}const k=a(o,[["render",i]]);export{q as __pageData,k as default};
diff --git a/assets/articles_basic_module.md.e77ca7a2.js b/assets/articles_basic_module.md.67706ce5.js
similarity index 99%
rename from assets/articles_basic_module.md.e77ca7a2.js
rename to assets/articles_basic_module.md.67706ce5.js
index 600f97f..e2ee7cc 100644
--- a/assets/articles_basic_module.md.e77ca7a2.js
+++ b/assets/articles_basic_module.md.67706ce5.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const F=JSON.parse('{"title":"前端模块的演变","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/module.md","filePath":"articles/basic/module.md","lastUpdated":1670330848000}'),p={name:"articles/basic/module.md"},o=l(`<h1 id="前端模块的演变" tabindex="-1">前端模块的演变 <a class="header-anchor" href="#前端模块的演变" aria-label="Permalink to &quot;前端模块的演变&quot;">​</a></h1><blockquote><p>UMD AMD CommonJS ESM</p></blockquote><h2 id="umd" tabindex="-1">UMD <a class="header-anchor" href="#umd" aria-label="Permalink to &quot;UMD&quot;">​</a></h2><p>浏览器中直接运行</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 立即执行函数</span></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const F=JSON.parse('{"title":"前端模块的演变","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/module.md","filePath":"articles/basic/module.md","lastUpdated":1670330848000}'),p={name:"articles/basic/module.md"},o=l(`<h1 id="前端模块的演变" tabindex="-1">前端模块的演变 <a class="header-anchor" href="#前端模块的演变" aria-label="Permalink to &quot;前端模块的演变&quot;">​</a></h1><blockquote><p>UMD AMD CommonJS ESM</p></blockquote><h2 id="umd" tabindex="-1">UMD <a class="header-anchor" href="#umd" aria-label="Permalink to &quot;UMD&quot;">​</a></h2><p>浏览器中直接运行</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 立即执行函数</span></span>
 <span class="line"><span style="color:#E1E4E8;">(</span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">ctx</span><span style="color:#E1E4E8;">, </span><span style="color:#FFAB70;">factory</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">factory</span><span style="color:#E1E4E8;">();</span></span>
 <span class="line"><span style="color:#E1E4E8;">})(window, </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">ctx</span><span style="color:#E1E4E8;">) {</span></span>
diff --git a/assets/articles_basic_module.md.e77ca7a2.lean.js b/assets/articles_basic_module.md.67706ce5.lean.js
similarity index 71%
rename from assets/articles_basic_module.md.e77ca7a2.lean.js
rename to assets/articles_basic_module.md.67706ce5.lean.js
index b7dd386..d918350 100644
--- a/assets/articles_basic_module.md.e77ca7a2.lean.js
+++ b/assets/articles_basic_module.md.67706ce5.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const F=JSON.parse('{"title":"前端模块的演变","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/module.md","filePath":"articles/basic/module.md","lastUpdated":1670330848000}'),p={name:"articles/basic/module.md"},o=l("",30),e=[o];function c(t,r,y,E,i,d){return a(),n("div",null,e)}const h=s(p,[["render",c]]);export{F as __pageData,h as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const F=JSON.parse('{"title":"前端模块的演变","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/module.md","filePath":"articles/basic/module.md","lastUpdated":1670330848000}'),p={name:"articles/basic/module.md"},o=l("",30),e=[o];function c(t,r,y,E,i,d){return a(),n("div",null,e)}const h=s(p,[["render",c]]);export{F as __pageData,h as default};
diff --git a/assets/articles_basic_script_link.md.78aa867d.js b/assets/articles_basic_script_link.md.eb8f70cc.js
similarity index 92%
rename from assets/articles_basic_script_link.md.78aa867d.js
rename to assets/articles_basic_script_link.md.eb8f70cc.js
index de15894..be17856 100644
--- a/assets/articles_basic_script_link.md.78aa867d.js
+++ b/assets/articles_basic_script_link.md.eb8f70cc.js
@@ -1 +1 @@
-import{_ as e,o as a,c as i,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"Script Link 标签","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/script_link.md","filePath":"articles/basic/script_link.md","lastUpdated":1670330848000}'),o={name:"articles/basic/script_link.md"},t=r('<h1 id="script-link-标签" tabindex="-1">Script Link 标签 <a class="header-anchor" href="#script-link-标签" aria-label="Permalink to &quot;Script Link 标签&quot;">​</a></h1><p><code>defer async 只适用于外部脚本中</code></p><h2 id="defer" tabindex="-1">defer <a class="header-anchor" href="#defer" aria-label="Permalink to &quot;defer&quot;">​</a></h2><p><code>延迟脚本</code></p><p>兼容性：IE4、Firefox 3.5、Safari 5 和 Chrome</p><ol><li><p>多个延迟脚本按顺序执行，并先于 DOMContentLoaded 事件执行</p></li><li><p>现实当中，多个延迟脚本不一定会按照顺序执行，也不一定会在 DOMContentLoaded 事件执行，因此最好包含一个延迟脚本</p></li></ol><h2 id="async" tabindex="-1">async <a class="header-anchor" href="#async" aria-label="Permalink to &quot;async&quot;">​</a></h2><p><code>异步脚本</code></p><p>兼容性：Firefox 3.6、Safari 5 和 Chrome</p><ol><li><p>多个异步脚本先后顺序不一致执行，最好不要在此修改 dom 操作</p></li><li><p>异步脚本一定会在 load 事件之前执行，在 DOMContentLoaded 事件不一定之前还是之后</p></li></ol><h2 id="crossorigin" tabindex="-1">crossorigin <a class="header-anchor" href="#crossorigin" aria-label="Permalink to &quot;crossorigin&quot;">​</a></h2>',11),c=[t];function s(n,l,d,p,_,h){return a(),i("div",null,c)}const k=e(o,[["render",s]]);export{m as __pageData,k as default};
+import{_ as e,o as a,c as i,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"Script Link 标签","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/script_link.md","filePath":"articles/basic/script_link.md","lastUpdated":1670330848000}'),o={name:"articles/basic/script_link.md"},t=r('<h1 id="script-link-标签" tabindex="-1">Script Link 标签 <a class="header-anchor" href="#script-link-标签" aria-label="Permalink to &quot;Script Link 标签&quot;">​</a></h1><p><code>defer async 只适用于外部脚本中</code></p><h2 id="defer" tabindex="-1">defer <a class="header-anchor" href="#defer" aria-label="Permalink to &quot;defer&quot;">​</a></h2><p><code>延迟脚本</code></p><p>兼容性：IE4、Firefox 3.5、Safari 5 和 Chrome</p><ol><li><p>多个延迟脚本按顺序执行，并先于 DOMContentLoaded 事件执行</p></li><li><p>现实当中，多个延迟脚本不一定会按照顺序执行，也不一定会在 DOMContentLoaded 事件执行，因此最好包含一个延迟脚本</p></li></ol><h2 id="async" tabindex="-1">async <a class="header-anchor" href="#async" aria-label="Permalink to &quot;async&quot;">​</a></h2><p><code>异步脚本</code></p><p>兼容性：Firefox 3.6、Safari 5 和 Chrome</p><ol><li><p>多个异步脚本先后顺序不一致执行，最好不要在此修改 dom 操作</p></li><li><p>异步脚本一定会在 load 事件之前执行，在 DOMContentLoaded 事件不一定之前还是之后</p></li></ol><h2 id="crossorigin" tabindex="-1">crossorigin <a class="header-anchor" href="#crossorigin" aria-label="Permalink to &quot;crossorigin&quot;">​</a></h2>',11),c=[t];function s(n,l,d,p,_,h){return a(),i("div",null,c)}const k=e(o,[["render",s]]);export{m as __pageData,k as default};
diff --git a/assets/articles_basic_script_link.md.78aa867d.lean.js b/assets/articles_basic_script_link.md.eb8f70cc.lean.js
similarity index 72%
rename from assets/articles_basic_script_link.md.78aa867d.lean.js
rename to assets/articles_basic_script_link.md.eb8f70cc.lean.js
index 396d767..490aed3 100644
--- a/assets/articles_basic_script_link.md.78aa867d.lean.js
+++ b/assets/articles_basic_script_link.md.eb8f70cc.lean.js
@@ -1 +1 @@
-import{_ as e,o as a,c as i,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"Script Link 标签","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/script_link.md","filePath":"articles/basic/script_link.md","lastUpdated":1670330848000}'),o={name:"articles/basic/script_link.md"},t=r("",11),c=[t];function s(n,l,d,p,_,h){return a(),i("div",null,c)}const k=e(o,[["render",s]]);export{m as __pageData,k as default};
+import{_ as e,o as a,c as i,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"Script Link 标签","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/script_link.md","filePath":"articles/basic/script_link.md","lastUpdated":1670330848000}'),o={name:"articles/basic/script_link.md"},t=r("",11),c=[t];function s(n,l,d,p,_,h){return a(),i("div",null,c)}const k=e(o,[["render",s]]);export{m as __pageData,k as default};
diff --git a/assets/articles_basic_syslink.md.ba8c5ece.js b/assets/articles_basic_syslink.md.8ff4f41d.js
similarity index 98%
rename from assets/articles_basic_syslink.md.ba8c5ece.js
rename to assets/articles_basic_syslink.md.8ff4f41d.js
index 03633da..4a7ebe5 100644
--- a/assets/articles_basic_syslink.md.ba8c5ece.js
+++ b/assets/articles_basic_syslink.md.8ff4f41d.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"Linux 链接","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/syslink.md","filePath":"articles/basic/syslink.md","lastUpdated":1670330848000}'),p={name:"articles/basic/syslink.md"},o=l(`<h1 id="linux-链接" tabindex="-1">Linux 链接 <a class="header-anchor" href="#linux-链接" aria-label="Permalink to &quot;Linux 链接&quot;">​</a></h1><p>Linux links</p><h2 id="soft-links" tabindex="-1">soft links <a class="header-anchor" href="#soft-links" aria-label="Permalink to &quot;soft links&quot;">​</a></h2><p>软链接，也称符号链接</p><h3 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h3><ul><li>在 Linux 系统中，软链接也被称为符号链接，是一种指向不同文件的特殊文件。在 Windows 系统中，可以视为快捷方式。</li><li>连接是逻辑连接，不是重复连接，可以指向整个目录或链接到远程计算机上的文件</li></ul><h3 id="工作" tabindex="-1">工作 <a class="header-anchor" href="#工作" aria-label="Permalink to &quot;工作&quot;">​</a></h3><p>举例说明</p><ol><li>创建文件 xx1(原始文件)，数据所在的位置</li><li>创建软链接 xx3，只指向 xx1 的名称，并不指向硬盘驱动器上的某个位置</li><li>删除原始文件，软链接将会无效</li></ol><h3 id="创建" tabindex="-1">创建 <a class="header-anchor" href="#创建" aria-label="Permalink to &quot;创建&quot;">​</a></h3><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">ls</span></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"Linux 链接","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/syslink.md","filePath":"articles/basic/syslink.md","lastUpdated":1670330848000}'),p={name:"articles/basic/syslink.md"},o=l(`<h1 id="linux-链接" tabindex="-1">Linux 链接 <a class="header-anchor" href="#linux-链接" aria-label="Permalink to &quot;Linux 链接&quot;">​</a></h1><p>Linux links</p><h2 id="soft-links" tabindex="-1">soft links <a class="header-anchor" href="#soft-links" aria-label="Permalink to &quot;soft links&quot;">​</a></h2><p>软链接，也称符号链接</p><h3 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h3><ul><li>在 Linux 系统中，软链接也被称为符号链接，是一种指向不同文件的特殊文件。在 Windows 系统中，可以视为快捷方式。</li><li>连接是逻辑连接，不是重复连接，可以指向整个目录或链接到远程计算机上的文件</li></ul><h3 id="工作" tabindex="-1">工作 <a class="header-anchor" href="#工作" aria-label="Permalink to &quot;工作&quot;">​</a></h3><p>举例说明</p><ol><li>创建文件 xx1(原始文件)，数据所在的位置</li><li>创建软链接 xx3，只指向 xx1 的名称，并不指向硬盘驱动器上的某个位置</li><li>删除原始文件，软链接将会无效</li></ol><h3 id="创建" tabindex="-1">创建 <a class="header-anchor" href="#创建" aria-label="Permalink to &quot;创建&quot;">​</a></h3><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">ls</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#B392F0;">ln</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">-s</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">hardlink.txt</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">softlink.txt</span></span>
 <span class="line"></span>
diff --git a/assets/articles_basic_syslink.md.ba8c5ece.lean.js b/assets/articles_basic_syslink.md.8ff4f41d.lean.js
similarity index 71%
rename from assets/articles_basic_syslink.md.ba8c5ece.lean.js
rename to assets/articles_basic_syslink.md.8ff4f41d.lean.js
index 23a9798..8c24474 100644
--- a/assets/articles_basic_syslink.md.ba8c5ece.lean.js
+++ b/assets/articles_basic_syslink.md.8ff4f41d.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"Linux 链接","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/syslink.md","filePath":"articles/basic/syslink.md","lastUpdated":1670330848000}'),p={name:"articles/basic/syslink.md"},o=l("",23),e=[o];function t(c,i,r,h,x,y){return a(),n("div",null,e)}const k=s(p,[["render",t]]);export{E as __pageData,k as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"Linux 链接","description":"","frontmatter":{},"headers":[],"relativePath":"articles/basic/syslink.md","filePath":"articles/basic/syslink.md","lastUpdated":1670330848000}'),p={name:"articles/basic/syslink.md"},o=l("",23),e=[o];function t(c,i,r,h,x,y){return a(),n("div",null,e)}const k=s(p,[["render",t]]);export{E as __pageData,k as default};
diff --git a/assets/articles_index.md.2805f70b.js b/assets/articles_index.md.16646c0c.js
similarity index 93%
rename from assets/articles_index.md.2805f70b.js
rename to assets/articles_index.md.16646c0c.js
index 237a9eb..19d921c 100644
--- a/assets/articles_index.md.2805f70b.js
+++ b/assets/articles_index.md.16646c0c.js
@@ -1 +1 @@
-import{_ as e,o as t,c as o,Q as c}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"开启写作之旅","description":"","frontmatter":{},"headers":[],"relativePath":"articles/index.md","filePath":"articles/index.md","lastUpdated":1670330848000}'),p={name:"articles/index.md"},a=c('<h1 id="开启写作之旅" tabindex="-1">开启写作之旅 <a class="header-anchor" href="#开启写作之旅" aria-label="Permalink to &quot;开启写作之旅&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">文章</p><p>这里将开始自己的写作之旅（不仅仅是技术）</p></div><p><strong>简介</strong></p><p>我是一名<code>前端开发者</code>，2018 毕业，目前在杭州就业。</p><p>2018 年初，迈出校门，走入社会。</p><p>大学所学的知识让我充满了迷茫与惆怅（计算机专业什么都学），不知道出去该往哪个方向发展，路途未知。</p><p><code>第一份工作</code></p><p>靠着校招拿到一个 offer，沾沾自喜的我开始了第一份自己的工作。靠着自己的一分热血， 总以为能得到满意的结果。可事实终究残酷无情。学校中身边的都是你的同龄人，社会中面对着不同的层次，你所想的永远是太天真。</p><p>总结一句话：<code>不要害怕经历，经历多一点你以后的路就好走一点</code>。</p><p><code>第二份工作进行中</code></p><p>～ ～ ～</p><p><code>目标展望</code></p><p>往后的路还长，技术之路也还很漫长，慢慢积累自己的经历。</p><p>路从现在开始，走下去，努力下去，成熟下去，向着自己的目标进发。</p><div class="danger custom-block"><p class="custom-block-title">寄语</p><p>一步一个脚印，你以后得到的，就是你现在付出的！</p></div>',15),s=[a];function d(i,r,n,l,_,m){return t(),o("div",null,s)}const u=e(p,[["render",d]]);export{h as __pageData,u as default};
+import{_ as e,o as t,c as o,Q as c}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"开启写作之旅","description":"","frontmatter":{},"headers":[],"relativePath":"articles/index.md","filePath":"articles/index.md","lastUpdated":1670330848000}'),p={name:"articles/index.md"},a=c('<h1 id="开启写作之旅" tabindex="-1">开启写作之旅 <a class="header-anchor" href="#开启写作之旅" aria-label="Permalink to &quot;开启写作之旅&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">文章</p><p>这里将开始自己的写作之旅（不仅仅是技术）</p></div><p><strong>简介</strong></p><p>我是一名<code>前端开发者</code>，2018 毕业，目前在杭州就业。</p><p>2018 年初，迈出校门，走入社会。</p><p>大学所学的知识让我充满了迷茫与惆怅（计算机专业什么都学），不知道出去该往哪个方向发展，路途未知。</p><p><code>第一份工作</code></p><p>靠着校招拿到一个 offer，沾沾自喜的我开始了第一份自己的工作。靠着自己的一分热血， 总以为能得到满意的结果。可事实终究残酷无情。学校中身边的都是你的同龄人，社会中面对着不同的层次，你所想的永远是太天真。</p><p>总结一句话：<code>不要害怕经历，经历多一点你以后的路就好走一点</code>。</p><p><code>第二份工作进行中</code></p><p>～ ～ ～</p><p><code>目标展望</code></p><p>往后的路还长，技术之路也还很漫长，慢慢积累自己的经历。</p><p>路从现在开始，走下去，努力下去，成熟下去，向着自己的目标进发。</p><div class="danger custom-block"><p class="custom-block-title">寄语</p><p>一步一个脚印，你以后得到的，就是你现在付出的！</p></div>',15),s=[a];function d(i,r,n,l,_,m){return t(),o("div",null,s)}const u=e(p,[["render",d]]);export{h as __pageData,u as default};
diff --git a/assets/articles_index.md.2805f70b.lean.js b/assets/articles_index.md.16646c0c.lean.js
similarity index 70%
rename from assets/articles_index.md.2805f70b.lean.js
rename to assets/articles_index.md.16646c0c.lean.js
index a151618..96721aa 100644
--- a/assets/articles_index.md.2805f70b.lean.js
+++ b/assets/articles_index.md.16646c0c.lean.js
@@ -1 +1 @@
-import{_ as e,o as t,c as o,Q as c}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"开启写作之旅","description":"","frontmatter":{},"headers":[],"relativePath":"articles/index.md","filePath":"articles/index.md","lastUpdated":1670330848000}'),p={name:"articles/index.md"},a=c("",15),s=[a];function d(i,r,n,l,_,m){return t(),o("div",null,s)}const u=e(p,[["render",d]]);export{h as __pageData,u as default};
+import{_ as e,o as t,c as o,Q as c}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"开启写作之旅","description":"","frontmatter":{},"headers":[],"relativePath":"articles/index.md","filePath":"articles/index.md","lastUpdated":1670330848000}'),p={name:"articles/index.md"},a=c("",15),s=[a];function d(i,r,n,l,_,m){return t(),o("div",null,s)}const u=e(p,[["render",d]]);export{h as __pageData,u as default};
diff --git a/assets/articles_problem_css.md.d109b0e6.js b/assets/articles_problem_css.md.5cdc7adf.js
similarity index 98%
rename from assets/articles_problem_css.md.d109b0e6.js
rename to assets/articles_problem_css.md.5cdc7adf.js
index f639963..5a5107b 100644
--- a/assets/articles_problem_css.md.d109b0e6.js
+++ b/assets/articles_problem_css.md.5cdc7adf.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"css 遇到的问题","description":"","frontmatter":{},"headers":[],"relativePath":"articles/problem/css.md","filePath":"articles/problem/css.md","lastUpdated":1670330848000}'),p={name:"articles/problem/css.md"},o=l(`<h1 id="css-遇到的问题" tabindex="-1">css 遇到的问题 <a class="header-anchor" href="#css-遇到的问题" aria-label="Permalink to &quot;css 遇到的问题&quot;">​</a></h1><h2 id="问题一" tabindex="-1">问题一 <a class="header-anchor" href="#问题一" aria-label="Permalink to &quot;问题一&quot;">​</a></h2><blockquote><p>inline-block 元素包含多个 inline-block 元素显示成一行时，设置 overflow: hidden，元素向下偏移</p></blockquote><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">&lt;!-- 会发现 span1 向下偏移一点了 --&gt;</span></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"css 遇到的问题","description":"","frontmatter":{},"headers":[],"relativePath":"articles/problem/css.md","filePath":"articles/problem/css.md","lastUpdated":1670330848000}'),p={name:"articles/problem/css.md"},o=l(`<h1 id="css-遇到的问题" tabindex="-1">css 遇到的问题 <a class="header-anchor" href="#css-遇到的问题" aria-label="Permalink to &quot;css 遇到的问题&quot;">​</a></h1><h2 id="问题一" tabindex="-1">问题一 <a class="header-anchor" href="#问题一" aria-label="Permalink to &quot;问题一&quot;">​</a></h2><blockquote><p>inline-block 元素包含多个 inline-block 元素显示成一行时，设置 overflow: hidden，元素向下偏移</p></blockquote><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">&lt;!-- 会发现 span1 向下偏移一点了 --&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;span&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;span1&quot;</span><span style="color:#E1E4E8;">&gt;1&lt;/</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;span2&quot;</span><span style="color:#E1E4E8;">&gt;2&lt;/</span><span style="color:#85E89D;">span</span><span style="color:#E1E4E8;">&gt;</span></span>
diff --git a/assets/articles_problem_css.md.d109b0e6.lean.js b/assets/articles_problem_css.md.5cdc7adf.lean.js
similarity index 71%
rename from assets/articles_problem_css.md.d109b0e6.lean.js
rename to assets/articles_problem_css.md.5cdc7adf.lean.js
index 87a54be..0efa540 100644
--- a/assets/articles_problem_css.md.d109b0e6.lean.js
+++ b/assets/articles_problem_css.md.5cdc7adf.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"css 遇到的问题","description":"","frontmatter":{},"headers":[],"relativePath":"articles/problem/css.md","filePath":"articles/problem/css.md","lastUpdated":1670330848000}'),p={name:"articles/problem/css.md"},o=l("",15),e=[o];function t(c,r,i,E,y,h){return a(),n("div",null,e)}const u=s(p,[["render",t]]);export{b as __pageData,u as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"css 遇到的问题","description":"","frontmatter":{},"headers":[],"relativePath":"articles/problem/css.md","filePath":"articles/problem/css.md","lastUpdated":1670330848000}'),p={name:"articles/problem/css.md"},o=l("",15),e=[o];function t(c,r,i,E,y,h){return a(),n("div",null,e)}const u=s(p,[["render",t]]);export{b as __pageData,u as default};
diff --git a/assets/articles_problem_yarn.md.3bf099db.js b/assets/articles_problem_yarn.md.6c3a7206.js
similarity index 95%
rename from assets/articles_problem_yarn.md.3bf099db.js
rename to assets/articles_problem_yarn.md.6c3a7206.js
index 38e4ed8..2db58c6 100644
--- a/assets/articles_problem_yarn.md.3bf099db.js
+++ b/assets/articles_problem_yarn.md.6c3a7206.js
@@ -1 +1 @@
-import{_ as a,o as s,c as e,Q as n}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"yarn 问题","description":"","frontmatter":{},"headers":[],"relativePath":"articles/problem/yarn.md","filePath":"articles/problem/yarn.md","lastUpdated":1670330848000}'),o={name:"articles/problem/yarn.md"},l=n('<h1 id="yarn-问题" tabindex="-1">yarn 问题 <a class="header-anchor" href="#yarn-问题" aria-label="Permalink to &quot;yarn 问题&quot;">​</a></h1><h2 id="spawn-e2big" tabindex="-1">spawn E2BIG <a class="header-anchor" href="#spawn-e2big" aria-label="Permalink to &quot;spawn E2BIG&quot;">​</a></h2><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">error</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">An</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">unexpected</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">error</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">occurred:</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&quot;spawn E2BIG&quot;.</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">error</span><span style="color:#24292E;"> </span><span style="color:#032F62;">An</span><span style="color:#24292E;"> </span><span style="color:#032F62;">unexpected</span><span style="color:#24292E;"> </span><span style="color:#032F62;">error</span><span style="color:#24292E;"> </span><span style="color:#032F62;">occurred:</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&quot;spawn E2BIG&quot;.</span></span></code></pre></div><h3 id="问题描述" tabindex="-1">问题描述 <a class="header-anchor" href="#问题描述" aria-label="Permalink to &quot;问题描述&quot;">​</a></h3><ol><li>使用 yarn 启动脚本命令时，报 spawn E2BIG 错误</li></ol><h3 id="问题解决" tabindex="-1">问题解决 <a class="header-anchor" href="#问题解决" aria-label="Permalink to &quot;问题解决&quot;">​</a></h3><ol><li><p>根目录下存在以 notice notice. 命名的文件（删除或者更改名字）；</p></li><li><p>yarn 读取了 notice 文件作为 p<wbr>rocess.env.npm_package_noticeText 环境变量配置；</p></li><li><p>导致设置的 npm_package_noticeText 环境变量长度太大。</p></li></ol>',7),r=[l];function t(p,c,i,d,h,y){return s(),e("div",null,r)}const u=a(o,[["render",t]]);export{_ as __pageData,u as default};
+import{_ as a,o as s,c as e,Q as n}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"yarn 问题","description":"","frontmatter":{},"headers":[],"relativePath":"articles/problem/yarn.md","filePath":"articles/problem/yarn.md","lastUpdated":1670330848000}'),o={name:"articles/problem/yarn.md"},l=n('<h1 id="yarn-问题" tabindex="-1">yarn 问题 <a class="header-anchor" href="#yarn-问题" aria-label="Permalink to &quot;yarn 问题&quot;">​</a></h1><h2 id="spawn-e2big" tabindex="-1">spawn E2BIG <a class="header-anchor" href="#spawn-e2big" aria-label="Permalink to &quot;spawn E2BIG&quot;">​</a></h2><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">error</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">An</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">unexpected</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">error</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">occurred:</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&quot;spawn E2BIG&quot;.</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">error</span><span style="color:#24292E;"> </span><span style="color:#032F62;">An</span><span style="color:#24292E;"> </span><span style="color:#032F62;">unexpected</span><span style="color:#24292E;"> </span><span style="color:#032F62;">error</span><span style="color:#24292E;"> </span><span style="color:#032F62;">occurred:</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&quot;spawn E2BIG&quot;.</span></span></code></pre></div><h3 id="问题描述" tabindex="-1">问题描述 <a class="header-anchor" href="#问题描述" aria-label="Permalink to &quot;问题描述&quot;">​</a></h3><ol><li>使用 yarn 启动脚本命令时，报 spawn E2BIG 错误</li></ol><h3 id="问题解决" tabindex="-1">问题解决 <a class="header-anchor" href="#问题解决" aria-label="Permalink to &quot;问题解决&quot;">​</a></h3><ol><li><p>根目录下存在以 notice notice. 命名的文件（删除或者更改名字）；</p></li><li><p>yarn 读取了 notice 文件作为 p<wbr>rocess.env.npm_package_noticeText 环境变量配置；</p></li><li><p>导致设置的 npm_package_noticeText 环境变量长度太大。</p></li></ol>',7),r=[l];function t(p,c,i,d,h,y){return s(),e("div",null,r)}const u=a(o,[["render",t]]);export{_ as __pageData,u as default};
diff --git a/assets/articles_problem_yarn.md.3bf099db.lean.js b/assets/articles_problem_yarn.md.6c3a7206.lean.js
similarity index 71%
rename from assets/articles_problem_yarn.md.3bf099db.lean.js
rename to assets/articles_problem_yarn.md.6c3a7206.lean.js
index ca87744..12b8c55 100644
--- a/assets/articles_problem_yarn.md.3bf099db.lean.js
+++ b/assets/articles_problem_yarn.md.6c3a7206.lean.js
@@ -1 +1 @@
-import{_ as a,o as s,c as e,Q as n}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"yarn 问题","description":"","frontmatter":{},"headers":[],"relativePath":"articles/problem/yarn.md","filePath":"articles/problem/yarn.md","lastUpdated":1670330848000}'),o={name:"articles/problem/yarn.md"},l=n("",7),r=[l];function t(p,c,i,d,h,y){return s(),e("div",null,r)}const u=a(o,[["render",t]]);export{_ as __pageData,u as default};
+import{_ as a,o as s,c as e,Q as n}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"yarn 问题","description":"","frontmatter":{},"headers":[],"relativePath":"articles/problem/yarn.md","filePath":"articles/problem/yarn.md","lastUpdated":1670330848000}'),o={name:"articles/problem/yarn.md"},l=n("",7),r=[l];function t(p,c,i,d,h,y){return s(),e("div",null,r)}const u=a(o,[["render",t]]);export{_ as __pageData,u as default};
diff --git a/assets/articles_servers_ecs.md.f94f1bda.js b/assets/articles_servers_ecs.md.3a2f60fe.js
similarity index 93%
rename from assets/articles_servers_ecs.md.f94f1bda.js
rename to assets/articles_servers_ecs.md.3a2f60fe.js
index c86c502..40031a2 100644
--- a/assets/articles_servers_ecs.md.f94f1bda.js
+++ b/assets/articles_servers_ecs.md.3a2f60fe.js
@@ -1 +1 @@
-import{_ as a,o as e,c as s,Q as t}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"云服务器ECS","description":"","frontmatter":{},"headers":[],"relativePath":"articles/servers/ecs.md","filePath":"articles/servers/ecs.md","lastUpdated":1670330848000}'),o={name:"articles/servers/ecs.md"},c=t('<h1 id="云服务器ecs" tabindex="-1">云服务器ECS <a class="header-anchor" href="#云服务器ecs" aria-label="Permalink to &quot;云服务器ECS&quot;">​</a></h1><h2 id="阿里云服务器-elastic-compute-service" tabindex="-1">阿里云服务器(Elastic Compute Service) <a class="header-anchor" href="#阿里云服务器-elastic-compute-service" aria-label="Permalink to &quot;阿里云服务器(Elastic Compute Service)&quot;">​</a></h2><h3 id="mac" tabindex="-1">MAC <a class="header-anchor" href="#mac" aria-label="Permalink to &quot;MAC&quot;">​</a></h3><p><code>Mac连接到linux环境</code></p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">ssh</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">root@</span><span style="color:#E1E4E8;">(</span><span style="color:#B392F0;">ECS公网IP</span><span style="color:#E1E4E8;">)</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">ssh</span><span style="color:#24292E;"> </span><span style="color:#032F62;">root@</span><span style="color:#24292E;">(</span><span style="color:#6F42C1;">ECS公网IP</span><span style="color:#24292E;">)</span></span></code></pre></div><h2 id="腾讯云" tabindex="-1">腾讯云 <a class="header-anchor" href="#腾讯云" aria-label="Permalink to &quot;腾讯云&quot;">​</a></h2>',6),l=[c];function r(n,p,i,d,h,_){return e(),s("div",null,l)}const m=a(o,[["render",r]]);export{E as __pageData,m as default};
+import{_ as a,o as e,c as s,Q as t}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"云服务器ECS","description":"","frontmatter":{},"headers":[],"relativePath":"articles/servers/ecs.md","filePath":"articles/servers/ecs.md","lastUpdated":1670330848000}'),o={name:"articles/servers/ecs.md"},c=t('<h1 id="云服务器ecs" tabindex="-1">云服务器ECS <a class="header-anchor" href="#云服务器ecs" aria-label="Permalink to &quot;云服务器ECS&quot;">​</a></h1><h2 id="阿里云服务器-elastic-compute-service" tabindex="-1">阿里云服务器(Elastic Compute Service) <a class="header-anchor" href="#阿里云服务器-elastic-compute-service" aria-label="Permalink to &quot;阿里云服务器(Elastic Compute Service)&quot;">​</a></h2><h3 id="mac" tabindex="-1">MAC <a class="header-anchor" href="#mac" aria-label="Permalink to &quot;MAC&quot;">​</a></h3><p><code>Mac连接到linux环境</code></p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">ssh</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">root@</span><span style="color:#E1E4E8;">(</span><span style="color:#B392F0;">ECS公网IP</span><span style="color:#E1E4E8;">)</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">ssh</span><span style="color:#24292E;"> </span><span style="color:#032F62;">root@</span><span style="color:#24292E;">(</span><span style="color:#6F42C1;">ECS公网IP</span><span style="color:#24292E;">)</span></span></code></pre></div><h2 id="腾讯云" tabindex="-1">腾讯云 <a class="header-anchor" href="#腾讯云" aria-label="Permalink to &quot;腾讯云&quot;">​</a></h2>',6),l=[c];function r(n,p,i,d,h,_){return e(),s("div",null,l)}const m=a(o,[["render",r]]);export{E as __pageData,m as default};
diff --git a/assets/articles_servers_ecs.md.f94f1bda.lean.js b/assets/articles_servers_ecs.md.3a2f60fe.lean.js
similarity index 71%
rename from assets/articles_servers_ecs.md.f94f1bda.lean.js
rename to assets/articles_servers_ecs.md.3a2f60fe.lean.js
index 7754efb..464a31b 100644
--- a/assets/articles_servers_ecs.md.f94f1bda.lean.js
+++ b/assets/articles_servers_ecs.md.3a2f60fe.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as s,Q as t}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"云服务器ECS","description":"","frontmatter":{},"headers":[],"relativePath":"articles/servers/ecs.md","filePath":"articles/servers/ecs.md","lastUpdated":1670330848000}'),o={name:"articles/servers/ecs.md"},c=t("",6),l=[c];function r(n,p,i,d,h,_){return e(),s("div",null,l)}const m=a(o,[["render",r]]);export{E as __pageData,m as default};
+import{_ as a,o as e,c as s,Q as t}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"云服务器ECS","description":"","frontmatter":{},"headers":[],"relativePath":"articles/servers/ecs.md","filePath":"articles/servers/ecs.md","lastUpdated":1670330848000}'),o={name:"articles/servers/ecs.md"},c=t("",6),l=[c];function r(n,p,i,d,h,_){return e(),s("div",null,l)}const m=a(o,[["render",r]]);export{E as __pageData,m as default};
diff --git a/assets/chunks/@localSearchIndexroot.2339654d.js b/assets/chunks/@localSearchIndexroot.2339654d.js
deleted file mode 100644
index 38914cd..0000000
--- a/assets/chunks/@localSearchIndexroot.2339654d.js
+++ /dev/null
@@ -1 +0,0 @@
-const t='{"documentCount":879,"nextId":879,"documentIds":{"0":"/learning-docs2/alogrithm/basic/O.html#大-o-表示法","1":"/learning-docs2/alogrithm/basic/O.html#时间复杂度","2":"/learning-docs2/alogrithm/basic/O.html#空间复杂度","3":"/learning-docs2/alogrithm/basic/bit.html#位运算","4":"/learning-docs2/alogrithm/basic/bit.html#常用的位运算操作","5":"/learning-docs2/alogrithm/basic/bit.html#复杂的位运算操作","6":"/learning-docs2/alogrithm/basic/red_black_tree.html#红黑树","7":"/learning-docs2/alogrithm/basic/red_black_tree.html#特点","8":"/learning-docs2/alogrithm/basic/red_black_tree.html#实现","9":"/learning-docs2/alogrithm/#开启之路","10":"/learning-docs2/alogrithm/interview/self.html#数据结构辅助记忆","11":"/learning-docs2/alogrithm/interview/self.html#常见的数据结构","12":"/learning-docs2/alogrithm/interview/self.html#堆","13":"/learning-docs2/alogrithm/interview/self.html#hash-表","14":"/learning-docs2/alogrithm/interview/self.html#字典树","15":"/learning-docs2/alogrithm/interview/self.html#图","16":"/learning-docs2/alogrithm/interview/self.html#探测环","17":"/learning-docs2/alogrithm/interview/self.html#disjoin-set","18":"/learning-docs2/alogrithm/interview/self.html#链表","19":"/learning-docs2/alogrithm/interview/self.html#链表倒转","20":"/learning-docs2/alogrithm/interview/self.html#树","21":"/learning-docs2/alogrithm/interview/self.html#注意点","22":"/learning-docs2/architecture/#架构","23":"/learning-docs2/architecture/standard/A-YZ.html#a-yz","24":"/learning-docs2/architecture/standard/A-YZ.html#ui-自动化","25":"/learning-docs2/architecture/standard/A-YZ.html#接口测试","26":"/learning-docs2/architecture/standard/A-YZ.html#单元测试","27":"/learning-docs2/architecture/standard/A-YZ.html#基础库变更报警","28":"/learning-docs2/architecture/standard/A-YZ.html#sentry-报警","29":"/learning-docs2/architecture/standard/A-YZ.html#业务报警","30":"/learning-docs2/architecture/standard/A-YZ.html#约定规范","31":"/learning-docs2/architecture/standard/comp-mod.html#组件化与模块化设计","32":"/learning-docs2/architecture/standard/comp-mod.html#模块化设计","33":"/learning-docs2/architecture/standard/comp-mod.html#应用的模块与层级划分","34":"/learning-docs2/architecture/standard/comp-mod.html#模块划分与设计原则","35":"/learning-docs2/architecture/standard/comp-mod.html#如何进行模块间依赖的解耦","36":"/learning-docs2/architecture/standard/comp-mod.html#组件化设计","37":"/learning-docs2/architecture/standard/comp-mod.html#组件划分","38":"/learning-docs2/architecture/standard/comp-mod.html#组件封装","39":"/learning-docs2/architecture/standard/monitor.html#前端监控体系","40":"/learning-docs2/architecture/standard/monitor.html#为什么","41":"/learning-docs2/architecture/standard/monitor.html#监控内容","42":"/learning-docs2/architecture/standard/monitor.html#数据埋点与收集","43":"/learning-docs2/architecture/standard/monitor.html#系统生命周期","44":"/learning-docs2/architecture/standard/monitor.html#系统异常","45":"/learning-docs2/architecture/standard/monitor.html#用户日志","46":"/learning-docs2/architecture/standard/monitor.html#数据上报","47":"/learning-docs2/architecture/standard/monitor.html#数据监控","48":"/learning-docs2/architecture/standard/performance.html#前端性能优化","49":"/learning-docs2/architecture/standard/performance.html#时间角度","50":"/learning-docs2/architecture/standard/performance.html#网络请求优化","51":"/learning-docs2/architecture/standard/performance.html#首屏加载优化","52":"/learning-docs2/architecture/standard/performance.html#渲染过程优化","53":"/learning-docs2/architecture/standard/performance.html#计算-逻辑提速","54":"/learning-docs2/architecture/standard/performance.html#空间角度","55":"/learning-docs2/architecture/standard/performance.html#降低资源占用","56":"/learning-docs2/architecture/standard/performance.html#性能数据","57":"/learning-docs2/architecture/standard/project-design.html#项目设计","58":"/learning-docs2/architecture/standard/project-design.html#技术方案设计与选型","59":"/learning-docs2/architecture/standard/project-design.html#技术选型的影响因素","60":"/learning-docs2/architecture/standard/project-design.html#多人协作与团队规范","61":"/learning-docs2/architecture/standard/project-design.html#前端工程化","62":"/learning-docs2/architecture/standard/project-design.html#大型项目痛点","63":"/learning-docs2/architecture/standard/project-design.html#模块耦合严重","64":"/learning-docs2/architecture/standard/project-design.html#项目复杂熟悉成本过高","65":"/learning-docs2/architecture/standard/project-design.html#项目代码量过大","66":"/learning-docs2/architecture/standard/project-design.html#问题定位效率低","67":"/learning-docs2/architecture/standard/project-design.html#项目前期准备与复盘","68":"/learning-docs2/architecture/websecure/xss.html#xss","69":"/learning-docs2/architecture/websecure/xss.html#类型","70":"/learning-docs2/architecture/websecure/xss.html#反射型","71":"/learning-docs2/architecture/websecure/xss.html#存储型","72":"/learning-docs2/architecture/websecure/xss.html#dom-跨站","73":"/learning-docs2/articles/advanced/debounce.html#防抖节流","74":"/learning-docs2/articles/advanced/debounce.html#防抖","75":"/learning-docs2/articles/advanced/debounce.html#正常防抖","76":"/learning-docs2/articles/advanced/debounce.html#代码实现","77":"/learning-docs2/articles/advanced/debounce.html#lodash-类似实现用法","78":"/learning-docs2/articles/advanced/debounce.html#立即执行防抖函数i","79":"/learning-docs2/articles/advanced/debounce.html#代码执行","80":"/learning-docs2/articles/advanced/debounce.html#lodash-类似实现用法-1","81":"/learning-docs2/articles/advanced/debounce.html#立即执行防抖函数ii","82":"/learning-docs2/articles/advanced/debounce.html#代码实现-1","83":"/learning-docs2/articles/advanced/debounce.html#lodash-类似实现用法-2","84":"/learning-docs2/articles/advanced/debounce.html#节流","85":"/learning-docs2/articles/advanced/debounce.html#节流非定时器版","86":"/learning-docs2/articles/advanced/debounce.html#代码实现-2","87":"/learning-docs2/articles/advanced/debounce.html#lodash-类似实现用法-3","88":"/learning-docs2/articles/advanced/debounce.html#节流定时器版","89":"/learning-docs2/articles/advanced/debounce.html#代码实现-3","90":"/learning-docs2/articles/advanced/debounce.html#lodash-类似实现用法-4","91":"/learning-docs2/articles/advanced/debounce.html#节流最终执行","92":"/learning-docs2/articles/advanced/debounce.html#代码实现-4","93":"/learning-docs2/articles/advanced/debounce.html#lodash-类似实现用法-5","94":"/learning-docs2/articles/advanced/debounce.html#lodash-实现","95":"/learning-docs2/articles/advanced/debounce.html#lodash-的参数","96":"/learning-docs2/articles/advanced/debounce.html#lodash-debounce-默认调用","97":"/learning-docs2/articles/advanced/debounce.html#lodash-throttle-默认调用","98":"/learning-docs2/articles/advanced/debounce.html#源码实现","99":"/learning-docs2/articles/advanced/devServer.html#实现一个简易热更新","100":"/learning-docs2/articles/advanced/devServer.html#实现思考","101":"/learning-docs2/articles/advanced/devServer.html#思考一","102":"/learning-docs2/articles/advanced/devServer.html#解答","103":"/learning-docs2/articles/advanced/devServer.html#思考二","104":"/learning-docs2/articles/advanced/devServer.html#解答-1","105":"/learning-docs2/articles/advanced/devServer.html#思考三","106":"/learning-docs2/articles/advanced/devServer.html#解答-2","107":"/learning-docs2/articles/advanced/devServer.html#环境准备","108":"/learning-docs2/articles/advanced/devServer.html#目录搭建","109":"/learning-docs2/articles/advanced/devServer.html#项目启动","110":"/learning-docs2/articles/advanced/docs.html#前端文档","111":"/learning-docs2/articles/advanced/docs.html#前端文档浅思考","112":"/learning-docs2/articles/advanced/docs.html#富文本编辑","113":"/learning-docs2/articles/advanced/docs.html#操作富文本","114":"/learning-docs2/articles/advanced/docs.html#富文本选区","115":"/learning-docs2/articles/advanced/docs.html#操作范围-dom2","116":"/learning-docs2/articles/advanced/docs.html#复合事件","117":"/learning-docs2/articles/advanced/docs.html#前端文档深思考","118":"/learning-docs2/articles/advanced/docs.html#同构表vs异构表","119":"/learning-docs2/articles/advanced/docs.html#文档技术","120":"/learning-docs2/articles/advanced/docs.html#在线协同","121":"/learning-docs2/articles/advanced/docs.html#前端文档应用","122":"/learning-docs2/articles/advanced/docs.html#钉钉","123":"/learning-docs2/articles/advanced/docs.html#语雀","124":"/learning-docs2/articles/advanced/docs.html#前端文档性能","125":"/learning-docs2/articles/advanced/docs.html#大数据","126":"/learning-docs2/articles/advanced/docs.html#最大单元格数","127":"/learning-docs2/articles/advanced/docs.html#前端文档展望","128":"/learning-docs2/articles/advanced/docs.html#复杂度","129":"/learning-docs2/articles/advanced/docs.html#未来","130":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#htmlwepbackplugin-源码分析","131":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#简易的写一个-hwp-插件","132":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#简易实现问题","133":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#hwp-源码实现","134":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#webpack-配置","135":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#写一个-webpack-插件","136":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#使用到的-webpack-compiler","137":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#compiler-hooks-thiscompilation","138":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#compiler-hooks-make","139":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#compiler-hooks-emit","140":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#hwp-创建一个子解析器-childcompiler","141":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#createchildcompiler","142":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#动手实现一个-hwp-插件","143":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#创建-childcompiler","144":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#index-html-解析器-loader","145":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#开始注入-js-css-favicon-文件","146":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#title-如何注入到-index-html-中","147":"/learning-docs2/articles/advanced/htmlWebpackPlugin.html#nodejs-vm-模块","148":"/learning-docs2/articles/advanced/knowledge.js.html#你不知道的-js","149":"/learning-docs2/articles/advanced/knowledge.js.html#matchmedia","150":"/learning-docs2/articles/advanced/mutationObserver.html#mutationobserver","151":"/learning-docs2/articles/advanced/mutationObserver.html#概念","152":"/learning-docs2/articles/advanced/mutationObserver.html#兼容性","153":"/learning-docs2/articles/advanced/mutationObserver.html#用法","154":"/learning-docs2/articles/advanced/mutationObserver.html#api","155":"/learning-docs2/articles/advanced/mutationObserver.html#observe-方法","156":"/learning-docs2/articles/advanced/mutationObserver.html#callback-mutation-records-回调参数属性分析","157":"/learning-docs2/articles/advanced/mutationObserver.html#disconnect-关闭连接","158":"/learning-docs2/articles/advanced/mutationObserver.html#multi-mutaintionobserver-多监听改变","159":"/learning-docs2/articles/advanced/mutationObserver.html#重新使用-mutationobserver-实例","160":"/learning-docs2/articles/advanced/mutationObserver.html#observe-方法第二个参数对象有哪些属性","161":"/learning-docs2/articles/advanced/mutationObserver.html#mutationobserver-设计规范","162":"/learning-docs2/articles/advanced/mutationObserver.html#异步回调和记录队列","163":"/learning-docs2/articles/advanced/mutationObserver.html#takerecords-方法","164":"/learning-docs2/articles/advanced/mutationObserver.html#性能分析","165":"/learning-docs2/articles/advanced/transitionAnimation.html#cssjs-动画那些事","166":"/learning-docs2/articles/advanced/transitionAnimation.html#回流与重绘","167":"/learning-docs2/articles/advanced/transitionAnimation.html#css-动画","168":"/learning-docs2/articles/advanced/transitionAnimation.html#js-动画","169":"/learning-docs2/articles/advanced/v8-code.html#v8","170":"/learning-docs2/articles/advanced/v8-code.html#解释器和执行器","171":"/learning-docs2/articles/advanced/v8-code.html#v8-执行代码","172":"/learning-docs2/articles/advanced/v8-code.html#生成抽象语法树和执行上下文","173":"/learning-docs2/articles/advanced/v8-code.html#生成字节码","174":"/learning-docs2/articles/advanced/v8-code.html#执行代码","175":"/learning-docs2/articles/advanced/v8-code.html#垃圾回收","176":"/learning-docs2/articles/advanced/v8-code.html#栈空间","177":"/learning-docs2/articles/advanced/v8-code.html#堆空间","178":"/learning-docs2/articles/advanced/v8-code.html#堆空间的垃圾回收","179":"/learning-docs2/articles/advanced/v8-code.html#新生代","180":"/learning-docs2/articles/advanced/v8-code.html#老生代","181":"/learning-docs2/articles/advanced/v8-code.html#垃圾回收流程","182":"/learning-docs2/articles/advanced/v8-code.html#副垃圾回收器","183":"/learning-docs2/articles/advanced/v8-code.html#主垃圾回收器","184":"/learning-docs2/articles/advanced/v8-code.html#全停顿","185":"/learning-docs2/articles/advanced/v8-code.html#增量标记","186":"/learning-docs2/articles/advanced/virtualList.html#pc虚拟列表如何处理","187":"/learning-docs2/articles/advanced/virtualList.html#常见解决方案","188":"/learning-docs2/articles/advanced/virtualList.html#iscroll-方案-使用-transform-或者-top","189":"/learning-docs2/articles/advanced/virtualList.html#react-window-解决方案","190":"/learning-docs2/articles/advanced/virtualList.html#高度固定","191":"/learning-docs2/articles/advanced/virtualList.html#高度改变","192":"/learning-docs2/articles/advanced/virtualList.html#写在最后","193":"/learning-docs2/articles/basic/clipboard.html#js-如何实现复制","194":"/learning-docs2/articles/basic/clipboard.html#document-execcommand","195":"/learning-docs2/articles/basic/clipboard.html#实现","196":"/learning-docs2/articles/basic/clipboard.html#clipboard-api","197":"/learning-docs2/articles/basic/clipboard.html#clipboardevent","198":"/learning-docs2/articles/basic/clipboard.html#clipboarditem","199":"/learning-docs2/articles/basic/clipboard.html#navigator-clipboard","200":"/learning-docs2/articles/basic/clipboard.html#write","201":"/learning-docs2/articles/basic/clipboard.html#writetext","202":"/learning-docs2/articles/basic/clipboard.html#read","203":"/learning-docs2/articles/basic/clipboard.html#readtext","204":"/learning-docs2/articles/basic/clipboard.html#扩展","205":"/learning-docs2/articles/basic/clipboard.html#mime-type","206":"/learning-docs2/articles/basic/clipboard.html#blob","207":"/learning-docs2/articles/basic/color_convert.html#颜色值变换","208":"/learning-docs2/articles/basic/color_convert.html#十六进制转换成-rgb","209":"/learning-docs2/articles/basic/color_convert.html#rgb-转换成十六进制","210":"/learning-docs2/articles/basic/color_convert.html#hsl-转换成-rgb","211":"/learning-docs2/articles/basic/color_convert.html#rgb-转换成-hsl","212":"/learning-docs2/articles/basic/dom_events.html#dom-bom-事件流","213":"/learning-docs2/articles/basic/dom_events.html#事件冒泡","214":"/learning-docs2/articles/basic/dom_events.html#事件捕获","215":"/learning-docs2/articles/basic/dom_events.html#事件处理程序","216":"/learning-docs2/articles/basic/dom_events.html#html-事件处理程序","217":"/learning-docs2/articles/basic/dom_events.html#dom0-级事件处理程序","218":"/learning-docs2/articles/basic/dom_events.html#dom2-级事件处理程序","219":"/learning-docs2/articles/basic/dom_events.html#ie-事件处理程序","220":"/learning-docs2/articles/basic/dom_events.html#事件对象","221":"/learning-docs2/articles/basic/dom_events.html#dom-事件对象","222":"/learning-docs2/articles/basic/dom_events.html#ie-事件对象","223":"/learning-docs2/articles/basic/dom_events.html#事件对象-1","224":"/learning-docs2/articles/basic/dom_events.html#ui事件","225":"/learning-docs2/articles/basic/dom_events.html#焦点事件","226":"/learning-docs2/articles/basic/dom_events.html#鼠标与滚轮事件","227":"/learning-docs2/articles/basic/dom_events.html#键盘与文本事件","228":"/learning-docs2/articles/basic/dom_events.html#复合事件","229":"/learning-docs2/articles/basic/dom_events.html#变动事件","230":"/learning-docs2/articles/basic/dom_events.html#html5事件","231":"/learning-docs2/articles/basic/dom_events.html#pageshow-和-pagehide-事件","232":"/learning-docs2/articles/basic/dom_events.html#hashchange","233":"/learning-docs2/articles/basic/dom_events.html#设备事件","234":"/learning-docs2/articles/basic/dom_events.html#触摸与手势事件","235":"/learning-docs2/articles/basic/eslint.html#eslint","236":"/learning-docs2/articles/basic/eslint.html#配置","237":"/learning-docs2/articles/basic/eslint.html#指定解析选项","238":"/learning-docs2/articles/basic/eslint.html#指定解析","239":"/learning-docs2/articles/basic/eslint.html#指定预处理器-processor","240":"/learning-docs2/articles/basic/eslint.html#指定解析环境-env","241":"/learning-docs2/articles/basic/eslint.html#指定全局环境-globals","242":"/learning-docs2/articles/basic/eslint.html#配置插件-plugins","243":"/learning-docs2/articles/basic/eslint.html#配置规则-rules","244":"/learning-docs2/articles/basic/eslint.html#使用注释规则","245":"/learning-docs2/articles/basic/eslint.html#配置举例","246":"/learning-docs2/articles/basic/eslint.html#行内注释","247":"/learning-docs2/articles/basic/eslint.html#使用-overrides-对指定文件进行规则覆盖","248":"/learning-docs2/articles/basic/eslint.html#禁止使用-eslint-disable","249":"/learning-docs2/articles/basic/eslint.html#共享配置-settings","250":"/learning-docs2/articles/basic/eslint.html#配置项目文件结构","251":"/learning-docs2/articles/basic/eslint.html#扩展-extends","252":"/learning-docs2/articles/basic/eslint.html#配置忽略文件","253":"/learning-docs2/articles/basic/eslint.html#cli","254":"/learning-docs2/articles/basic/git.html#git","255":"/learning-docs2/articles/basic/git.html#git-rebase","256":"/learning-docs2/articles/basic/git.html#api","257":"/learning-docs2/articles/basic/git.html#理解","258":"/learning-docs2/articles/basic/git.html#git-revert","259":"/learning-docs2/articles/basic/git.html#api-1","260":"/learning-docs2/articles/basic/git.html#理解-1","261":"/learning-docs2/articles/basic/git.html#git-restore","262":"/learning-docs2/articles/basic/git.html#api-2","263":"/learning-docs2/articles/basic/git.html#理解-2","264":"/learning-docs2/articles/basic/git.html#git-reset","265":"/learning-docs2/articles/basic/git.html#api-3","266":"/learning-docs2/articles/basic/git.html#理解-3","267":"/learning-docs2/articles/basic/history.html#history-api","268":"/learning-docs2/articles/basic/history.html#window-history","269":"/learning-docs2/articles/basic/history.html#browser-浏览器路由","270":"/learning-docs2/articles/basic/history.html#hash-哈希路由","271":"/learning-docs2/articles/basic/history.html#window-location","272":"/learning-docs2/articles/basic/ieee.html#ieee-754","273":"/learning-docs2/articles/basic/ieee.html#基本格式","274":"/learning-docs2/articles/basic/ieee.html#单精度","275":"/learning-docs2/articles/basic/ieee.html#双精度","276":"/learning-docs2/articles/basic/ieee.html#双重扩展","277":"/learning-docs2/articles/basic/ieee.html#四倍精度","278":"/learning-docs2/articles/basic/ieee.html#decimal64-decimal128","279":"/learning-docs2/articles/basic/ieee.html#半精度","280":"/learning-docs2/articles/basic/ieee.html#浮点数范围","281":"/learning-docs2/articles/basic/ieee.html#字节序-endian","282":"/learning-docs2/articles/basic/ieee.html#整数值的精度限制","283":"/learning-docs2/articles/basic/ieee.html#内部表示","284":"/learning-docs2/articles/basic/ieee.html#javascript-数表示","285":"/learning-docs2/articles/basic/ieee.html#进制转换","286":"/learning-docs2/articles/basic/ieee.html#二进制转换","287":"/learning-docs2/articles/basic/ieee.html#整数","288":"/learning-docs2/articles/basic/ieee.html#小数","289":"/learning-docs2/articles/basic/ieee.html#十六进制转换","290":"/learning-docs2/articles/basic/ieee.html#八进制转换","291":"/learning-docs2/articles/basic/ieee.html#计算机编码方式","292":"/learning-docs2/articles/basic/ieee.html#原码","293":"/learning-docs2/articles/basic/ieee.html#反码","294":"/learning-docs2/articles/basic/ieee.html#补码","295":"/learning-docs2/articles/basic/ieee.html#_0-6-0-3-0-9","296":"/learning-docs2/articles/basic/ieee.html#_0-6-的二进制","297":"/learning-docs2/articles/basic/ieee.html#_0-3-的二进制","298":"/learning-docs2/articles/basic/ieee.html#指数对齐相加","299":"/learning-docs2/articles/basic/ieee.html#解决方法","300":"/learning-docs2/articles/basic/module.html#前端模块的演变","301":"/learning-docs2/articles/basic/module.html#umd","302":"/learning-docs2/articles/basic/module.html#amd","303":"/learning-docs2/articles/basic/module.html#define-函数","304":"/learning-docs2/articles/basic/module.html#require-函数","305":"/learning-docs2/articles/basic/module.html#commonjs","306":"/learning-docs2/articles/basic/module.html#esm","307":"/learning-docs2/articles/basic/module.html#扩展","308":"/learning-docs2/articles/basic/module.html#systemjs","309":"/learning-docs2/articles/basic/module.html#require-context","310":"/learning-docs2/articles/basic/script_link.html#script-link-标签","311":"/learning-docs2/articles/basic/script_link.html#defer","312":"/learning-docs2/articles/basic/script_link.html#async","313":"/learning-docs2/articles/basic/script_link.html#crossorigin","314":"/learning-docs2/articles/basic/syslink.html#linux-链接","315":"/learning-docs2/articles/basic/syslink.html#soft-links","316":"/learning-docs2/articles/basic/syslink.html#定义","317":"/learning-docs2/articles/basic/syslink.html#工作","318":"/learning-docs2/articles/basic/syslink.html#创建","319":"/learning-docs2/articles/basic/syslink.html#hard-links","320":"/learning-docs2/articles/basic/syslink.html#定义-1","321":"/learning-docs2/articles/basic/syslink.html#工作-1","322":"/learning-docs2/articles/basic/syslink.html#创建-1","323":"/learning-docs2/articles/basic/syslink.html#区别","324":"/learning-docs2/articles/#开启写作之旅","325":"/learning-docs2/articles/problem/css.html#css-遇到的问题","326":"/learning-docs2/articles/problem/css.html#问题一","327":"/learning-docs2/articles/problem/yarn.html#yarn-问题","328":"/learning-docs2/articles/problem/yarn.html#spawn-e2big","329":"/learning-docs2/articles/problem/yarn.html#问题描述","330":"/learning-docs2/articles/problem/yarn.html#问题解决","331":"/learning-docs2/articles/servers/ecs.html#云服务器ecs","332":"/learning-docs2/articles/servers/ecs.html#阿里云服务器-elastic-compute-service","333":"/learning-docs2/articles/servers/ecs.html#mac","334":"/learning-docs2/articles/servers/ecs.html#腾讯云","335":"/learning-docs2/editor/#文档编辑","336":"/learning-docs2/editor/markdown/vuepress.html#vuepress-vitepress","337":"/learning-docs2/editor/markdown/vuepress.html#标题类","338":"/learning-docs2/editor/markdown/vuepress.html#标签类","339":"/learning-docs2/editor/markdown/vuepress.html#输出类","340":"/learning-docs2/editor/markdown/vuepress.html#目录类","341":"/learning-docs2/editor/markdown/vuepress.html#链接类","342":"/learning-docs2/editor/markdown/vuepress.html#风格类","343":"/learning-docs2/editor/markdown/vuepress.html#提示类","344":"/learning-docs2/editor/markdown/vuepress.html#表格类","345":"/learning-docs2/editor/markdown/vuepress.html#表情类","346":"/learning-docs2/interview/browser.html#chromium-渲染流水线","347":"/learning-docs2/interview/browser.html#浏览器架构","348":"/learning-docs2/interview/browser.html#chromium-进程","349":"/learning-docs2/interview/browser.html#浏览器进程","350":"/learning-docs2/interview/browser.html#渲染进程","351":"/learning-docs2/interview/browser.html#主线程","352":"/learning-docs2/interview/browser.html#合成线程","353":"/learning-docs2/interview/browser.html#viz-进程","354":"/learning-docs2/interview/browser.html#进程模式","355":"/learning-docs2/interview/browser.html#渲染流水线","356":"/learning-docs2/interview/browser.html#parsing","357":"/learning-docs2/interview/browser.html#style","358":"/learning-docs2/interview/browser.html#layout","359":"/learning-docs2/interview/browser.html#pre-paint","360":"/learning-docs2/interview/browser.html#paint","361":"/learning-docs2/interview/browser.html#commit","362":"/learning-docs2/interview/browser.html#compositing","363":"/learning-docs2/interview/browser.html#tiling","364":"/learning-docs2/interview/browser.html#raster","365":"/learning-docs2/interview/browser.html#activate","366":"/learning-docs2/interview/browser.html#draw","367":"/learning-docs2/interview/browser.html#aggregate","368":"/learning-docs2/interview/browser.html#display","369":"/learning-docs2/interview/crp.html#关键路径渲染","370":"/learning-docs2/interview/crp.html#浏览器渲染","371":"/learning-docs2/interview/crp.html#dom","372":"/learning-docs2/interview/crp.html#cssom","373":"/learning-docs2/interview/crp.html#render-tree","374":"/learning-docs2/interview/crp.html#layout","375":"/learning-docs2/interview/crp.html#paint","376":"/learning-docs2/interview/crp.html#优化","377":"/learning-docs2/interview/#面试","378":"/learning-docs2/interview/metrics.html#性能指标","379":"/learning-docs2/interview/metrics.html#lcp","380":"/learning-docs2/interview/metrics.html#如何衡量","381":"/learning-docs2/interview/metrics.html#改进","382":"/learning-docs2/interview/metrics.html#测量工具","383":"/learning-docs2/interview/metrics.html#fp","384":"/learning-docs2/interview/metrics.html#fcp","385":"/learning-docs2/interview/metrics.html#dcl","386":"/learning-docs2/interview/metrics.html#fmp","387":"/learning-docs2/interview/metrics.html#l","388":"/learning-docs2/interview/metrics.html#tti","389":"/learning-docs2/interview/metrics.html#tbt","390":"/learning-docs2/interview/metrics.html#fid","391":"/learning-docs2/interview/metrics.html#cls","392":"/learning-docs2/interview/metrics.html#si","393":"/learning-docs2/network/cookie.html#cookies","394":"/learning-docs2/network/cookie.html#读取","395":"/learning-docs2/network/cookie.html#写入","396":"/learning-docs2/network/cookie.html#path","397":"/learning-docs2/network/cookie.html#domain","398":"/learning-docs2/network/cookie.html#过期时间","399":"/learning-docs2/network/cookie.html#expires","400":"/learning-docs2/network/cookie.html#max-age","401":"/learning-docs2/network/cookie.html#secure","402":"/learning-docs2/network/cookie.html#samesite","403":"/learning-docs2/network/cookie.html#httponly","404":"/learning-docs2/network/cookie.html#第三方-cookie","405":"/learning-docs2/network/cors.html#cors","406":"/learning-docs2/network/cors.html#cors-headers","407":"/learning-docs2/network/cors.html#access-control-allow-origin","408":"/learning-docs2/network/cors.html#access-control-allow-credentials","409":"/learning-docs2/network/cors.html#access-control-allow-headers","410":"/learning-docs2/network/cors.html#access-control-allow-methods","411":"/learning-docs2/network/cors.html#access-control-expose-headers","412":"/learning-docs2/network/cors.html#access-control-max-age","413":"/learning-docs2/network/cors.html#access-control-request-headers","414":"/learning-docs2/network/cors.html#access-control-request-method","415":"/learning-docs2/network/cors.html#origin","416":"/learning-docs2/network/cors.html#同源策略","417":"/learning-docs2/network/cors.html#document-domain","418":"/learning-docs2/network/cors.html#跨域访问的几种方式","419":"/learning-docs2/network/cors.html#window-postmessage","420":"/learning-docs2/network/dhcp.html#dhcp","421":"/learning-docs2/network/dhcp.html#如何配置-ip-地址","422":"/learning-docs2/network/dhcp.html#动态主机配置协议-dhcp","423":"/learning-docs2/network/dhcp.html#pxe","424":"/learning-docs2/network/dhcp.html#原理","425":"/learning-docs2/network/dhcp.html#pxe-工作过程","426":"/learning-docs2/network/#网络协议","427":"/learning-docs2/network/#常见网络协议","428":"/learning-docs2/network/#ip-地址","429":"/learning-docs2/network/#ipv4","430":"/learning-docs2/network/#ipv6","431":"/learning-docs2/network/#ip-地址如何计算广播地址、子网掩码","432":"/learning-docs2/network/#mac-地址","433":"/learning-docs2/network/#网络设备的状态标识","434":"/learning-docs2/network/ip_addr.html#ip-地址","435":"/learning-docs2/network/ip_addr.html#ip-协议","436":"/learning-docs2/network/ip_addr.html#ip-地址-1","437":"/learning-docs2/network/ip_addr.html#ip-地址类型","438":"/learning-docs2/network/ip_addr.html#公有地址","439":"/learning-docs2/network/ip_addr.html#私有地址","440":"/learning-docs2/network/ip_addr.html#ip-地址编址方式","441":"/learning-docs2/network/ip_addr.html#a-类地址","442":"/learning-docs2/network/ip_addr.html#b-类地址","443":"/learning-docs2/network/ip_addr.html#c-类地址","444":"/learning-docs2/network/ip_addr.html#d-类地址","445":"/learning-docs2/network/ip_addr.html#e-类地址","446":"/learning-docs2/network/ip_addr.html#特殊的网址","447":"/learning-docs2/network/ip_addr.html#ip-地址的分配","448":"/learning-docs2/network/layer.html#网络分层","449":"/learning-docs2/network/layer.html#工作过程","450":"/learning-docs2/network/methods.html#http-请求方法","451":"/learning-docs2/network/methods.html#get","452":"/learning-docs2/network/methods.html#head","453":"/learning-docs2/network/methods.html#post","454":"/learning-docs2/network/methods.html#请求-body-格式","455":"/learning-docs2/network/methods.html#put","456":"/learning-docs2/network/methods.html#delete","457":"/learning-docs2/network/methods.html#trace","458":"/learning-docs2/network/methods.html#options","459":"/learning-docs2/network/methods.html#connect","460":"/learning-docs2/network/methods.html#patch","461":"/learning-docs2/network/methods.html#对比","462":"/learning-docs2/network/noun.html#计算机网络名词","463":"/learning-docs2/network/noun.html#以太网","464":"/learning-docs2/network/noun.html#交换机","465":"/learning-docs2/network/noun.html#网关","466":"/learning-docs2/network/noun.html#路由器","467":"/learning-docs2/network/noun.html#mac-地址","468":"/learning-docs2/network/osi.html#网络模型","469":"/learning-docs2/network/osi.html#网络传输协议","470":"/learning-docs2/network/osi.html#osi-网络模型","471":"/learning-docs2/network/osi.html#应用层","472":"/learning-docs2/network/osi.html#表达层","473":"/learning-docs2/network/osi.html#会话层","474":"/learning-docs2/network/osi.html#传输层","475":"/learning-docs2/network/osi.html#网络层","476":"/learning-docs2/network/osi.html#数据链路层","477":"/learning-docs2/network/osi.html#物理层","478":"/learning-docs2/network/osi.html#tcp-ip-协议","479":"/learning-docs2/network/osi.html#链路层","480":"/learning-docs2/network/osi.html#网络层-1","481":"/learning-docs2/network/osi.html#传输层-1","482":"/learning-docs2/network/osi.html#应用层-1","483":"/learning-docs2/network/osi.html#缺陷","484":"/learning-docs2/network/socket.html#socket","485":"/learning-docs2/network/socket.html#socket-1","486":"/learning-docs2/network/socket.html#表示方法","487":"/learning-docs2/network/socket.html#连接","488":"/learning-docs2/network/socket.html#websocket","489":"/learning-docs2/network/socket.html#优点","490":"/learning-docs2/network/socket.html#建立连接","491":"/learning-docs2/network/socket.html#连接保持-心跳","492":"/learning-docs2/network/socket.html#响应头-请求头","493":"/learning-docs2/network/socket.html#sec-websocket-key-sec-websocket-accept","494":"/learning-docs2/network/socket.html#遇到的一些问题","495":"/learning-docs2/network/special_addr.html#http-特殊地址","496":"/learning-docs2/network/special_addr.html#_0-0-0-0","497":"/learning-docs2/network/special_addr.html#服务器","498":"/learning-docs2/network/special_addr.html#客户端","499":"/learning-docs2/network/special_addr.html#_127-0-0-1","500":"/learning-docs2/network/status_code.html#http-状态码","501":"/learning-docs2/network/status_code.html#_1xx","502":"/learning-docs2/network/status_code.html#_100-continue","503":"/learning-docs2/network/status_code.html#_101-switching-protocols","504":"/learning-docs2/network/status_code.html#_102-processing-webdav-rfc","505":"/learning-docs2/network/status_code.html#_103-early-hints-rfc","506":"/learning-docs2/network/status_code.html#_2xx","507":"/learning-docs2/network/status_code.html#_200-ok","508":"/learning-docs2/network/status_code.html#_201-created","509":"/learning-docs2/network/status_code.html#_202-accepted","510":"/learning-docs2/network/status_code.html#_203-non-authroritative-information-http-1-1","511":"/learning-docs2/network/status_code.html#_204-no-content","512":"/learning-docs2/network/status_code.html#_205-reset-content","513":"/learning-docs2/network/status_code.html#_206-partial-content-rfc","514":"/learning-docs2/network/status_code.html#_207-multi-status-rfc","515":"/learning-docs2/network/status_code.html#_208-already-reported-rfc","516":"/learning-docs2/network/status_code.html#_226-im-used-rfc","517":"/learning-docs2/network/status_code.html#_3xx","518":"/learning-docs2/network/status_code.html#_300-multiple-choices","519":"/learning-docs2/network/status_code.html#_301-moved-permanently","520":"/learning-docs2/network/status_code.html#_302-found-moved-temporarily","521":"/learning-docs2/network/status_code.html#_303-see-other","522":"/learning-docs2/network/status_code.html#_304-not-modified","523":"/learning-docs2/network/status_code.html#_305-use-proxy","524":"/learning-docs2/network/status_code.html#_306-switch-proxy","525":"/learning-docs2/network/status_code.html#_307-temporary-redirect","526":"/learning-docs2/network/status_code.html#_308-permanent-redirect-rfc","527":"/learning-docs2/network/status_code.html#_4xx","528":"/learning-docs2/network/status_code.html#_400-bad-request","529":"/learning-docs2/network/status_code.html#_401-unauthorized-rfc","530":"/learning-docs2/network/status_code.html#_402-payment-required","531":"/learning-docs2/network/status_code.html#_403-forbidden","532":"/learning-docs2/network/status_code.html#_404-not-found","533":"/learning-docs2/network/status_code.html#_405-method-not-allowed","534":"/learning-docs2/network/status_code.html#_406-not-acceptable","535":"/learning-docs2/network/status_code.html#_407-proxy-authentication-required-rfc","536":"/learning-docs2/network/status_code.html#_408-request-timeout","537":"/learning-docs2/network/status_code.html#_415-unsupported-media-type","538":"/learning-docs2/network/status_code.html#_5xx","539":"/learning-docs2/network/status_code.html#_500-internal-server-error","540":"/learning-docs2/network/status_code.html#_501-not-implemented","541":"/learning-docs2/network/status_code.html#_502-bad-gateway","542":"/learning-docs2/network/status_code.html#_503-service-unavailable","543":"/learning-docs2/network/status_code.html#_504-gateway-timeout","544":"/learning-docs2/network/status_code.html#_511-network-authentication-required","545":"/learning-docs2/network/subnet_mask.html#子网掩码","546":"/learning-docs2/network/subnet_mask.html#背景","547":"/learning-docs2/network/subnet_mask.html#功能","548":"/learning-docs2/network/subnet_mask.html#声明网络地址与主机地址","549":"/learning-docs2/network/subnet_mask.html#划分子网","550":"/learning-docs2/network/subnet_mask.html#变长子网掩码","551":"/learning-docs2/network/subnet_mask.html#无类别域间路由","552":"/learning-docs2/network/tls_ssl.html#https-加密层","553":"/learning-docs2/network/tls_ssl.html#对称加密","554":"/learning-docs2/network/tls_ssl.html#计算密钥","555":"/learning-docs2/network/tls_ssl.html#缺陷","556":"/learning-docs2/network/tls_ssl.html#非对称加密","557":"/learning-docs2/network/tls_ssl.html#加密数据","558":"/learning-docs2/network/tls_ssl.html#缺陷-1","559":"/learning-docs2/network/tls_ssl.html#对称加密-非对称加密","560":"/learning-docs2/network/tls_ssl.html#加密数据-1","561":"/learning-docs2/network/tls_ssl.html#安全性","562":"/learning-docs2/network/tls_ssl.html#ca-证书","563":"/learning-docs2/network/tls_ssl.html#加密方式","564":"/learning-docs2/network/tls_ssl.html#申请数字证书","565":"/learning-docs2/network/tls_ssl.html#ca-数字签名","566":"/learning-docs2/network/tls_ssl.html#验证数字证书","567":"/learning-docs2/network/tls_ssl.html#总结","568":"/learning-docs2/network/tls_ssl.html#数字证书拓展","569":"/learning-docs2/network/webrtc.html#webrtc","570":"/learning-docs2/network/webrtc.html#udp-dtls","571":"/learning-docs2/network/webrtc.html#rtp-srtp-rtcp-srtcp","572":"/learning-docs2/network/webrtc.html#sctp","573":"/learning-docs2/notes/css/bfc.html#html-格式化上下文","574":"/learning-docs2/notes/css/bfc.html#bfc","575":"/learning-docs2/notes/css/bfc.html#css-属性创建-bfc","576":"/learning-docs2/notes/css/bfc.html#解决了什么问题","577":"/learning-docs2/notes/css/bfc.html#ifc","578":"/learning-docs2/notes/css/bfc.html#说明","579":"/learning-docs2/notes/css/bfc.html#flow-layout","580":"/learning-docs2/notes/css/bfc.html#writing-mode","581":"/learning-docs2/notes/css/bfc.html#说明-1","582":"/learning-docs2/notes/css/bfc.html#外边距重叠","583":"/learning-docs2/notes/css/bfc.html#情形","584":"/learning-docs2/notes/css/box.html#盒模型","585":"/learning-docs2/notes/css/box.html#基础盒模型","586":"/learning-docs2/notes/css/box.html#与盒模型相关的css属性","587":"/learning-docs2/notes/css/box.html#视觉格式化模型","588":"/learning-docs2/notes/css/flex.html#flex-扩展","589":"/learning-docs2/notes/css/flex.html#flex-margin","590":"/learning-docs2/notes/css/flex.html#margin-auto","591":"/learning-docs2/notes/css/flex.html#justify-content-align-items","592":"/learning-docs2/notes/css/flex.html#space-between","593":"/learning-docs2/notes/css/flex.html#space-around","594":"/learning-docs2/notes/css/flex.html#align-self-flex-start-flex-end-center","595":"/learning-docs2/notes/css/flex.html#粘性布局","596":"/learning-docs2/notes/css/float.html#float-clear","597":"/learning-docs2/notes/css/float.html#float","598":"/learning-docs2/notes/css/float.html#float-属性取值","599":"/learning-docs2/notes/css/float.html#是否设置宽度","600":"/learning-docs2/notes/css/float.html#是否设置-margin-top","601":"/learning-docs2/notes/css/float.html#clear","602":"/learning-docs2/notes/css/float.html#clearfix","603":"/learning-docs2/notes/css/float.html#clear-属性取值","604":"/learning-docs2/notes/css/#css-选择器","605":"/learning-docs2/notes/css/#元素选择器","606":"/learning-docs2/notes/css/#id-选择器","607":"/learning-docs2/notes/css/#类选择器","608":"/learning-docs2/notes/css/#属性选择器","609":"/learning-docs2/notes/css/#伪类选择器","610":"/learning-docs2/notes/css/#选择器组合","611":"/learning-docs2/notes/css/#","612":"/learning-docs2/notes/css/#空格","613":"/learning-docs2/notes/css/#-1","614":"/learning-docs2/notes/css/#-2","615":"/learning-docs2/notes/css/#-3","616":"/learning-docs2/notes/css/#-4","617":"/learning-docs2/notes/css/#带-符号的选择器","618":"/learning-docs2/notes/css/#namespace","619":"/learning-docs2/notes/css/#charset","620":"/learning-docs2/notes/css/#import","621":"/learning-docs2/notes/css/#media","622":"/learning-docs2/notes/css/#page","623":"/learning-docs2/notes/css/#counter-style","624":"/learning-docs2/notes/css/#key-frames","625":"/learning-docs2/notes/css/#fontface","626":"/learning-docs2/notes/css/#support","627":"/learning-docs2/notes/css/inline.html#行内元素-css","628":"/learning-docs2/notes/css/inline.html#vertical-align","629":"/learning-docs2/notes/css/inline.html#line-height","630":"/learning-docs2/notes/css/inline.html#取值","631":"/learning-docs2/notes/css/pseudo.html#伪元素-伪类","632":"/learning-docs2/notes/css/pseudo.html#伪元素","633":"/learning-docs2/notes/css/pseudo.html#列举","634":"/learning-docs2/notes/css/pseudo.html#伪类","635":"/learning-docs2/notes/css/pseudo.html#列举-1","636":"/learning-docs2/notes/css/replaced.html#可替换元素","637":"/learning-docs2/notes/css/replaced.html#定义","638":"/learning-docs2/notes/css/replaced.html#替换元素","639":"/learning-docs2/notes/css/replaced.html#content-属性","640":"/learning-docs2/notes/css/replaced.html#取值","641":"/learning-docs2/notes/css/replaced.html#counter-counters","642":"/learning-docs2/notes/css/replaced.html#list-style-属性","643":"/learning-docs2/notes/css/text-character.html#文字特性","644":"/learning-docs2/notes/css/text-character.html#例子","645":"/learning-docs2/notes/css/text-character.html#解决方式","646":"/learning-docs2/notes/css/text-character.html#压缩方式","647":"/learning-docs2/notes/css/text-character.html#margin-方式","648":"/learning-docs2/notes/css/text-character.html#忽略闭合标签","649":"/learning-docs2/notes/css/text-character.html#font-size-方式","650":"/learning-docs2/notes/css/text-character.html#float-方式","651":"/learning-docs2/notes/css/text-character.html#flex-布局方式","652":"/learning-docs2/notes/css/visibility.html#visibility","653":"/learning-docs2/notes/css/visibility.html#display","654":"/learning-docs2/notes/css/visibility.html#visibility-1","655":"/learning-docs2/notes/css/visibility.html#content-visibility","656":"/learning-docs2/notes/css/visibility.html#contain","657":"/learning-docs2/notes/css/visibility.html#size","658":"/learning-docs2/notes/css/visibility.html#layout","659":"/learning-docs2/notes/css/visibility.html#style","660":"/learning-docs2/notes/css/visibility.html#paint","661":"/learning-docs2/notes/css/visibility.html#组合使用","662":"/learning-docs2/notes/es/es6.html#es6","663":"/learning-docs2/notes/es/es6.html#let-const","664":"/learning-docs2/notes/es/es6.html#解构赋值","665":"/learning-docs2/notes/es/es6.html#正则的扩展","666":"/learning-docs2/notes/es/es6.html#match-exec-matchall","667":"/learning-docs2/notes/es/es6.html#symbol","668":"/learning-docs2/notes/es/es6.html#set-map","669":"/learning-docs2/notes/es/es6.html#generate","670":"/learning-docs2/notes/es/es6.html#class","671":"/learning-docs2/notes/es/es6.html#arraybuffer","672":"/learning-docs2/notes/es/es6.html#commonjs-es6","673":"/learning-docs2/notes/html/esmodule.html#浏览器-type-module","674":"/learning-docs2/notes/html/esmodule.html#兼容性","675":"/learning-docs2/notes/html/esmodule.html#基本使用","676":"/learning-docs2/notes/html/esmodule.html#路径支持","677":"/learning-docs2/notes/html/esmodule.html#nomodule-noscript","678":"/learning-docs2/notes/html/esmodule.html#加载顺序默认为-defer","679":"/learning-docs2/notes/html/esmodule.html#module-行内执行顺序-defer","680":"/learning-docs2/notes/html/esmodule.html#async-inline-module","681":"/learning-docs2/notes/html/esmodule.html#多次加载只加载一次","682":"/learning-docs2/notes/html/esmodule.html#跨域问题","683":"/learning-docs2/notes/html/esmodule.html#自带凭证-crossorigin","684":"/learning-docs2/notes/html/esmodule.html#mime-type","685":"/learning-docs2/notes/html/seo.html#seo语义化","686":"/learning-docs2/notes/html/seo.html#aside","687":"/learning-docs2/notes/html/seo.html#article","688":"/learning-docs2/notes/html/seo.html#hgroup-h1-h2","689":"/learning-docs2/notes/html/seo.html#abbr","690":"/learning-docs2/notes/html/seo.html#hr","691":"/learning-docs2/notes/html/seo.html#p","692":"/learning-docs2/notes/html/seo.html#strong","693":"/learning-docs2/notes/html/seo.html#blockquote-q-cite","694":"/learning-docs2/notes/html/seo.html#time","695":"/learning-docs2/notes/html/seo.html#figure-figcaption","696":"/learning-docs2/notes/html/seo.html#dfn","697":"/learning-docs2/notes/html/seo.html#nav-ol-ul","698":"/learning-docs2/notes/html/seo.html#pre-samp-code","699":"/learning-docs2/notes/html/seo.html#其他","700":"/learning-docs2/notes/html/unusual.html#你不知道的-html-标签","701":"/learning-docs2/notes/html/unusual.html#meta","702":"/learning-docs2/notes/#just-do-it","703":"/learning-docs2/notes/javascript/URI.html#uri-编码","704":"/learning-docs2/notes/javascript/URI.html#unescape","705":"/learning-docs2/notes/javascript/URI.html#escape","706":"/learning-docs2/notes/javascript/URI.html#encodeuri","707":"/learning-docs2/notes/javascript/URI.html#decodeuri","708":"/learning-docs2/notes/javascript/URI.html#encodeuricomponent","709":"/learning-docs2/notes/javascript/URI.html#decodeuricomponent","710":"/learning-docs2/notes/javascript/addEventListener.html#dom2-级绑定事件","711":"/learning-docs2/notes/javascript/addEventListener.html#addeventlistener","712":"/learning-docs2/notes/javascript/addEventListener.html#api","713":"/learning-docs2/notes/javascript/addEventListener.html#例子","714":"/learning-docs2/notes/javascript/dom.html#dom-类型","715":"/learning-docs2/notes/javascript/dom.html#dom-链","716":"/learning-docs2/notes/javascript/dom.html#dom-操作","717":"/learning-docs2/notes/javascript/dom.html#dom-扩展","718":"/learning-docs2/notes/javascript/dom.html#dom2-dom3","719":"/learning-docs2/notes/javascript/equal.html#js-相等性","720":"/learning-docs2/notes/javascript/equal.html#相等","721":"/learning-docs2/notes/javascript/equal.html#严格相等","722":"/learning-docs2/notes/javascript/equal.html#判断-if","723":"/learning-docs2/notes/javascript/equal.html#比较","724":"/learning-docs2/notes/javascript/event-loop.html#event-loop","725":"/learning-docs2/notes/javascript/event-loop.html#cpu、进程、线程之间的关系","726":"/learning-docs2/notes/javascript/event-loop.html#浏览器是多进程的","727":"/learning-docs2/notes/javascript/event-loop.html#浏览器包含了哪些进程","728":"/learning-docs2/notes/javascript/event-loop.html#主进程","729":"/learning-docs2/notes/javascript/event-loop.html#第三方插件进程","730":"/learning-docs2/notes/javascript/event-loop.html#浏览器内核-渲染进程","731":"/learning-docs2/notes/javascript/event-loop.html#javascript-单线程","732":"/learning-docs2/notes/javascript/event-loop.html#gui-渲染线程与-js-引擎线程互斥","733":"/learning-docs2/notes/javascript/event-loop.html#event-loop-go","734":"/learning-docs2/notes/javascript/jsop.html#js-运算符","735":"/learning-docs2/notes/javascript/jsop.html#控制合并操作符","736":"/learning-docs2/notes/javascript/jsop.html#赋值","737":"/learning-docs2/notes/javascript/jsop.html#短路","738":"/learning-docs2/notes/javascript/jsop.html#可选链式操作符","739":"/learning-docs2/notes/javascript/jsop.html#比较","740":"/learning-docs2/notes/javascript/jsop.html#函数调用","741":"/learning-docs2/notes/javascript/jsop.html#表达式","742":"/learning-docs2/notes/javascript/jsop.html#不能用于赋值","743":"/learning-docs2/notes/javascript/jsop.html#访问数组元素","744":"/learning-docs2/notes/javascript/jsop.html#运算符优先级","745":"/learning-docs2/notes/javascript/mutationObserver.html#mutationobserver","746":"/learning-docs2/notes/javascript/mutationObserver.html#概念","747":"/learning-docs2/notes/javascript/mutationObserver.html#兼容性","748":"/learning-docs2/notes/javascript/mutationObserver.html#用法","749":"/learning-docs2/notes/javascript/mutationObserver.html#api","750":"/learning-docs2/notes/javascript/mutationObserver.html#observe-方法","751":"/learning-docs2/notes/javascript/mutationObserver.html#callback-mutation-records-回调参数属性分析","752":"/learning-docs2/notes/javascript/mutationObserver.html#disconnect-关闭连接","753":"/learning-docs2/notes/javascript/mutationObserver.html#multi-mutaintionobserver-多监听改变","754":"/learning-docs2/notes/javascript/mutationObserver.html#重新使用-mutationobserver-实例","755":"/learning-docs2/notes/javascript/mutationObserver.html#observe-方法第二个参数对象有哪些属性","756":"/learning-docs2/notes/javascript/mutationObserver.html#mutationobserver-设计规范","757":"/learning-docs2/notes/javascript/mutationObserver.html#异步回调和记录队列","758":"/learning-docs2/notes/javascript/mutationObserver.html#takerecords-方法","759":"/learning-docs2/notes/javascript/mutationObserver.html#性能分析","760":"/learning-docs2/notes/javascript/prototype.html#原型","761":"/learning-docs2/notes/javascript/prototype.html#创建一个对象","762":"/learning-docs2/notes/javascript/prototype.html#继承","763":"/learning-docs2/notes/javascript/prototype.html#proto","764":"/learning-docs2/notes/javascript/prototype.html#constructor","765":"/learning-docs2/notes/javascript/scope.html#js-作用域","766":"/learning-docs2/notes/javascript/scope.html#编译原理","767":"/learning-docs2/notes/javascript/scope.html#理解作用域","768":"/learning-docs2/notes/javascript/scope.html#lhs-rhs","769":"/learning-docs2/notes/javascript/scope.html#异常","770":"/learning-docs2/notes/javascript/scope.html#总结","771":"/learning-docs2/notes/javascript/scope.html#词法作用域","772":"/learning-docs2/notes/javascript/scope.html#闭包","773":"/learning-docs2/notes/javascript/scope.html#查找作用域","774":"/learning-docs2/notes/javascript/scope.html#欺骗作用域","775":"/learning-docs2/notes/javascript/scope.html#eval","776":"/learning-docs2/notes/javascript/scope.html#with","777":"/learning-docs2/notes/javascript/scope.html#性能","778":"/learning-docs2/notes/javascript/scope.html#全局作用域","779":"/learning-docs2/notes/javascript/scope.html#函数作用域","780":"/learning-docs2/notes/javascript/scope.html#块级作用域","781":"/learning-docs2/notes/javascript/storage-struct.html#js-的存储结构","782":"/learning-docs2/notes/javascript/storage-struct.html#栈结构","783":"/learning-docs2/notes/javascript/storage-struct.html#调用栈","784":"/learning-docs2/notes/javascript/storage-struct.html#函数调用","785":"/learning-docs2/notes/javascript/storage-struct.html#栈","786":"/learning-docs2/notes/javascript/storage-struct.html#总结","787":"/learning-docs2/notes/javascript/storage-struct.html#栈溢出","788":"/learning-docs2/notes/javascript/storage-struct.html#内存空间","789":"/learning-docs2/notes/javascript/storage-struct.html#代码空间","790":"/learning-docs2/notes/javascript/storage-struct.html#栈空间","791":"/learning-docs2/notes/javascript/storage-struct.html#堆空间","792":"/learning-docs2/notes/javascript/storage-struct.html#js-内存管理-变量分配","793":"/learning-docs2/notes/javascript/storage-struct.html#静态区","794":"/learning-docs2/notes/javascript/storage-struct.html#调用栈-1","795":"/learning-docs2/notes/javascript/storage-struct.html#堆","796":"/learning-docs2/notes/javascript/this.html#关于-this","797":"/learning-docs2/notes/javascript/this.html#误解","798":"/learning-docs2/notes/javascript/this.html#this-全面解析","799":"/learning-docs2/notes/javascript/this.html#调用位置","800":"/learning-docs2/notes/javascript/this.html#绑定规则","801":"/learning-docs2/notes/javascript/this.html#默认绑定","802":"/learning-docs2/notes/javascript/this.html#隐式绑定","803":"/learning-docs2/notes/javascript/this.html#显式绑定","804":"/learning-docs2/notes/javascript/this.html#new-绑定","805":"/learning-docs2/notes/javascript/this.html#绑定优先级","806":"/learning-docs2/notes/javascript/this.html#bind","807":"/learning-docs2/notes/javascript/this.html#注意点","808":"/learning-docs2/notes/javascript/this.html#忽略的-this","809":"/learning-docs2/notes/javascript/this.html#间接引用","810":"/learning-docs2/notes/javascript/this.html#软绑定","811":"/learning-docs2/notes/javascript/this.html#es6-箭头函数","812":"/learning-docs2/notes/nodejs/ansi.html#ansi-escape-sequences","813":"/learning-docs2/notes/nodejs/ansi.html#定义","814":"/learning-docs2/notes/nodejs/ansi.html#转义序列","815":"/learning-docs2/notes/nodejs/ansi.html#csi-序列","816":"/learning-docs2/notes/nodejs/ansi.html#更多","817":"/learning-docs2/notes/nodejs/event-loop.html#nodejs-事件循环","818":"/learning-docs2/notes/nodejs/event-loop.html#理解","819":"/learning-docs2/notes/nodejs/event-loop.html#非阻塞-i-o-操作的设计机制","820":"/learning-docs2/notes/nodejs/event-loop.html#process-nexttick-又是如何执行","821":"/learning-docs2/notes/nodejs/event-loop.html#定时器-timers","822":"/learning-docs2/notes/nodejs/event-loop.html#待定的回调-pending-callbacks","823":"/learning-docs2/notes/nodejs/event-loop.html#idle-prepare","824":"/learning-docs2/notes/nodejs/event-loop.html#轮询-poll","825":"/learning-docs2/notes/nodejs/event-loop.html#检测-check","826":"/learning-docs2/notes/nodejs/event-loop.html#关闭的回调函数-close-callbacks","827":"/learning-docs2/notes/nodejs/event-loop.html#settimeout-vs-setimmediate","828":"/learning-docs2/notes/nodejs/event-loop.html#process-nexttick","829":"/learning-docs2/notes/nodejs/event-loop.html#process-nexttick-vs-setimmediate","830":"/learning-docs2/notes/nodejs/event-loop.html#为什么使用-process-nexttick","831":"/learning-docs2/notes/nodejs/npm.html#package-json","832":"/learning-docs2/notes/nodejs/npm.html#json-配置","833":"/learning-docs2/notes/regexp/base.html#正则表达式","834":"/learning-docs2/notes/regexp/unknown.html#你不知道的正则表达式","835":"/learning-docs2/notes/regexp/unknown.html#逗号分隔千分位","836":"/learning-docs2/notes/typescript/advanced.html#typescript-高级","837":"/learning-docs2/notes/typescript/advanced.html#advanced-type","838":"/learning-docs2/notes/typescript/advanced.html#utility-types","839":"/learning-docs2/notes/typescript/advanced.html#modules","840":"/learning-docs2/notes/typescript/advanced.html#import-a-moudle-from-side-effects-only","841":"/learning-docs2/notes/typescript/advanced.html#importing-types","842":"/learning-docs2/notes/typescript/advanced.html#optional-module-loading","843":"/learning-docs2/notes/typescript/advanced.html#ambient-modules","844":"/learning-docs2/notes/typescript/advanced.html#umd-modules","845":"/learning-docs2/notes/typescript/advanced.html#module-resolution","846":"/learning-docs2/notes/typescript/advanced.html#相对路径-非相对路径","847":"/learning-docs2/notes/typescript/advanced.html#常见解析-classic","848":"/learning-docs2/notes/typescript/advanced.html#node-js-解析","849":"/learning-docs2/notes/typescript/advanced.html#typescript-解析","850":"/learning-docs2/notes/typescript/advanced.html#baseurl-配置","851":"/learning-docs2/notes/typescript/advanced.html#测试解析路径","852":"/learning-docs2/notes/typescript/advanced.html#namespaces","853":"/learning-docs2/notes/typescript/advanced.html#namespaces-modules","854":"/learning-docs2/notes/typescript/advanced.html#triple-slash-directives","855":"/learning-docs2/notes/typescript/basic.html#typescript-基础","856":"/learning-docs2/notes/typescript/basic.html#tsconfig-json-jsconfig-json-文件","857":"/learning-docs2/notes/typescript/basic.html#配置参数","858":"/learning-docs2/notes/typescript/basic.html#cli","859":"/learning-docs2/notes/typescript/basic.html#basic-type","860":"/learning-docs2/notes/typescript/basic.html#interfaces","861":"/learning-docs2/notes/typescript/basic.html#functions","862":"/learning-docs2/notes/typescript/basic.html#literal-types","863":"/learning-docs2/notes/typescript/basic.html#union-and-intersection-types","864":"/learning-docs2/notes/typescript/basic.html#classes","865":"/learning-docs2/notes/typescript/basic.html#enum","866":"/learning-docs2/notes/typescript/basic.html#generics","867":"/learning-docs2/notes/typescript/lib-struct.html#typescript-文件结构定义","868":"/learning-docs2/notes/typescript/lib-struct.html#模块化","869":"/learning-docs2/notes/typescript/lib-struct.html#模块模板","870":"/learning-docs2/notes/typescript/lib-struct.html#module-d-ts","871":"/learning-docs2/notes/typescript/lib-struct.html#全局模板","872":"/learning-docs2/notes/typescript/lib-struct.html#do-s-don-ts","873":"/learning-docs2/notes/typescript/lib-struct.html#deep-dive","874":"/learning-docs2/notes/typescript/lib-struct.html#高级组合","875":"/learning-docs2/source-code/#导航","876":"/learning-docs2/source-code/react/api/context.html#context","877":"/learning-docs2/source-code/react/api/ref.html#ref","878":"/learning-docs2/source-code/vue/#开始"},"fieldIds":{"title":0,"titles":1,"text":2},"fieldLength":{"0":[3,1,10],"1":[1,3,9],"2":[1,3,7],"3":[1,1,2],"4":[1,1,11],"5":[1,1,1],"6":[1,1,5],"7":[1,1,5],"8":[1,1,18],"9":[1,1,4],"10":[1,1,2],"11":[1,1,1],"12":[1,2,41],"13":[2,2,29],"14":[1,2,14],"15":[1,2,11],"16":[1,3,22],"17":[2,2,3],"18":[1,2,12],"19":[1,3,16],"20":[1,2,25],"21":[1,3,16],"22":[1,1,6],"23":[2,1,24],"24":[2,3,18],"25":[1,3,4],"26":[1,3,2],"27":[1,3,2],"28":[2,3,1],"29":[1,3,1],"30":[1,3,1],"31":[1,1,1],"32":[1,1,1],"33":[1,2,16],"34":[1,2,12],"35":[1,2,17],"36":[1,1,1],"37":[1,2,3],"38":[1,2,7],"39":[1,1,2],"40":[1,1,3],"41":[1,1,12],"42":[1,1,17],"43":[1,2,17],"44":[1,2,8],"45":[1,2,3],"46":[1,2,5],"47":[1,2,10],"48":[1,1,12],"49":[1,1,2],"50":[1,2,35],"51":[1,2,24],"52":[1,2,20],"53":[2,2,21],"54":[1,1,1],"55":[1,2,15],"56":[1,1,25],"57":[1,1,3],"58":[1,1,8],"59":[1,2,20],"60":[1,2,15],"61":[1,1,16],"62":[1,1,7],"63":[1,2,14],"64":[1,2,19],"65":[1,2,39],"66":[1,2,5],"67":[1,1,18],"68":[1,1,5],"69":[1,1,2],"70":[1,2,2],"71":[1,2,2],"72":[2,2,7],"73":[1,1,5],"74":[1,1,2],"75":[1,2,3],"76":[1,3,18],"77":[2,3,9],"78":[1,2,4],"79":[1,3,20],"80":[2,3,3],"81":[1,2,4],"82":[1,3,22],"83":[2,3,8],"84":[1,1,2],"85":[1,2,3],"86":[1,3,18],"87":[2,3,10],"88":[1,2,3],"89":[1,3,19],"90":[2,3,2],"91":[1,2,5],"92":[1,3,30],"93":[2,3,9],"94":[2,1,5],"95":[2,3,32],"96":[3,3,8],"97":[3,3,9],"98":[1,3,83],"99":[1,1,10],"100":[2,1,8],"101":[1,3,7],"102":[1,3,19],"103":[1,3,3],"104":[1,3,68],"105":[1,3,5],"106":[1,3,85],"107":[1,1,8],"108":[1,1,11],"109":[1,1,7],"110":[1,1,13],"111":[1,1,7],"112":[1,2,25],"113":[1,3,76],"114":[1,3,89],"115":[2,3,12],"116":[1,3,11],"117":[1,1,2],"118":[1,2,1],"119":[1,2,1],"120":[1,2,1],"121":[1,1,2],"122":[1,2,2],"123":[1,2,2],"124":[1,1,1],"125":[1,2,3],"126":[1,2,3],"127":[1,1,1],"128":[1,2,11],"129":[1,2,5],"130":[2,1,12],"131":[3,2,53],"132":[1,5,31],"133":[2,2,1],"134":[2,4,40],"135":[3,4,10],"136":[3,4,4],"137":[3,7,35],"138":[3,7,14],"139":[3,7,53],"140":[3,4,5],"141":[1,6,13],"142":[3,2,8],"143":[2,5,73],"144":[4,5,31],"145":[5,5,17],"146":[5,5,30],"147":[3,10,100],"148":[2,1,1],"149":[1,2,23],"150":[1,1,1],"151":[1,1,15],"152":[1,1,1],"153":[1,1,14],"154":[1,1,3],"155":[2,2,22],"156":[4,2,58],"157":[2,2,31],"158":[4,2,35],"159":[3,2,30],"160":[2,2,37],"161":[2,2,10],"162":[1,3,20],"163":[2,3,15],"164":[1,3,4],"165":[2,1,2],"166":[1,2,11],"167":[2,2,44],"168":[2,2,140],"169":[1,1,1],"170":[1,1,19],"171":[2,1,1],"172":[1,2,16],"173":[1,2,7],"174":[1,2,21],"175":[1,1,3],"176":[1,2,6],"177":[1,2,3],"178":[1,2,6],"179":[1,2,5],"180":[1,2,2],"181":[1,2,15],"182":[1,2,26],"183":[1,2,18],"184":[1,2,9],"185":[1,2,12],"186":[1,1,4],"187":[1,1,5],"188":[7,1,94],"189":[3,1,12],"190":[1,4,55],"191":[1,4,84],"192":[1,1,4],"193":[2,1,1],"194":[2,2,10],"195":[1,4,58],"196":[2,2,32],"197":[1,4,6],"198":[1,4,39],"199":[2,4,3],"200":[1,6,34],"201":[1,6,21],"202":[1,6,21],"203":[1,6,19],"204":[1,2,1],"205":[2,3,10],"206":[1,3,32],"207":[1,1,1],"208":[2,1,50],"209":[2,1,18],"210":[3,1,42],"211":[3,1,33],"212":[3,1,11],"213":[1,3,7],"214":[1,3,4],"215":[1,3,1],"216":[2,4,10],"217":[2,4,17],"218":[2,4,40],"219":[2,4,31],"220":[1,3,1],"221":[2,4,62],"222":[2,4,25],"223":[1,3,20],"224":[1,4,36],"225":[1,4,27],"226":[1,4,79],"227":[1,4,54],"228":[1,4,9],"229":[1,4,28],"230":[1,4,39],"231":[4,4,14],"232":[1,4,37],"233":[1,4,19],"234":[1,4,31],"235":[1,1,2],"236":[1,1,10],"237":[1,1,23],"238":[1,1,9],"239":[2,1,12],"240":[2,1,13],"241":[2,1,9],"242":[2,1,18],"243":[2,1,8],"244":[1,3,8],"245":[1,3,8],"246":[1,3,23],"247":[3,3,6],"248":[3,1,4],"249":[2,1,6],"250":[1,1,22],"251":[2,1,12],"252":[1,1,15],"253":[1,1,173],"254":[1,1,4],"255":[2,1,6],"256":[1,3,28],"257":[1,3,27],"258":[2,1,2],"259":[1,3,22],"260":[1,3,3],"261":[2,1,2],"262":[1,3,19],"263":[1,3,18],"264":[2,3,4],"265":[1,3,25],"266":[1,3,13],"267":[2,1,1],"268":[2,2,55],"269":[2,2,21],"270":[2,2,14],"271":[2,2,62],"272":[2,1,2],"273":[1,2,1],"274":[1,3,13],"275":[1,3,14],"276":[1,3,8],"277":[1,3,10],"278":[2,3,2],"279":[1,3,4],"280":[1,2,22],"281":[3,3,3],"282":[1,3,19],"283":[1,2,41],"284":[2,2,16],"285":[1,2,1],"286":[1,3,1],"287":[1,4,12],"288":[1,4,10],"289":[1,3,13],"290":[1,3,13],"291":[1,2,3],"292":[1,3,4],"293":[1,3,7],"294":[1,3,40],"295":[6,2,7],"296":[3,8,15],"297":[3,8,17],"298":[1,8,19],"299":[1,8,8],"300":[1,1,5],"301":[1,1,10],"302":[1,1,1],"303":[2,2,27],"304":[2,2,18],"305":[1,1,14],"306":[1,1,12],"307":[1,1,1],"308":[1,2,1],"309":[2,2,34],"310":[3,1,4],"311":[1,3,18],"312":[1,3,20],"313":[1,3,1],"314":[2,1,3],"315":[2,2,3],"316":[1,4,11],"317":[1,4,13],"318":[1,4,15],"319":[2,2,2],"320":[1,4,9],"321":[1,4,22],"322":[1,4,15],"323":[1,2,8],"324":[1,1,44],"325":[2,1,1],"326":[1,2,98],"327":[2,1,1],"328":[2,2,9],"329":[1,4,8],"330":[1,4,16],"331":[1,1,1],"332":[5,1,1],"333":[1,6,6],"334":[1,1,1],"335":[1,1,2],"336":[3,1,6],"337":[1,3,7],"338":[1,3,4],"339":[1,3,33],"340":[1,3,2],"341":[1,3,6],"342":[1,3,10],"343":[1,3,10],"344":[1,3,12],"345":[1,3,64],"346":[2,1,2],"347":[1,2,44],"348":[2,2,12],"349":[1,3,18],"350":[1,3,18],"351":[1,4,13],"352":[1,4,15],"353":[2,3,19],"354":[1,2,25],"355":[1,2,1],"356":[1,2,19],"357":[1,2,18],"358":[1,2,8],"359":[2,2,19],"360":[1,2,7],"361":[1,2,8],"362":[1,2,10],"363":[1,2,11],"364":[1,2,13],"365":[1,2,13],"366":[1,2,11],"367":[1,2,11],"368":[1,2,16],"369":[1,1,11],"370":[1,1,2],"371":[1,2,1],"372":[1,2,1],"373":[2,2,1],"374":[1,2,1],"375":[1,2,1],"376":[1,1,7],"377":[1,1,2],"378":[1,1,5],"379":[1,1,9],"380":[1,2,52],"381":[1,2,15],"382":[1,2,16],"383":[1,1,3],"384":[1,1,4],"385":[1,1,2],"386":[1,1,4],"387":[1,1,2],"388":[1,1,4],"389":[1,1,4],"390":[1,1,4],"391":[1,1,5],"392":[1,1,3],"393":[1,1,9],"394":[1,1,10],"395":[1,1,12],"396":[1,1,17],"397":[1,1,4],"398":[1,1,1],"399":[1,2,20],"400":[2,2,11],"401":[1,1,4],"402":[1,1,45],"403":[1,2,8],"404":[2,1,11],"405":[1,1,15],"406":[2,1,7],"407":[4,3,2],"408":[4,3,5],"409":[4,3,5],"410":[4,3,5],"411":[4,3,4],"412":[4,3,2],"413":[4,3,5],"414":[4,3,5],"415":[1,3,2],"416":[1,1,13],"417":[2,2,3],"418":[1,1,1],"419":[2,2,45],"420":[1,1,7],"421":[3,1,26],"422":[3,1,52],"423":[1,1,23],"424":[1,2,61],"425":[2,2,29],"426":[1,1,1],"427":[1,1,28],"428":[2,1,163],"429":[1,3,84],"430":[1,3,3],"431":[3,3,1],"432":[2,1,19],"433":[1,1,52],"434":[2,1,6],"435":[2,2,2],"436":[2,2,2],"437":[2,2,1],"438":[1,3,2],"439":[1,3,16],"440":[2,2,33],"441":[2,3,8],"442":[2,3,7],"443":[2,3,8],"444":[2,3,10],"445":[2,3,4],"446":[1,3,37],"447":[2,2,8],"448":[1,1,1],"449":[1,1,1],"450":[2,1,7],"451":[1,2,2],"452":[1,2,6],"453":[1,2,6],"454":[3,3,9],"455":[1,2,4],"456":[1,2,5],"457":[1,2,4],"458":[1,2,3],"459":[1,2,16],"460":[1,2,4],"461":[1,2,41],"462":[1,1,1],"463":[1,1,16],"464":[1,1,16],"465":[1,1,15],"466":[1,1,22],"467":[2,1,9],"468":[1,1,1],"469":[1,1,5],"470":[2,1,5],"471":[1,2,12],"472":[1,2,4],"473":[1,2,4],"474":[1,2,8],"475":[1,2,11],"476":[1,2,26],"477":[1,2,12],"478":[3,1,14],"479":[1,4,9],"480":[1,4,47],"481":[1,4,29],"482":[1,4,13],"483":[1,4,11],"484":[1,1,1],"485":[1,1,9],"486":[1,1,4],"487":[1,1,21],"488":[1,1,7],"489":[1,2,16],"490":[1,2,35],"491":[1,2,9],"492":[2,2,1],"493":[5,4,12],"494":[1,2,45],"495":[2,1,1],"496":[1,2,8],"497":[1,3,5],"498":[1,3,4],"499":[3,2,6],"500":[2,1,7],"501":[1,2,11],"502":[2,3,3],"503":[3,3,6],"504":[4,3,6],"505":[4,3,4],"506":[1,2,5],"507":[2,3,3],"508":[2,3,8],"509":[2,3,5],"510":[6,3,3],"511":[3,3,9],"512":[3,3,6],"513":[4,3,5],"514":[4,3,3],"515":[4,3,2],"516":[4,3,2],"517":[1,2,6],"518":[3,3,3],"519":[3,3,5],"520":[4,3,2],"521":[3,3,14],"522":[3,3,11],"523":[3,3,2],"524":[3,3,2],"525":[3,3,5],"526":[4,3,4],"527":[1,2,2],"528":[3,3,4],"529":[3,3,4],"530":[3,3,4],"531":[2,3,5],"532":[3,3,4],"533":[4,3,2],"534":[3,3,4],"535":[5,3,2],"536":[3,3,2],"537":[4,3,3],"538":[1,2,3],"539":[4,3,3],"540":[3,3,4],"541":[3,3,3],"542":[3,3,4],"543":[3,3,3],"544":[4,3,5],"545":[1,1,16],"546":[1,1,14],"547":[1,1,11],"548":[1,2,29],"549":[1,2,7],"550":[1,1,20],"551":[1,1,14],"552":[2,1,11],"553":[1,2,10],"554":[1,3,13],"555":[1,3,9],"556":[1,2,8],"557":[1,3,4],"558":[1,3,5],"559":[3,2,19],"560":[1,5,11],"561":[1,5,7],"562":[2,2,6],"563":[1,4,17],"564":[1,4,17],"565":[2,4,8],"566":[1,4,16],"567":[1,4,9],"568":[1,2,35],"569":[1,1,11],"570":[2,1,2],"571":[4,1,9],"572":[1,1,7],"573":[2,1,1],"574":[1,2,8],"575":[3,3,65],"576":[1,3,9],"577":[1,2,11],"578":[1,3,5],"579":[2,2,6],"580":[2,2,15],"581":[1,4,5],"582":[1,2,14],"583":[1,3,33],"584":[1,1,3],"585":[1,1,6],"586":[1,1,22],"587":[1,1,13],"588":[2,1,1],"589":[3,2,7],"590":[2,4,21],"591":[4,4,15],"592":[2,4,23],"593":[2,4,18],"594":[6,4,32],"595":[1,4,22],"596":[3,1,3],"597":[1,3,3],"598":[2,3,8],"599":[1,3,22],"600":[3,3,12],"601":[1,3,3],"602":[1,3,14],"603":[2,3,6],"604":[2,1,1],"605":[1,2,2],"606":[2,2,2],"607":[1,2,2],"608":[1,2,5],"609":[1,2,3],"610":[1,2,1],"611":[1,3,2],"612":[1,3,2],"613":[1,3,2],"614":[2,3,2],"615":[1,3,2],"616":[1,3,9],"617":[2,2,1],"618":[2,4,28],"619":[2,4,2],"620":[2,4,4],"621":[2,4,2],"622":[2,4,2],"623":[3,4,2],"624":[3,4,2],"625":[2,4,2],"626":[2,4,4],"627":[2,1,8],"628":[2,2,8],"629":[2,2,5],"630":[1,4,11],"631":[2,1,1],"632":[1,2,9],"633":[1,2,16],"634":[1,2,3],"635":[1,2,57],"636":[1,1,4],"637":[1,1,13],"638":[1,1,14],"639":[2,1,7],"640":[1,3,21],"641":[2,3,24],"642":[3,1,3],"643":[1,1,20],"644":[1,1,20],"645":[1,1,1],"646":[1,2,19],"647":[2,2,22],"648":[1,2,10],"649":[3,2,10],"650":[2,2,13],"651":[2,2,13],"652":[1,1,3],"653":[1,1,8],"654":[1,1,8],"655":[2,1,26],"656":[1,1,7],"657":[1,2,4],"658":[1,2,10],"659":[1,2,7],"660":[1,2,11],"661":[1,2,11],"662":[1,1,3],"663":[3,1,7],"664":[1,1,21],"665":[1,1,1],"666":[4,2,126],"667":[1,1,29],"668":[3,1,64],"669":[1,1,109],"670":[1,1,29],"671":[1,1,40],"672":[2,1,51],"673":[5,1,1],"674":[1,5,10],"675":[1,5,30],"676":[1,5,4],"677":[3,5,20],"678":[2,5,16],"679":[3,5,16],"680":[4,5,21],"681":[1,5,19],"682":[1,5,27],"683":[2,5,35],"684":[2,5,20],"685":[1,1,4],"686":[1,1,2],"687":[1,1,2],"688":[3,1,8],"689":[1,1,12],"690":[1,1,2],"691":[1,1,2],"692":[1,1,2],"693":[3,1,14],"694":[1,1,13],"695":[2,1,3],"696":[1,1,2],"697":[3,1,2],"698":[3,1,14],"699":[1,1,1],"700":[3,1,1],"701":[1,3,48],"702":[3,1,6],"703":[2,1,12],"704":[1,2,3],"705":[1,2,3],"706":[1,2,10],"707":[1,2,2],"708":[1,2,2],"709":[1,2,2],"710":[2,1,1],"711":[1,2,3],"712":[1,3,22],"713":[1,3,29],"714":[2,1,1],"715":[2,2,60],"716":[2,2,42],"717":[2,2,86],"718":[2,2,201],"719":[2,1,8],"720":[2,2,2],"721":[2,2,1],"722":[3,2,1],"723":[5,2,16],"724":[2,1,6],"725":[3,2,13],"726":[1,2,6],"727":[1,2,1],"728":[1,3,15],"729":[1,3,17],"730":[3,2,44],"731":[3,2,5],"732":[5,2,4],"733":[3,2,33],"734":[2,1,2],"735":[2,2,10],"736":[1,4,18],"737":[1,4,32],"738":[2,2,9],"739":[1,4,10],"740":[1,4,6],"741":[1,4,9],"742":[1,4,15],"743":[1,4,6],"744":[1,2,14],"745":[1,1,1],"746":[1,1,15],"747":[1,1,1],"748":[1,1,14],"749":[1,1,3],"750":[2,2,22],"751":[4,2,58],"752":[2,2,31],"753":[4,2,35],"754":[3,2,30],"755":[2,2,37],"756":[2,2,10],"757":[1,3,20],"758":[2,3,15],"759":[1,3,4],"760":[1,1,3],"761":[1,1,90],"762":[1,1,90],"763":[2,1,26],"764":[1,1,35],"765":[2,1,7],"766":[1,2,20],"767":[1,2,5],"768":[2,3,6],"769":[1,3,9],"770":[1,3,24],"771":[1,2,8],"772":[1,3,7],"773":[1,3,8],"774":[1,3,5],"775":[1,4,28],"776":[1,4,25],"777":[1,4,16],"778":[1,3,1],"779":[1,3,1],"780":[1,3,4],"781":[2,1,1],"782":[1,2,1],"783":[1,3,2],"784":[1,3,3],"785":[1,3,3],"786":[1,3,8],"787":[1,3,5],"788":[1,2,16],"789":[1,3,2],"790":[1,3,3],"791":[1,3,3],"792":[3,2,1],"793":[1,4,3],"794":[1,4,10],"795":[1,4,10],"796":[2,1,15],"797":[1,2,39],"798":[2,2,1],"799":[1,3,7],"800":[1,3,4],"801":[1,4,25],"802":[1,4,27],"803":[1,4,30],"804":[2,4,21],"805":[1,3,8],"806":[1,4,56],"807":[1,3,1],"808":[2,4,20],"809":[1,4,14],"810":[1,4,35],"811":[2,3,7],"812":[3,1,16],"813":[1,3,4],"814":[1,3,29],"815":[2,3,99],"816":[1,1,2],"817":[2,1,1],"818":[1,2,1],"819":[4,3,53],"820":[4,3,40],"821":[2,2,17],"822":[3,2,10],"823":[2,2,2],"824":[2,2,34],"825":[2,2,12],"826":[3,2,12],"827":[4,2,15],"828":[2,2,19],"829":[5,4,8],"830":[4,4,6],"831":[2,1,4],"832":[2,2,57],"833":[1,1,6],"834":[1,1,1],"835":[1,1,20],"836":[2,1,1],"837":[2,2,62],"838":[2,2,59],"839":[1,2,10],"840":[7,3,10],"841":[2,3,18],"842":[3,3,25],"843":[2,3,33],"844":[2,3,26],"845":[2,2,2],"846":[3,4,11],"847":[2,4,12],"848":[3,4,32],"849":[2,4,29],"850":[2,4,54],"851":[1,4,6],"852":[1,2,48],"853":[3,2,20],"854":[3,2,47],"855":[2,1,1],"856":[4,2,1],"857":[1,6,138],"858":[1,6,28],"859":[2,2,76],"860":[1,2,79],"861":[1,2,34],"862":[2,2,20],"863":[4,2,26],"864":[1,2,57],"865":[1,2,45],"866":[1,2,70],"867":[2,1,5],"868":[1,2,6],"869":[1,2,7],"870":[3,3,41],"871":[1,2,21],"872":[5,2,28],"873":[2,2,1],"874":[1,4,30],"875":[1,1,1],"876":[1,1,77],"877":[1,1,47],"878":[1,1,1]},"averageFieldLength":[1.6177474402730367,2.321956769055743,15.731513083048911],"storedFields":{"0":{"title":"大 O 表示法","titles":[]},"1":{"title":"时间复杂度","titles":["大 O 表示法"]},"2":{"title":"空间复杂度","titles":["大 O 表示法"]},"3":{"title":"位运算","titles":[]},"4":{"title":"常用的位运算操作","titles":["位运算"]},"5":{"title":"复杂的位运算操作","titles":["位运算"]},"6":{"title":"红黑树","titles":[]},"7":{"title":"特点","titles":["红黑树"]},"8":{"title":"实现","titles":["红黑树"]},"9":{"title":"开启之路","titles":[]},"10":{"title":"数据结构辅助记忆","titles":[]},"11":{"title":"常见的数据结构","titles":["数据结构辅助记忆"]},"12":{"title":"堆","titles":["数据结构辅助记忆","常见的数据结构"]},"13":{"title":"Hash 表","titles":["数据结构辅助记忆","常见的数据结构"]},"14":{"title":"字典树","titles":["数据结构辅助记忆","常见的数据结构"]},"15":{"title":"图","titles":["数据结构辅助记忆","常见的数据结构"]},"16":{"title":"探测环","titles":["数据结构辅助记忆","常见的数据结构","图"]},"17":{"title":"Disjoin Set","titles":["数据结构辅助记忆","常见的数据结构"]},"18":{"title":"链表","titles":["数据结构辅助记忆","常见的数据结构"]},"19":{"title":"链表倒转","titles":["数据结构辅助记忆","常见的数据结构","链表"]},"20":{"title":"树","titles":["数据结构辅助记忆","常见的数据结构"]},"21":{"title":"注意点","titles":["数据结构辅助记忆","常见的数据结构","树"]},"22":{"title":"架构","titles":[]},"23":{"title":"A-YZ","titles":[]},"24":{"title":"UI 自动化","titles":["A-YZ",null]},"25":{"title":"接口测试","titles":["A-YZ",null]},"26":{"title":"单元测试","titles":["A-YZ",null]},"27":{"title":"基础库变更报警","titles":["A-YZ",null]},"28":{"title":"sentry 报警","titles":["A-YZ",null]},"29":{"title":"业务报警","titles":["A-YZ",null]},"30":{"title":"约定规范","titles":["A-YZ",null]},"31":{"title":"组件化与模块化设计","titles":[]},"32":{"title":"模块化设计","titles":["组件化与模块化设计"]},"33":{"title":"应用的模块与层级划分","titles":["组件化与模块化设计","模块化设计"]},"34":{"title":"模块划分与设计原则","titles":["组件化与模块化设计","模块化设计"]},"35":{"title":"如何进行模块间依赖的解耦","titles":["组件化与模块化设计","模块化设计"]},"36":{"title":"组件化设计","titles":["组件化与模块化设计"]},"37":{"title":"组件划分","titles":["组件化与模块化设计","组件化设计"]},"38":{"title":"组件封装","titles":["组件化与模块化设计","组件化设计"]},"39":{"title":"前端监控体系","titles":[]},"40":{"title":"为什么","titles":["前端监控体系"]},"41":{"title":"监控内容","titles":["前端监控体系"]},"42":{"title":"数据埋点与收集","titles":["前端监控体系"]},"43":{"title":"系统生命周期","titles":["前端监控体系","数据埋点与收集"]},"44":{"title":"系统异常","titles":["前端监控体系","数据埋点与收集"]},"45":{"title":"用户日志","titles":["前端监控体系","数据埋点与收集"]},"46":{"title":"数据上报","titles":["前端监控体系","数据埋点与收集"]},"47":{"title":"数据监控","titles":["前端监控体系","数据埋点与收集"]},"48":{"title":"前端性能优化","titles":[]},"49":{"title":"时间角度","titles":["前端性能优化"]},"50":{"title":"网络请求优化","titles":["前端性能优化","时间角度"]},"51":{"title":"首屏加载优化","titles":["前端性能优化","时间角度"]},"52":{"title":"渲染过程优化","titles":["前端性能优化","时间角度"]},"53":{"title":"计算/逻辑提速","titles":["前端性能优化","时间角度"]},"54":{"title":"空间角度","titles":["前端性能优化"]},"55":{"title":"降低资源占用","titles":["前端性能优化","空间角度"]},"56":{"title":"性能数据","titles":["前端性能优化"]},"57":{"title":"项目设计","titles":[]},"58":{"title":"技术方案设计与选型","titles":["项目设计"]},"59":{"title":"技术选型的影响因素","titles":["项目设计","技术方案设计与选型"]},"60":{"title":"多人协作与团队规范","titles":["项目设计","技术方案设计与选型"]},"61":{"title":"前端工程化","titles":["项目设计"]},"62":{"title":"大型项目痛点","titles":["项目设计"]},"63":{"title":"模块耦合严重","titles":["项目设计","大型项目痛点"]},"64":{"title":"项目复杂熟悉成本过高","titles":["项目设计","大型项目痛点"]},"65":{"title":"项目代码量过大","titles":["项目设计","大型项目痛点"]},"66":{"title":"问题定位效率低","titles":["项目设计","大型项目痛点"]},"67":{"title":"项目前期准备与复盘","titles":["项目设计"]},"68":{"title":"XSS","titles":[]},"69":{"title":"类型","titles":["XSS"]},"70":{"title":"反射型","titles":["XSS","类型"]},"71":{"title":"存储型","titles":["XSS","类型"]},"72":{"title":"DOM 跨站","titles":["XSS","类型"]},"73":{"title":"防抖节流","titles":[]},"74":{"title":"防抖","titles":["防抖节流"]},"75":{"title":"正常防抖","titles":["防抖节流","防抖"]},"76":{"title":"代码实现","titles":["防抖节流","防抖","正常防抖"]},"77":{"title":"lodash 类似实现用法","titles":["防抖节流","防抖","正常防抖"]},"78":{"title":"立即执行防抖函数I","titles":["防抖节流","防抖"]},"79":{"title":"代码执行","titles":["防抖节流","防抖","立即执行防抖函数I"]},"80":{"title":"lodash 类似实现用法","titles":["防抖节流","防抖","立即执行防抖函数I"]},"81":{"title":"立即执行防抖函数II","titles":["防抖节流","防抖"]},"82":{"title":"代码实现","titles":["防抖节流","防抖","立即执行防抖函数II"]},"83":{"title":"lodash 类似实现用法","titles":["防抖节流","防抖","立即执行防抖函数II"]},"84":{"title":"节流","titles":["防抖节流"]},"85":{"title":"节流非定时器版","titles":["防抖节流","节流"]},"86":{"title":"代码实现","titles":["防抖节流","节流","节流非定时器版"]},"87":{"title":"lodash 类似实现用法","titles":["防抖节流","节流","节流非定时器版"]},"88":{"title":"节流定时器版","titles":["防抖节流","节流"]},"89":{"title":"代码实现","titles":["防抖节流","节流","节流定时器版"]},"90":{"title":"lodash 类似实现用法","titles":["防抖节流","节流","节流定时器版"]},"91":{"title":"节流最终执行","titles":["防抖节流","节流"]},"92":{"title":"代码实现","titles":["防抖节流","节流","节流最终执行"]},"93":{"title":"lodash 类似实现用法","titles":["防抖节流","节流","节流最终执行"]},"94":{"title":"lodash 实现","titles":["防抖节流"]},"95":{"title":"lodash 的参数","titles":["防抖节流","lodash 实现"]},"96":{"title":"lodash debounce 默认调用","titles":["防抖节流","lodash 实现"]},"97":{"title":"lodash throttle 默认调用","titles":["防抖节流","lodash 实现"]},"98":{"title":"源码实现","titles":["防抖节流","lodash 实现"]},"99":{"title":"实现一个简易热更新","titles":[]},"100":{"title":"实现思考？","titles":["实现一个简易热更新"]},"101":{"title":"思考一","titles":["实现一个简易热更新","实现思考？"]},"102":{"title":"解答","titles":["实现一个简易热更新","实现思考？","思考一"]},"103":{"title":"思考二","titles":["实现一个简易热更新","实现思考？"]},"104":{"title":"解答","titles":["实现一个简易热更新","实现思考？","思考二"]},"105":{"title":"思考三","titles":["实现一个简易热更新","实现思考？"]},"106":{"title":"解答","titles":["实现一个简易热更新","实现思考？","思考三"]},"107":{"title":"环境准备","titles":["实现一个简易热更新"]},"108":{"title":"目录搭建","titles":["实现一个简易热更新"]},"109":{"title":"项目启动","titles":["实现一个简易热更新"]},"110":{"title":"前端文档","titles":[]},"111":{"title":"前端文档浅思考","titles":["前端文档"]},"112":{"title":"富文本编辑","titles":["前端文档","前端文档浅思考"]},"113":{"title":"操作富文本","titles":["前端文档","前端文档浅思考","富文本编辑"]},"114":{"title":"富文本选区","titles":["前端文档","前端文档浅思考","富文本编辑"]},"115":{"title":"操作范围 DOM2","titles":["前端文档","前端文档浅思考","富文本编辑"]},"116":{"title":"复合事件","titles":["前端文档","前端文档浅思考","富文本编辑"]},"117":{"title":"前端文档深思考","titles":["前端文档"]},"118":{"title":"同构表VS异构表","titles":["前端文档","前端文档深思考"]},"119":{"title":"文档技术","titles":["前端文档","前端文档深思考"]},"120":{"title":"在线协同","titles":["前端文档","前端文档深思考"]},"121":{"title":"前端文档应用","titles":["前端文档"]},"122":{"title":"钉钉","titles":["前端文档","前端文档应用"]},"123":{"title":"语雀","titles":["前端文档","前端文档应用"]},"124":{"title":"前端文档性能","titles":["前端文档"]},"125":{"title":"大数据","titles":["前端文档","前端文档性能"]},"126":{"title":"最大单元格数","titles":["前端文档","前端文档性能"]},"127":{"title":"前端文档展望","titles":["前端文档"]},"128":{"title":"\\b复杂度","titles":["前端文档","前端文档展望"]},"129":{"title":"未来","titles":["前端文档","前端文档展望"]},"130":{"title":"HtmlWepbackPlugin 源码分析","titles":[]},"131":{"title":"简易的写一个 HWP 插件","titles":["HtmlWepbackPlugin 源码分析"]},"132":{"title":"简易实现问题","titles":["HtmlWepbackPlugin 源码分析","简易的写一个 HWP 插件"]},"133":{"title":"HWP 源码实现","titles":["HtmlWepbackPlugin 源码分析"]},"134":{"title":"Webpack 配置","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现"]},"135":{"title":"写一个 Webpack 插件","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现"]},"136":{"title":"使用到的 webpack compiler","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现"]},"137":{"title":"compiler.hooks.thisCompilation","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现","使用到的 webpack compiler"]},"138":{"title":"compiler.hooks.make","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现","使用到的 webpack compiler"]},"139":{"title":"compiler.hooks.emit","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现","使用到的 webpack compiler"]},"140":{"title":"HWP 创建一个子解析器 childCompiler","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现"]},"141":{"title":"CreateChildCompiler","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现","HWP 创建一个子解析器 childCompiler"]},"142":{"title":"动手实现一个 HWP 插件","titles":["HtmlWepbackPlugin 源码分析"]},"143":{"title":"创建 childCompiler","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件"]},"144":{"title":"index.html 解析器 loader","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件"]},"145":{"title":"开始注入 js css favicon 文件","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件"]},"146":{"title":"title 如何注入到 index.html 中","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件"]},"147":{"title":"NodeJS VM 模块","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件","title 如何注入到 index.html 中"]},"148":{"title":"你不知道的 JS","titles":[]},"149":{"title":"matchMedia","titles":["你不知道的 JS"]},"150":{"title":"MutationObserver","titles":[]},"151":{"title":"概念","titles":["MutationObserver"]},"152":{"title":"兼容性","titles":["MutationObserver"]},"153":{"title":"用法","titles":["MutationObserver"]},"154":{"title":"API","titles":["MutationObserver"]},"155":{"title":"observe 方法","titles":["MutationObserver","API"]},"156":{"title":"callback mutation records 回调参数属性分析","titles":["MutationObserver","API"]},"157":{"title":"disconnect 关闭连接","titles":["MutationObserver","API"]},"158":{"title":"Multi MutaintionObserver(多监听改变)","titles":["MutationObserver","API"]},"159":{"title":"重新使用 MutationObserver 实例","titles":["MutationObserver","API"]},"160":{"title":"observe 方法第二个参数对象有哪些属性","titles":["MutationObserver","API"]},"161":{"title":"MutationObserver 设计规范","titles":["MutationObserver","API"]},"162":{"title":"异步回调和记录队列","titles":["MutationObserver","API","MutationObserver 设计规范"]},"163":{"title":"takeRecords() 方法","titles":["MutationObserver","API","MutationObserver 设计规范"]},"164":{"title":"性能分析","titles":["MutationObserver","API","MutationObserver 设计规范"]},"165":{"title":"CSSJS 动画那些事","titles":[]},"166":{"title":"回流与重绘","titles":["CSSJS 动画那些事"]},"167":{"title":"CSS 动画","titles":["CSSJS 动画那些事"]},"168":{"title":"JS 动画","titles":["CSSJS 动画那些事"]},"169":{"title":"V8","titles":[]},"170":{"title":"解释器和执行器","titles":["V8"]},"171":{"title":"V8 执行代码","titles":["V8"]},"172":{"title":"生成抽象语法树和执行上下文","titles":["V8","V8 执行代码"]},"173":{"title":"生成字节码","titles":["V8","V8 执行代码"]},"174":{"title":"执行代码","titles":["V8","V8 执行代码"]},"175":{"title":"垃圾回收","titles":["V8"]},"176":{"title":"栈空间","titles":["V8","垃圾回收"]},"177":{"title":"堆空间","titles":["V8","垃圾回收"]},"178":{"title":"堆空间的垃圾回收","titles":["V8","垃圾回收"]},"179":{"title":"新生代","titles":["V8","垃圾回收"]},"180":{"title":"老生代","titles":["V8","垃圾回收"]},"181":{"title":"垃圾回收流程","titles":["V8","垃圾回收"]},"182":{"title":"副垃圾回收器","titles":["V8","垃圾回收"]},"183":{"title":"主垃圾回收器","titles":["V8","垃圾回收"]},"184":{"title":"全停顿","titles":["V8","垃圾回收"]},"185":{"title":"增量标记","titles":["V8","垃圾回收"]},"186":{"title":"PC虚拟列表如何处理","titles":[]},"187":{"title":"常见解决方案","titles":["PC虚拟列表如何处理"]},"188":{"title":"IScroll 方案 (使用 transform 或者 top)","titles":["PC虚拟列表如何处理"]},"189":{"title":"react-window 解决方案","titles":["PC虚拟列表如何处理"]},"190":{"title":"高度固定","titles":["PC虚拟列表如何处理","react-window 解决方案"]},"191":{"title":"高度改变","titles":["PC虚拟列表如何处理","react-window 解决方案"]},"192":{"title":"写在最后","titles":["PC虚拟列表如何处理"]},"193":{"title":"JS 如何实现复制","titles":[]},"194":{"title":"document.execCommand","titles":["JS 如何实现复制"]},"195":{"title":"实现","titles":["JS 如何实现复制","document.execCommand"]},"196":{"title":"Clipboard API","titles":["JS 如何实现复制"]},"197":{"title":"ClipboardEvent","titles":["JS 如何实现复制","Clipboard API"]},"198":{"title":"ClipboardItem","titles":["JS 如何实现复制","Clipboard API"]},"199":{"title":"navigator.clipboard","titles":["JS 如何实现复制","Clipboard API"]},"200":{"title":"write","titles":["JS 如何实现复制","Clipboard API","navigator.clipboard"]},"201":{"title":"writeText","titles":["JS 如何实现复制","Clipboard API","navigator.clipboard"]},"202":{"title":"read","titles":["JS 如何实现复制","Clipboard API","navigator.clipboard"]},"203":{"title":"readText","titles":["JS 如何实现复制","Clipboard API","navigator.clipboard"]},"204":{"title":"扩展","titles":["JS 如何实现复制"]},"205":{"title":"mime type","titles":["JS 如何实现复制","扩展"]},"206":{"title":"Blob","titles":["JS 如何实现复制","扩展"]},"207":{"title":"颜色值变换","titles":[]},"208":{"title":"十六进制转换成 RGB","titles":["颜色值变换"]},"209":{"title":"RGB 转换成十六进制","titles":["颜色值变换"]},"210":{"title":"HSL 转换成 RGB","titles":["颜色值变换"]},"211":{"title":"RGB 转换成 HSL","titles":["颜色值变换"]},"212":{"title":"DOM BOM 事件流","titles":[]},"213":{"title":"事件冒泡","titles":["DOM BOM 事件流"]},"214":{"title":"事件捕获","titles":["DOM BOM 事件流"]},"215":{"title":"事件处理程序","titles":["DOM BOM 事件流"]},"216":{"title":"HTML 事件处理程序","titles":["DOM BOM 事件流","事件处理程序"]},"217":{"title":"DOM0 级事件处理程序","titles":["DOM BOM 事件流","事件处理程序"]},"218":{"title":"DOM2 级事件处理程序","titles":["DOM BOM 事件流","事件处理程序"]},"219":{"title":"IE 事件处理程序","titles":["DOM BOM 事件流","事件处理程序"]},"220":{"title":"事件对象","titles":["DOM BOM 事件流"]},"221":{"title":"DOM 事件对象","titles":["DOM BOM 事件流","事件对象"]},"222":{"title":"IE 事件对象","titles":["DOM BOM 事件流","事件对象"]},"223":{"title":"事件对象","titles":["DOM BOM 事件流"]},"224":{"title":"UI事件","titles":["DOM BOM 事件流","事件对象"]},"225":{"title":"焦点事件","titles":["DOM BOM 事件流","事件对象"]},"226":{"title":"鼠标与滚轮事件","titles":["DOM BOM 事件流","事件对象"]},"227":{"title":"键盘与文本事件","titles":["DOM BOM 事件流","事件对象"]},"228":{"title":"复合事件","titles":["DOM BOM 事件流","事件对象"]},"229":{"title":"变动事件","titles":["DOM BOM 事件流","事件对象"]},"230":{"title":"HTML5事件","titles":["DOM BOM 事件流","事件对象"]},"231":{"title":"pageshow 和 pagehide 事件","titles":["DOM BOM 事件流","事件对象"]},"232":{"title":"hashchange","titles":["DOM BOM 事件流","事件对象"]},"233":{"title":"设备事件","titles":["DOM BOM 事件流","事件对象"]},"234":{"title":"触摸与手势事件","titles":["DOM BOM 事件流","事件对象"]},"235":{"title":"ESLint","titles":[]},"236":{"title":"配置","titles":["ESLint"]},"237":{"title":"指定解析选项","titles":["ESLint"]},"238":{"title":"指定解析","titles":["ESLint"]},"239":{"title":"指定预处理器 processor","titles":["ESLint"]},"240":{"title":"指定解析环境 env","titles":["ESLint"]},"241":{"title":"指定全局环境 globals","titles":["ESLint"]},"242":{"title":"配置插件 plugins","titles":["ESLint"]},"243":{"title":"配置规则 rules","titles":["ESLint"]},"244":{"title":"使用注释规则","titles":["ESLint","配置规则 rules"]},"245":{"title":"配置举例","titles":["ESLint","配置规则 rules"]},"246":{"title":"行内注释","titles":["ESLint","配置规则 rules"]},"247":{"title":"使用 overrides 对指定文件进行规则覆盖","titles":["ESLint","配置规则 rules"]},"248":{"title":"禁止使用 eslint-disable","titles":["ESLint"]},"249":{"title":"共享配置 settings","titles":["ESLint"]},"250":{"title":"配置项目文件结构","titles":["ESLint"]},"251":{"title":"扩展 extends","titles":["ESLint"]},"252":{"title":"配置忽略文件","titles":["ESLint"]},"253":{"title":"CLI","titles":["ESLint"]},"254":{"title":"GIT","titles":[]},"255":{"title":"git rebase","titles":["GIT"]},"256":{"title":"API","titles":["GIT","git rebase"]},"257":{"title":"理解","titles":["GIT","git rebase"]},"258":{"title":"git revert","titles":["GIT"]},"259":{"title":"API","titles":["GIT","git revert"]},"260":{"title":"理解","titles":["GIT","git revert"]},"261":{"title":"git restore","titles":["GIT"]},"262":{"title":"API","titles":["GIT","git restore"]},"263":{"title":"理解","titles":["GIT","git restore"]},"264":{"title":"git reset","titles":["GIT","git restore"]},"265":{"title":"API","titles":["GIT","git restore"]},"266":{"title":"理解","titles":["GIT","git restore"]},"267":{"title":"History API","titles":[]},"268":{"title":"window.history","titles":["History API"]},"269":{"title":"Browser 浏览器路由","titles":["History API"]},"270":{"title":"Hash 哈希路由","titles":["History API"]},"271":{"title":"window.location","titles":["History API"]},"272":{"title":"IEEE 754","titles":[]},"273":{"title":"基本格式","titles":["IEEE 754"]},"274":{"title":"单精度","titles":["IEEE 754","基本格式"]},"275":{"title":"双精度","titles":["IEEE 754","基本格式"]},"276":{"title":"双重扩展","titles":["IEEE 754","基本格式"]},"277":{"title":"四倍精度","titles":["IEEE 754","基本格式"]},"278":{"title":"Decimal64 decimal128","titles":["IEEE 754","基本格式"]},"279":{"title":"半精度","titles":["IEEE 754","基本格式"]},"280":{"title":"浮点数范围","titles":["IEEE 754"]},"281":{"title":"字节序（Endian）","titles":["IEEE 754","浮点数范围"]},"282":{"title":"整数值的精度限制","titles":["IEEE 754","浮点数范围"]},"283":{"title":"内部表示","titles":["IEEE 754"]},"284":{"title":"JavaScript 数表示","titles":["IEEE 754"]},"285":{"title":"进制转换","titles":["IEEE 754"]},"286":{"title":"二进制转换","titles":["IEEE 754","进制转换"]},"287":{"title":"整数","titles":["IEEE 754","进制转换","二进制转换"]},"288":{"title":"小数","titles":["IEEE 754","进制转换","二进制转换"]},"289":{"title":"十六进制转换","titles":["IEEE 754","进制转换"]},"290":{"title":"八进制转换","titles":["IEEE 754","进制转换"]},"291":{"title":"计算机编码方式","titles":["IEEE 754"]},"292":{"title":"原码","titles":["IEEE 754","计算机编码方式"]},"293":{"title":"反码","titles":["IEEE 754","计算机编码方式"]},"294":{"title":"补码","titles":["IEEE 754","计算机编码方式"]},"295":{"title":"0.6 + 0.3 != 0.9","titles":["IEEE 754"]},"296":{"title":"0.6 的二进制","titles":["IEEE 754","0.6 + 0.3 != 0.9"]},"297":{"title":"0.3 的二进制","titles":["IEEE 754","0.6 + 0.3 != 0.9"]},"298":{"title":"指数对齐相加","titles":["IEEE 754","0.6 + 0.3 != 0.9"]},"299":{"title":"解决方法","titles":["IEEE 754","0.6 + 0.3 != 0.9"]},"300":{"title":"前端模块的演变","titles":[]},"301":{"title":"UMD","titles":["前端模块的演变"]},"302":{"title":"AMD","titles":["前端模块的演变"]},"303":{"title":"define 函数","titles":["前端模块的演变","AMD"]},"304":{"title":"require 函数","titles":["前端模块的演变","AMD"]},"305":{"title":"CommonJS","titles":["前端模块的演变"]},"306":{"title":"ESM","titles":["前端模块的演变"]},"307":{"title":"扩展","titles":["前端模块的演变"]},"308":{"title":"SystemJS","titles":["前端模块的演变","扩展"]},"309":{"title":"require.context","titles":["前端模块的演变","扩展"]},"310":{"title":"Script Link 标签","titles":[]},"311":{"title":"defer","titles":["Script Link 标签"]},"312":{"title":"async","titles":["Script Link 标签"]},"313":{"title":"crossorigin","titles":["Script Link 标签"]},"314":{"title":"Linux 链接","titles":[]},"315":{"title":"soft links","titles":["Linux 链接"]},"316":{"title":"定义","titles":["Linux 链接","soft links"]},"317":{"title":"工作","titles":["Linux 链接","soft links"]},"318":{"title":"创建","titles":["Linux 链接","soft links"]},"319":{"title":"hard links","titles":["Linux 链接"]},"320":{"title":"定义","titles":["Linux 链接","hard links"]},"321":{"title":"工作","titles":["Linux 链接","hard links"]},"322":{"title":"创建","titles":["Linux 链接","hard links"]},"323":{"title":"区别","titles":["Linux 链接"]},"324":{"title":"开启写作之旅","titles":[]},"325":{"title":"css 遇到的问题","titles":[]},"326":{"title":"问题一","titles":["css 遇到的问题"]},"327":{"title":"yarn 问题","titles":[]},"328":{"title":"spawn E2BIG","titles":["yarn 问题"]},"329":{"title":"问题描述","titles":["yarn 问题","spawn E2BIG"]},"330":{"title":"问题解决","titles":["yarn 问题","spawn E2BIG"]},"331":{"title":"云服务器ECS","titles":[]},"332":{"title":"阿里云服务器(Elastic Compute Service)","titles":["云服务器ECS"]},"333":{"title":"MAC","titles":["云服务器ECS","阿里云服务器(Elastic Compute Service)"]},"334":{"title":"腾讯云","titles":["云服务器ECS"]},"335":{"title":"文档编辑","titles":[]},"336":{"title":"VuePress &amp; VitePress","titles":[]},"337":{"title":"标题类","titles":["VuePress &amp; VitePress"]},"338":{"title":"标签类","titles":["VuePress &amp; VitePress"]},"339":{"title":"输出类","titles":["VuePress &amp; VitePress"]},"340":{"title":"目录类","titles":["VuePress &amp; VitePress"]},"341":{"title":"链接类","titles":["VuePress &amp; VitePress"]},"342":{"title":"风格类","titles":["VuePress &amp; VitePress"]},"343":{"title":"提示类","titles":["VuePress &amp; VitePress"]},"344":{"title":"表格类","titles":["VuePress &amp; VitePress"]},"345":{"title":"表情类","titles":["VuePress &amp; VitePress"]},"346":{"title":"Chromium 渲染流水线","titles":[]},"347":{"title":"浏览器架构","titles":["Chromium 渲染流水线"]},"348":{"title":"Chromium 进程","titles":["Chromium 渲染流水线"]},"349":{"title":"浏览器进程","titles":["Chromium 渲染流水线","Chromium 进程"]},"350":{"title":"渲染进程","titles":["Chromium 渲染流水线","Chromium 进程"]},"351":{"title":"主线程","titles":["Chromium 渲染流水线","Chromium 进程","渲染进程"]},"352":{"title":"合成线程","titles":["Chromium 渲染流水线","Chromium 进程","渲染进程"]},"353":{"title":"Viz 进程","titles":["Chromium 渲染流水线","Chromium 进程"]},"354":{"title":"进程模式","titles":["Chromium 渲染流水线"]},"355":{"title":"渲染流水线","titles":["Chromium 渲染流水线"]},"356":{"title":"Parsing","titles":["Chromium 渲染流水线","渲染流水线"]},"357":{"title":"Style","titles":["Chromium 渲染流水线","渲染流水线"]},"358":{"title":"Layout","titles":["Chromium 渲染流水线","渲染流水线"]},"359":{"title":"Pre-paint","titles":["Chromium 渲染流水线","渲染流水线"]},"360":{"title":"Paint","titles":["Chromium 渲染流水线","渲染流水线"]},"361":{"title":"Commit","titles":["Chromium 渲染流水线","渲染流水线"]},"362":{"title":"Compositing","titles":["Chromium 渲染流水线","渲染流水线"]},"363":{"title":"Tiling","titles":["Chromium 渲染流水线","渲染流水线"]},"364":{"title":"Raster","titles":["Chromium 渲染流水线","渲染流水线"]},"365":{"title":"Activate","titles":["Chromium 渲染流水线","渲染流水线"]},"366":{"title":"Draw","titles":["Chromium 渲染流水线","渲染流水线"]},"367":{"title":"Aggregate","titles":["Chromium 渲染流水线","渲染流水线"]},"368":{"title":"Display","titles":["Chromium 渲染流水线","渲染流水线"]},"369":{"title":"关键路径渲染","titles":[]},"370":{"title":"浏览器渲染","titles":["关键路径渲染"]},"371":{"title":"DOM","titles":["关键路径渲染","浏览器渲染"]},"372":{"title":"CSSOM","titles":["关键路径渲染","浏览器渲染"]},"373":{"title":"Render Tree","titles":["关键路径渲染","浏览器渲染"]},"374":{"title":"Layout","titles":["关键路径渲染","浏览器渲染"]},"375":{"title":"Paint","titles":["关键路径渲染","浏览器渲染"]},"376":{"title":"优化","titles":["关键路径渲染"]},"377":{"title":"面试","titles":[]},"378":{"title":"性能指标","titles":[]},"379":{"title":"LCP","titles":["性能指标"]},"380":{"title":"如何衡量","titles":["性能指标","LCP"]},"381":{"title":"改进","titles":["性能指标","LCP"]},"382":{"title":"测量工具","titles":["性能指标","LCP"]},"383":{"title":"FP","titles":["性能指标"]},"384":{"title":"FCP","titles":["性能指标"]},"385":{"title":"DCL","titles":["性能指标"]},"386":{"title":"FMP","titles":["性能指标"]},"387":{"title":"L","titles":["性能指标"]},"388":{"title":"TTI","titles":["性能指标"]},"389":{"title":"TBT","titles":["性能指标"]},"390":{"title":"FID","titles":["性能指标"]},"391":{"title":"CLS","titles":["性能指标"]},"392":{"title":"SI","titles":["性能指标"]},"393":{"title":"Cookies","titles":[]},"394":{"title":"读取","titles":["Cookies"]},"395":{"title":"写入","titles":["Cookies"]},"396":{"title":"path","titles":["Cookies"]},"397":{"title":"domain","titles":["Cookies"]},"398":{"title":"过期时间","titles":["Cookies"]},"399":{"title":"expires","titles":["Cookies","过期时间"]},"400":{"title":"max-age","titles":["Cookies","过期时间"]},"401":{"title":"secure","titles":["Cookies"]},"402":{"title":"samesite","titles":["Cookies"]},"403":{"title":"httpOnly","titles":["Cookies","samesite"]},"404":{"title":"第三方 cookie","titles":["Cookies"]},"405":{"title":"CORS","titles":[]},"406":{"title":"Cors Headers","titles":["CORS"]},"407":{"title":"Access-Control-Allow-Origin","titles":["CORS","Cors Headers"]},"408":{"title":"Access-Control-Allow-Credentials","titles":["CORS","Cors Headers"]},"409":{"title":"Access-Control-Allow-Headers","titles":["CORS","Cors Headers"]},"410":{"title":"Access-Control-Allow-Methods","titles":["CORS","Cors Headers"]},"411":{"title":"Access-Control-Expose-Headers","titles":["CORS","Cors Headers"]},"412":{"title":"Access-Control-Max-Age","titles":["CORS","Cors Headers"]},"413":{"title":"Access-Control-Request-Headers","titles":["CORS","Cors Headers"]},"414":{"title":"Access-Control-Request-Method","titles":["CORS","Cors Headers"]},"415":{"title":"Origin","titles":["CORS","Cors Headers"]},"416":{"title":"同源策略","titles":["CORS"]},"417":{"title":"document.domain","titles":["CORS","同源策略"]},"418":{"title":"跨域访问的几种方式","titles":["CORS"]},"419":{"title":"window.postMessage","titles":["CORS","跨域访问的几种方式"]},"420":{"title":"DHCP","titles":[]},"421":{"title":"如何配置 IP 地址","titles":["DHCP"]},"422":{"title":"动态主机配置协议（DHCP)","titles":["DHCP"]},"423":{"title":"PXE","titles":["DHCP"]},"424":{"title":"原理","titles":["DHCP","PXE"]},"425":{"title":"PXE 工作过程","titles":["DHCP","PXE"]},"426":{"title":"网络协议","titles":[]},"427":{"title":"常见网络协议","titles":["网络协议"]},"428":{"title":"IP 地址","titles":["网络协议"]},"429":{"title":"IPv4","titles":["网络协议","IP 地址"]},"430":{"title":"IPv6","titles":["网络协议","IP 地址"]},"431":{"title":"IP 地址如何计算广播地址、子网掩码","titles":["网络协议","IP 地址"]},"432":{"title":"MAC 地址","titles":["网络协议"]},"433":{"title":"网络设备的状态标识","titles":["网络协议"]},"434":{"title":"IP 地址","titles":[]},"435":{"title":"IP 协议","titles":["IP 地址"]},"436":{"title":"IP 地址","titles":["IP 地址"]},"437":{"title":"IP 地址类型","titles":["IP 地址"]},"438":{"title":"公有地址","titles":["IP 地址","IP 地址类型"]},"439":{"title":"私有地址","titles":["IP 地址","IP 地址类型"]},"440":{"title":"IP 地址编址方式","titles":["IP 地址"]},"441":{"title":"A 类地址","titles":["IP 地址","IP 地址编址方式"]},"442":{"title":"B 类地址","titles":["IP 地址","IP 地址编址方式"]},"443":{"title":"C 类地址","titles":["IP 地址","IP 地址编址方式"]},"444":{"title":"D 类地址","titles":["IP 地址","IP 地址编址方式"]},"445":{"title":"E 类地址","titles":["IP 地址","IP 地址编址方式"]},"446":{"title":"特殊的网址","titles":["IP 地址","IP 地址编址方式"]},"447":{"title":"IP 地址的分配","titles":["IP 地址"]},"448":{"title":"网络分层","titles":[]},"449":{"title":"工作过程","titles":["网络分层"]},"450":{"title":"HTTP 请求方法","titles":[]},"451":{"title":"GET","titles":["HTTP 请求方法"]},"452":{"title":"HEAD","titles":["HTTP 请求方法"]},"453":{"title":"POST","titles":["HTTP 请求方法"]},"454":{"title":"请求 body 格式","titles":["HTTP 请求方法","POST"]},"455":{"title":"PUT","titles":["HTTP 请求方法"]},"456":{"title":"DELETE","titles":["HTTP 请求方法"]},"457":{"title":"TRACE","titles":["HTTP 请求方法"]},"458":{"title":"OPTIONS","titles":["HTTP 请求方法"]},"459":{"title":"CONNECT","titles":["HTTP 请求方法"]},"460":{"title":"PATCH","titles":["HTTP 请求方法"]},"461":{"title":"对比","titles":["HTTP 请求方法"]},"462":{"title":"计算机网络名词","titles":[]},"463":{"title":"以太网","titles":["计算机网络名词"]},"464":{"title":"交换机","titles":["计算机网络名词"]},"465":{"title":"网关","titles":["计算机网络名词"]},"466":{"title":"路由器","titles":["计算机网络名词"]},"467":{"title":"MAC 地址","titles":["计算机网络名词"]},"468":{"title":"网络模型","titles":[]},"469":{"title":"网络传输协议","titles":["网络模型"]},"470":{"title":"OSI 网络模型","titles":["网络模型"]},"471":{"title":"应用层","titles":["网络模型","OSI 网络模型"]},"472":{"title":"表达层","titles":["网络模型","OSI 网络模型"]},"473":{"title":"会话层","titles":["网络模型","OSI 网络模型"]},"474":{"title":"传输层","titles":["网络模型","OSI 网络模型"]},"475":{"title":"网络层","titles":["网络模型","OSI 网络模型"]},"476":{"title":"数据链路层","titles":["网络模型","OSI 网络模型"]},"477":{"title":"物理层","titles":["网络模型","OSI 网络模型"]},"478":{"title":"TCP/IP 协议","titles":["网络模型"]},"479":{"title":"链路层","titles":["网络模型","TCP/IP 协议"]},"480":{"title":"网络层","titles":["网络模型","TCP/IP 协议"]},"481":{"title":"传输层","titles":["网络模型","TCP/IP 协议"]},"482":{"title":"应用层","titles":["网络模型","TCP/IP 协议"]},"483":{"title":"缺陷","titles":["网络模型","TCP/IP 协议"]},"484":{"title":"Socket","titles":[]},"485":{"title":"Socket","titles":["Socket"]},"486":{"title":"表示方法","titles":["Socket","Socket"]},"487":{"title":"连接","titles":["Socket","Socket"]},"488":{"title":"WebSocket","titles":["Socket"]},"489":{"title":"优点","titles":["Socket","WebSocket"]},"490":{"title":"建立连接","titles":["Socket","WebSocket"]},"491":{"title":"连接保持+心跳","titles":["Socket","WebSocket"]},"492":{"title":"响应头/请求头","titles":["Socket","WebSocket"]},"493":{"title":"Sec-WebSocket-Key/Sec-Websocket-Accept","titles":["Socket","WebSocket","响应头/请求头"]},"494":{"title":"遇到的一些问题","titles":["Socket","WebSocket"]},"495":{"title":"http 特殊地址","titles":[]},"496":{"title":"0.0.0.0","titles":["http 特殊地址"]},"497":{"title":"服务器","titles":["http 特殊地址","0.0.0.0"]},"498":{"title":"客户端","titles":["http 特殊地址","0.0.0.0"]},"499":{"title":"127.0.0.1","titles":["http 特殊地址"]},"500":{"title":"HTTP 状态码","titles":[]},"501":{"title":"1xx","titles":["HTTP 状态码"]},"502":{"title":"100 Continue","titles":["HTTP 状态码","1xx"]},"503":{"title":"101 Switching Protocols","titles":["HTTP 状态码","1xx"]},"504":{"title":"102 Processing （WebDav）- RFC","titles":["HTTP 状态码","1xx"]},"505":{"title":"103 Early Hints - RFC","titles":["HTTP 状态码","1xx"]},"506":{"title":"2xx","titles":["HTTP 状态码"]},"507":{"title":"200 OK","titles":["HTTP 状态码","2xx"]},"508":{"title":"201 Created","titles":["HTTP 状态码","2xx"]},"509":{"title":"202 Accepted","titles":["HTTP 状态码","2xx"]},"510":{"title":"203 Non-Authroritative Information HTTP/1.1","titles":["HTTP 状态码","2xx"]},"511":{"title":"204 No Content","titles":["HTTP 状态码","2xx"]},"512":{"title":"205 Reset Content","titles":["HTTP 状态码","2xx"]},"513":{"title":"206 Partial Content - RFC","titles":["HTTP 状态码","2xx"]},"514":{"title":"207 Multi-Status - RFC","titles":["HTTP 状态码","2xx"]},"515":{"title":"208 Already Reported - RFC","titles":["HTTP 状态码","2xx"]},"516":{"title":"226 IM Used - RFC","titles":["HTTP 状态码","2xx"]},"517":{"title":"3xx","titles":["HTTP 状态码"]},"518":{"title":"300 Multiple Choices","titles":["HTTP 状态码","3xx"]},"519":{"title":"301 Moved Permanently","titles":["HTTP 状态码","3xx"]},"520":{"title":"302 Found - Moved Temporarily","titles":["HTTP 状态码","3xx"]},"521":{"title":"303 See Other","titles":["HTTP 状态码","3xx"]},"522":{"title":"304 Not Modified","titles":["HTTP 状态码","3xx"]},"523":{"title":"305 Use Proxy","titles":["HTTP 状态码","3xx"]},"524":{"title":"306 Switch Proxy","titles":["HTTP 状态码","3xx"]},"525":{"title":"307 Temporary Redirect","titles":["HTTP 状态码","3xx"]},"526":{"title":"308 Permanent Redirect - RFC","titles":["HTTP 状态码","3xx"]},"527":{"title":"4xx","titles":["HTTP 状态码"]},"528":{"title":"400 Bad Request","titles":["HTTP 状态码","4xx"]},"529":{"title":"401 Unauthorized - RFC","titles":["HTTP 状态码","4xx"]},"530":{"title":"402 Payment Required","titles":["HTTP 状态码","4xx"]},"531":{"title":"403 Forbidden","titles":["HTTP 状态码","4xx"]},"532":{"title":"404 Not Found","titles":["HTTP 状态码","4xx"]},"533":{"title":"405 Method Not Allowed","titles":["HTTP 状态码","4xx"]},"534":{"title":"406 Not Acceptable","titles":["HTTP 状态码","4xx"]},"535":{"title":"407 Proxy Authentication Required - RFC","titles":["HTTP 状态码","4xx"]},"536":{"title":"408 Request Timeout","titles":["HTTP 状态码","4xx"]},"537":{"title":"415 Unsupported Media Type","titles":["HTTP 状态码","4xx"]},"538":{"title":"5xx","titles":["HTTP 状态码"]},"539":{"title":"500 Internal Server Error","titles":["HTTP 状态码","5xx"]},"540":{"title":"501 Not Implemented","titles":["HTTP 状态码","5xx"]},"541":{"title":"502 Bad Gateway","titles":["HTTP 状态码","5xx"]},"542":{"title":"503 Service Unavailable","titles":["HTTP 状态码","5xx"]},"543":{"title":"504 Gateway Timeout","titles":["HTTP 状态码","5xx"]},"544":{"title":"511 Network Authentication Required","titles":["HTTP 状态码","5xx"]},"545":{"title":"子网掩码","titles":[]},"546":{"title":"背景","titles":["子网掩码"]},"547":{"title":"功能","titles":["子网掩码"]},"548":{"title":"声明网络地址与主机地址","titles":["子网掩码","功能"]},"549":{"title":"划分子网","titles":["子网掩码","功能"]},"550":{"title":"变长子网掩码","titles":["子网掩码"]},"551":{"title":"无类别域间路由","titles":["子网掩码"]},"552":{"title":"HTTPS 加密层","titles":[]},"553":{"title":"对称加密","titles":["HTTPS 加密层"]},"554":{"title":"计算密钥","titles":["HTTPS 加密层","对称加密"]},"555":{"title":"缺陷","titles":["HTTPS 加密层","对称加密"]},"556":{"title":"非对称加密","titles":["HTTPS 加密层"]},"557":{"title":"加密数据","titles":["HTTPS 加密层","非对称加密"]},"558":{"title":"缺陷","titles":["HTTPS 加密层","非对称加密"]},"559":{"title":"对称加密 + 非对称加密","titles":["HTTPS 加密层"]},"560":{"title":"加密数据","titles":["HTTPS 加密层","对称加密 + 非对称加密"]},"561":{"title":"安全性","titles":["HTTPS 加密层","对称加密 + 非对称加密"]},"562":{"title":"CA 证书","titles":["HTTPS 加密层"]},"563":{"title":"加密方式","titles":["HTTPS 加密层","CA 证书"]},"564":{"title":"申请数字证书","titles":["HTTPS 加密层","CA 证书"]},"565":{"title":"CA 数字签名","titles":["HTTPS 加密层","CA 证书"]},"566":{"title":"验证数字证书","titles":["HTTPS 加密层","CA 证书"]},"567":{"title":"总结","titles":["HTTPS 加密层","CA 证书"]},"568":{"title":"数字证书拓展","titles":["HTTPS 加密层"]},"569":{"title":"WebRTC","titles":[]},"570":{"title":"UDP DTLS","titles":["WebRTC"]},"571":{"title":"RTP/SRTP RTCP/SRTCP","titles":["WebRTC"]},"572":{"title":"SCTP","titles":["WebRTC"]},"573":{"title":"HTML 格式化上下文","titles":[]},"574":{"title":"BFC","titles":["HTML 格式化上下文"]},"575":{"title":"CSS 属性创建 BFC","titles":["HTML 格式化上下文","BFC"]},"576":{"title":"解决了什么问题","titles":["HTML 格式化上下文","BFC"]},"577":{"title":"IFC","titles":["HTML 格式化上下文"]},"578":{"title":"说明","titles":["HTML 格式化上下文","IFC"]},"579":{"title":"Flow Layout","titles":["HTML 格式化上下文"]},"580":{"title":"Writing Mode","titles":["HTML 格式化上下文"]},"581":{"title":"说明","titles":["HTML 格式化上下文","Writing Mode"]},"582":{"title":"外边距重叠","titles":["HTML 格式化上下文"]},"583":{"title":"情形","titles":["HTML 格式化上下文","外边距重叠"]},"584":{"title":"盒模型","titles":[]},"585":{"title":"基础盒模型","titles":["盒模型"]},"586":{"title":"与盒模型相关的css属性","titles":["盒模型"]},"587":{"title":"视觉格式化模型","titles":["盒模型"]},"588":{"title":"flex 扩展","titles":[]},"589":{"title":"flex &amp; margin","titles":["flex 扩展"]},"590":{"title":"margin: auto","titles":["flex 扩展","flex &amp; margin"]},"591":{"title":"justify-content/align-items","titles":["flex 扩展","flex &amp; margin"]},"592":{"title":"space-between","titles":["flex 扩展","flex &amp; margin"]},"593":{"title":"space-around","titles":["flex 扩展","flex &amp; margin"]},"594":{"title":"align-self: flex-start/flex-end/center","titles":["flex 扩展","flex &amp; margin"]},"595":{"title":"粘性布局","titles":["flex 扩展","flex &amp; margin"]},"596":{"title":"float &amp; clear","titles":[]},"597":{"title":"float","titles":["float &amp; clear"]},"598":{"title":"float 属性取值","titles":["float &amp; clear","float"]},"599":{"title":"是否设置宽度","titles":["float &amp; clear","float"]},"600":{"title":"是否设置 margin-top","titles":["float &amp; clear","float"]},"601":{"title":"clear","titles":["float &amp; clear"]},"602":{"title":"clearfix","titles":["float &amp; clear","clear"]},"603":{"title":"clear 属性取值","titles":["float &amp; clear","clear"]},"604":{"title":"css 选择器","titles":[]},"605":{"title":"元素选择器","titles":["css 选择器"]},"606":{"title":"id 选择器","titles":["css 选择器"]},"607":{"title":"类选择器","titles":["css 选择器"]},"608":{"title":"属性选择器","titles":["css 选择器"]},"609":{"title":"伪类选择器","titles":["css 选择器"]},"610":{"title":"选择器组合","titles":["css 选择器"]},"611":{"title":"*","titles":["css 选择器","选择器组合"]},"612":{"title":"空格","titles":["css 选择器","选择器组合"]},"613":{"title":"+","titles":["css 选择器","选择器组合"]},"614":{"title":"&gt;","titles":["css 选择器","选择器组合"]},"615":{"title":"~","titles":["css 选择器","选择器组合"]},"616":{"title":"||","titles":["css 选择器","选择器组合"]},"617":{"title":"带 @ 符号的选择器","titles":["css 选择器"]},"618":{"title":"@namespace","titles":["css 选择器","带 @ 符号的选择器"]},"619":{"title":"@charset","titles":["css 选择器","带 @ 符号的选择器"]},"620":{"title":"@import","titles":["css 选择器","带 @ 符号的选择器"]},"621":{"title":"@media","titles":["css 选择器","带 @ 符号的选择器"]},"622":{"title":"@page","titles":["css 选择器","带 @ 符号的选择器"]},"623":{"title":"@counter-style","titles":["css 选择器","带 @ 符号的选择器"]},"624":{"title":"@key-frames","titles":["css 选择器","带 @ 符号的选择器"]},"625":{"title":"@fontface","titles":["css 选择器","带 @ 符号的选择器"]},"626":{"title":"@support","titles":["css 选择器","带 @ 符号的选择器"]},"627":{"title":"行内元素 css","titles":[]},"628":{"title":"vertical-align","titles":["行内元素 css"]},"629":{"title":"line-height","titles":["行内元素 css"]},"630":{"title":"取值","titles":["行内元素 css","line-height"]},"631":{"title":"伪元素 伪类","titles":[]},"632":{"title":"伪元素","titles":["伪元素 伪类"]},"633":{"title":"列举","titles":["伪元素 伪类","伪元素"]},"634":{"title":"伪类","titles":["伪元素 伪类"]},"635":{"title":"列举","titles":["伪元素 伪类","伪类"]},"636":{"title":"可替换元素","titles":[]},"637":{"title":"定义","titles":["可替换元素"]},"638":{"title":"替换元素","titles":["可替换元素"]},"639":{"title":"content 属性","titles":["可替换元素"]},"640":{"title":"取值","titles":["可替换元素","content 属性"]},"641":{"title":"counter/counters","titles":["可替换元素","content 属性"]},"642":{"title":"list-style 属性","titles":["可替换元素"]},"643":{"title":"文字特性","titles":[]},"644":{"title":"例子","titles":["文字特性"]},"645":{"title":"解决方式","titles":["文字特性"]},"646":{"title":"压缩方式","titles":["文字特性","解决方式"]},"647":{"title":"margin 方式","titles":["文字特性","解决方式"]},"648":{"title":"忽略闭合标签","titles":["文字特性","解决方式"]},"649":{"title":"font-size 方式","titles":["文字特性","解决方式"]},"650":{"title":"float 方式","titles":["文字特性","解决方式"]},"651":{"title":"flex 布局方式","titles":["文字特性","解决方式"]},"652":{"title":"visibility","titles":[]},"653":{"title":"display","titles":["visibility"]},"654":{"title":"visibility","titles":["visibility"]},"655":{"title":"content-visibility","titles":["visibility"]},"656":{"title":"contain","titles":["visibility"]},"657":{"title":"size","titles":["visibility","contain"]},"658":{"title":"layout","titles":["visibility","contain"]},"659":{"title":"style","titles":["visibility","contain"]},"660":{"title":"paint","titles":["visibility","contain"]},"661":{"title":"组合使用","titles":["visibility","contain"]},"662":{"title":"ES6","titles":[]},"663":{"title":"let &amp; const","titles":["ES6"]},"664":{"title":"解构赋值","titles":["ES6"]},"665":{"title":"正则的扩展","titles":["ES6"]},"666":{"title":"match &amp;&amp; exec &amp;&amp; matchAll","titles":["ES6","正则的扩展"]},"667":{"title":"Symbol","titles":["ES6"]},"668":{"title":"Set &amp;&amp; Map","titles":["ES6"]},"669":{"title":"Generate","titles":["ES6"]},"670":{"title":"Class","titles":["ES6"]},"671":{"title":"ArrayBuffer","titles":["ES6"]},"672":{"title":"CommonJS ES6","titles":["ES6"]},"673":{"title":"浏览器[type=&quot;module&quot;]","titles":[]},"674":{"title":"兼容性","titles":["浏览器[type=&quot;module&quot;]"]},"675":{"title":"基本使用","titles":["浏览器[type=&quot;module&quot;]"]},"676":{"title":"路径支持","titles":["浏览器[type=&quot;module&quot;]"]},"677":{"title":"nomodule &amp;&amp; noscript","titles":["浏览器[type=&quot;module&quot;]"]},"678":{"title":"加载顺序默认为 defer","titles":["浏览器[type=&quot;module&quot;]"]},"679":{"title":"module 行内执行顺序 defer","titles":["浏览器[type=&quot;module&quot;]"]},"680":{"title":"async &amp;&amp; inline module","titles":["浏览器[type=&quot;module&quot;]"]},"681":{"title":"多次加载只加载一次","titles":["浏览器[type=&quot;module&quot;]"]},"682":{"title":"跨域问题","titles":["浏览器[type=&quot;module&quot;]"]},"683":{"title":"自带凭证 crossorigin","titles":["浏览器[type=&quot;module&quot;]"]},"684":{"title":"MIME TYPE","titles":["浏览器[type=&quot;module&quot;]"]},"685":{"title":"SEO语义化","titles":[]},"686":{"title":"aside","titles":["SEO语义化"]},"687":{"title":"article","titles":["SEO语义化"]},"688":{"title":"hgroup h1 h2","titles":["SEO语义化"]},"689":{"title":"abbr","titles":["SEO语义化"]},"690":{"title":"hr","titles":["SEO语义化"]},"691":{"title":"p","titles":["SEO语义化"]},"692":{"title":"strong","titles":["SEO语义化"]},"693":{"title":"blockquote q cite","titles":["SEO语义化"]},"694":{"title":"time","titles":["SEO语义化"]},"695":{"title":"figure figcaption","titles":["SEO语义化"]},"696":{"title":"dfn","titles":["SEO语义化"]},"697":{"title":"nav ol ul","titles":["SEO语义化"]},"698":{"title":"pre samp code","titles":["SEO语义化"]},"699":{"title":"其他","titles":["SEO语义化"]},"700":{"title":"你不知道的 HTML 标签","titles":[]},"701":{"title":"meta","titles":["你不知道的 HTML 标签"]},"702":{"title":"JUST DO IT","titles":[]},"703":{"title":"URI 编码","titles":[]},"704":{"title":"unescape","titles":["URI 编码"]},"705":{"title":"escape","titles":["URI 编码"]},"706":{"title":"encodeURI","titles":["URI 编码"]},"707":{"title":"decodeURI","titles":["URI 编码"]},"708":{"title":"encodeURIComponent","titles":["URI 编码"]},"709":{"title":"decodeURIComponent","titles":["URI 编码"]},"710":{"title":"DOM2 级绑定事件","titles":[]},"711":{"title":"addEventListener","titles":["DOM2 级绑定事件"]},"712":{"title":"API","titles":["DOM2 级绑定事件","addEventListener"]},"713":{"title":"例子","titles":["DOM2 级绑定事件","addEventListener"]},"714":{"title":"DOM 类型","titles":[]},"715":{"title":"DOM 链","titles":["DOM 类型"]},"716":{"title":"DOM 操作","titles":["DOM 类型"]},"717":{"title":"DOM 扩展","titles":["DOM 类型"]},"718":{"title":"DOM2 DOM3","titles":["DOM 类型"]},"719":{"title":"JS 相等性","titles":[]},"720":{"title":"相等 ==","titles":["JS 相等性"]},"721":{"title":"严格相等 ===","titles":["JS 相等性"]},"722":{"title":"判断 if()","titles":["JS 相等性"]},"723":{"title":"比较 &gt; = &lt;","titles":["JS 相等性"]},"724":{"title":"Event Loop","titles":[]},"725":{"title":"CPU、进程、线程之间的关系","titles":["Event Loop"]},"726":{"title":"浏览器是多进程的","titles":["Event Loop"]},"727":{"title":"浏览器包含了哪些进程","titles":["Event Loop"]},"728":{"title":"主进程","titles":["Event Loop","浏览器包含了哪些进程"]},"729":{"title":"第三方插件进程","titles":["Event Loop","浏览器包含了哪些进程"]},"730":{"title":"浏览器内核（渲染进程）","titles":["Event Loop"]},"731":{"title":"JavaScript 单线程？","titles":["Event Loop"]},"732":{"title":"GUI 渲染线程与 JS 引擎线程互斥？","titles":["Event Loop"]},"733":{"title":"Event Loop GO","titles":["Event Loop"]},"734":{"title":"JS 运算符","titles":[]},"735":{"title":"控制合并操作符 ??","titles":["JS 运算符"]},"736":{"title":"赋值","titles":["JS 运算符","控制合并操作符 ??"]},"737":{"title":"短路","titles":["JS 运算符","控制合并操作符 ??"]},"738":{"title":"可选链式操作符 ?.","titles":["JS 运算符"]},"739":{"title":"比较","titles":["JS 运算符","可选链式操作符 ?."]},"740":{"title":"函数调用","titles":["JS 运算符","可选链式操作符 ?."]},"741":{"title":"表达式","titles":["JS 运算符","可选链式操作符 ?."]},"742":{"title":"不能用于赋值","titles":["JS 运算符","可选链式操作符 ?."]},"743":{"title":"访问数组元素","titles":["JS 运算符","可选链式操作符 ?."]},"744":{"title":"运算符优先级","titles":["JS 运算符"]},"745":{"title":"MutationObserver","titles":[]},"746":{"title":"概念","titles":["MutationObserver"]},"747":{"title":"兼容性","titles":["MutationObserver"]},"748":{"title":"用法","titles":["MutationObserver"]},"749":{"title":"API","titles":["MutationObserver"]},"750":{"title":"observe 方法","titles":["MutationObserver","API"]},"751":{"title":"callback mutation records 回调参数属性分析","titles":["MutationObserver","API"]},"752":{"title":"disconnect 关闭连接","titles":["MutationObserver","API"]},"753":{"title":"Multi MutaintionObserver(多监听改变)","titles":["MutationObserver","API"]},"754":{"title":"重新使用 MutationObserver 实例","titles":["MutationObserver","API"]},"755":{"title":"observe 方法第二个参数对象有哪些属性","titles":["MutationObserver","API"]},"756":{"title":"MutationObserver 设计规范","titles":["MutationObserver","API"]},"757":{"title":"异步回调和记录队列","titles":["MutationObserver","API","MutationObserver 设计规范"]},"758":{"title":"takeRecords() 方法","titles":["MutationObserver","API","MutationObserver 设计规范"]},"759":{"title":"性能分析","titles":["MutationObserver","API","MutationObserver 设计规范"]},"760":{"title":"原型","titles":[]},"761":{"title":"创建一个对象","titles":["原型"]},"762":{"title":"继承","titles":["原型"]},"763":{"title":"__proto__","titles":["原型"]},"764":{"title":"constructor","titles":["原型"]},"765":{"title":"JS 作用域","titles":[]},"766":{"title":"编译原理","titles":["JS 作用域"]},"767":{"title":"理解作用域","titles":["JS 作用域"]},"768":{"title":"LHS RHS","titles":["JS 作用域","理解作用域"]},"769":{"title":"异常","titles":["JS 作用域","理解作用域"]},"770":{"title":"总结","titles":["JS 作用域","理解作用域"]},"771":{"title":"词法作用域","titles":["JS 作用域"]},"772":{"title":"闭包","titles":["JS 作用域","词法作用域"]},"773":{"title":"查找作用域","titles":["JS 作用域","词法作用域"]},"774":{"title":"欺骗作用域","titles":["JS 作用域","词法作用域"]},"775":{"title":"eval","titles":["JS 作用域","词法作用域","欺骗作用域"]},"776":{"title":"with","titles":["JS 作用域","词法作用域","欺骗作用域"]},"777":{"title":"性能","titles":["JS 作用域","词法作用域","欺骗作用域"]},"778":{"title":"全局作用域","titles":["JS 作用域","词法作用域"]},"779":{"title":"函数作用域","titles":["JS 作用域","词法作用域"]},"780":{"title":"块级作用域","titles":["JS 作用域","词法作用域"]},"781":{"title":"JS 的存储结构","titles":[]},"782":{"title":"栈结构","titles":["JS 的存储结构"]},"783":{"title":"调用栈","titles":["JS 的存储结构","栈结构"]},"784":{"title":"函数调用","titles":["JS 的存储结构","栈结构"]},"785":{"title":"栈","titles":["JS 的存储结构","栈结构"]},"786":{"title":"总结","titles":["JS 的存储结构","栈结构"]},"787":{"title":"栈溢出","titles":["JS 的存储结构","栈结构"]},"788":{"title":"内存空间","titles":["JS 的存储结构"]},"789":{"title":"代码空间","titles":["JS 的存储结构","内存空间"]},"790":{"title":"栈空间","titles":["JS 的存储结构","内存空间"]},"791":{"title":"堆空间","titles":["JS 的存储结构","内存空间"]},"792":{"title":"JS 内存管理 变量分配","titles":["JS 的存储结构"]},"793":{"title":"静态区","titles":["JS 的存储结构","JS 内存管理 变量分配"]},"794":{"title":"调用栈","titles":["JS 的存储结构","JS 内存管理 变量分配"]},"795":{"title":"堆","titles":["JS 的存储结构","JS 内存管理 变量分配"]},"796":{"title":"关于 this","titles":[]},"797":{"title":"误解","titles":["关于 this"]},"798":{"title":"this 全面解析","titles":["关于 this"]},"799":{"title":"调用位置","titles":["关于 this","this 全面解析"]},"800":{"title":"绑定规则","titles":["关于 this","this 全面解析"]},"801":{"title":"默认绑定","titles":["关于 this","this 全面解析","绑定规则"]},"802":{"title":"隐式绑定","titles":["关于 this","this 全面解析","绑定规则"]},"803":{"title":"显式绑定","titles":["关于 this","this 全面解析","绑定规则"]},"804":{"title":"new 绑定","titles":["关于 this","this 全面解析","绑定规则"]},"805":{"title":"绑定优先级","titles":["关于 this","this 全面解析"]},"806":{"title":"bind","titles":["关于 this","this 全面解析","绑定优先级"]},"807":{"title":"注意点","titles":["关于 this","this 全面解析"]},"808":{"title":"忽略的 this","titles":["关于 this","this 全面解析","注意点"]},"809":{"title":"间接引用","titles":["关于 this","this 全面解析","注意点"]},"810":{"title":"软绑定","titles":["关于 this","this 全面解析","注意点"]},"811":{"title":"es6 箭头函数","titles":["关于 this","this 全面解析"]},"812":{"title":"ANSI escape sequences","titles":[]},"813":{"title":"定义","titles":["ANSI escape sequences"]},"814":{"title":"转义序列","titles":["ANSI escape sequences"]},"815":{"title":"CSI 序列","titles":["ANSI escape sequences"]},"816":{"title":"更多","titles":[]},"817":{"title":"Nodejs 事件循环","titles":[]},"818":{"title":"理解","titles":["Nodejs 事件循环"]},"819":{"title":"非阻塞 I/O 操作的设计机制","titles":["Nodejs 事件循环","理解"]},"820":{"title":"process.nextTick 又是如何执行？","titles":["Nodejs 事件循环","理解"]},"821":{"title":"定时器 timers","titles":["Nodejs 事件循环"]},"822":{"title":"待定的回调 pending callbacks","titles":["Nodejs 事件循环"]},"823":{"title":"idle prepare","titles":["Nodejs 事件循环"]},"824":{"title":"轮询 poll","titles":["Nodejs 事件循环"]},"825":{"title":"检测 check","titles":["Nodejs 事件循环"]},"826":{"title":"关闭的回调函数 close callbacks","titles":["Nodejs 事件循环"]},"827":{"title":"setTimeout() VS setImmediate()","titles":["Nodejs 事件循环"]},"828":{"title":"process.nextTick","titles":["Nodejs 事件循环"]},"829":{"title":"process.nextTick() VS setImmediate()","titles":["Nodejs 事件循环","process.nextTick"]},"830":{"title":"为什么使用 process.nextTick()","titles":["Nodejs 事件循环","process.nextTick"]},"831":{"title":"package.json","titles":[]},"832":{"title":"json 配置","titles":["package.json"]},"833":{"title":"正则表达式","titles":[]},"834":{"title":"你不知道的正则表达式","titles":[]},"835":{"title":"逗号分隔千分位","titles":["你不知道的正则表达式"]},"836":{"title":"Typescript 高级","titles":[]},"837":{"title":"Advanced Type","titles":["Typescript 高级"]},"838":{"title":"Utility types","titles":["Typescript 高级"]},"839":{"title":"Modules","titles":["Typescript 高级"]},"840":{"title":"Import a moudle from side-effects only","titles":["Typescript 高级","Modules"]},"841":{"title":"Importing Types","titles":["Typescript 高级","Modules"]},"842":{"title":"Optional Module Loading","titles":["Typescript 高级","Modules"]},"843":{"title":"Ambient Modules","titles":["Typescript 高级","Modules"]},"844":{"title":"UMD modules","titles":["Typescript 高级","Modules"]},"845":{"title":"Module Resolution","titles":["Typescript 高级"]},"846":{"title":"相对路径 &amp; 非相对路径","titles":["Typescript 高级","Module Resolution"]},"847":{"title":"常见解析 classic","titles":["Typescript 高级","Module Resolution"]},"848":{"title":"Node.js 解析","titles":["Typescript 高级","Module Resolution"]},"849":{"title":"Typescript 解析","titles":["Typescript 高级","Module Resolution"]},"850":{"title":"baseUrl 配置","titles":["Typescript 高级","Module Resolution"]},"851":{"title":"测试解析路径","titles":["Typescript 高级","Module Resolution"]},"852":{"title":"Namespaces","titles":["Typescript 高级"]},"853":{"title":"Namespaces &amp; Modules","titles":["Typescript 高级"]},"854":{"title":"Triple-Slash Directives","titles":["Typescript 高级"]},"855":{"title":"Typescript 基础","titles":[]},"856":{"title":"tsconfig.json/jsconfig.json 文件","titles":["Typescript 基础"]},"857":{"title":"配置参数","titles":["Typescript 基础","tsconfig.json/jsconfig.json 文件"]},"858":{"title":"CLI","titles":["Typescript 基础","tsconfig.json/jsconfig.json 文件"]},"859":{"title":"Basic Type","titles":["Typescript 基础"]},"860":{"title":"Interfaces","titles":["Typescript 基础"]},"861":{"title":"Functions","titles":["Typescript 基础"]},"862":{"title":"Literal Types","titles":["Typescript 基础"]},"863":{"title":"Union and Intersection Types","titles":["Typescript 基础"]},"864":{"title":"Classes","titles":["Typescript 基础"]},"865":{"title":"Enum","titles":["Typescript 基础"]},"866":{"title":"Generics","titles":["Typescript 基础"]},"867":{"title":"Typescript 文件结构定义","titles":[]},"868":{"title":"模块化","titles":["Typescript 文件结构定义"]},"869":{"title":"模块模板","titles":["Typescript 文件结构定义"]},"870":{"title":"module.d.ts","titles":["Typescript 文件结构定义","模块模板"]},"871":{"title":"全局模板","titles":["Typescript 文件结构定义"]},"872":{"title":"DO\'s &amp; DON\'Ts","titles":["Typescript 文件结构定义"]},"873":{"title":"DEEP DIVE","titles":["Typescript 文件结构定义"]},"874":{"title":"高级组合","titles":["Typescript 文件结构定义","DEEP DIVE"]},"875":{"title":"导航","titles":[]},"876":{"title":"Context","titles":[]},"877":{"title":"Ref","titles":[]},"878":{"title":"开始","titles":[]}},"dirtCount":0,"index":[["别用",{"2":{"872":1}}],["别名",{"2":{"852":1}}],["泛型约束条件",{"2":{"866":1}}],["泛型",{"2":{"866":1}}],["抽象方法",{"2":{"864":1}}],["抽象类",{"2":{"864":1}}],["抽象接口不应该依赖于具体实现",{"2":{"35":1}}],["静态属性方法无法引用",{"2":{"866":3}}],["静态属性",{"2":{"864":1}}],["静态方法",{"2":{"864":1}}],["静态区",{"0":{"793":1}}],["联合枚举",{"2":{"865":1}}],["联合交叉类型",{"2":{"863":1}}],["联合类型",{"2":{"863":3}}],["联调",{"2":{"67":1}}],["枚举",{"2":{"859":1,"865":1}}],["极大缩端构建和编辑器的交互时间",{"2":{"857":2}}],["映射源文件",{"2":{"857":2}}],["映射",{"2":{"857":2}}],["映射类型",{"2":{"837":1}}],["很难识别组件依赖性",{"2":{"853":1}}],["很快就会变得不可访问",{"2":{"178":1}}],["虚拟目录",{"2":{"850":1,"857":2}}],["出现以上情形",{"2":{"848":1,"849":1}}],["出现错误",{"2":{"480":1}}],["强绑定",{"2":{"838":1}}],["强调",{"2":{"692":1}}],["去除",{"2":{"838":1}}],["排除哪些文件不被编译或者类型检查",{"2":{"857":2}}],["排除",{"2":{"838":1}}],["排队规则",{"2":{"433":2}}],["集合",{"2":{"838":2}}],["集线器",{"2":{"477":1}}],["索引签名",{"2":{"837":1}}],["索引类型",{"2":{"837":2}}],["逗号分隔千分位",{"0":{"835":1}}],["逗号表达式",{"2":{"744":1}}],["元组",{"2":{"859":1}}],["元字符",{"2":{"833":1}}],["元素上或者",{"2":{"877":1}}],["元素内容的总宽度",{"2":{"718":1}}],["元素内容的总高度",{"2":{"718":1}}],["元素的上外边框至包含元素的上内边框之间的像素距离",{"2":{"718":1}}],["元素的左外边框至包含元素的左内边框之间的像素距离",{"2":{"718":1}}],["元素的子元素不会影响父元素的大小",{"2":{"657":1}}],["元素在水平方向上占用的空间大小",{"2":{"718":1}}],["元素在垂直方向上占用的空间大小",{"2":{"718":1}}],["元素大小",{"2":{"718":1}}],["元素添加了以下",{"2":{"717":1}}],["元素空间显示为空",{"2":{"655":1}}],["元素高度不一致",{"2":{"650":1}}],["元素存在间隙",{"2":{"643":1}}],["元素盒子",{"2":{"628":1}}],["元素选择器",{"0":{"605":1}}],["元素选中的方式",{"2":{"195":2}}],["元素位置如何变化",{"2":{"600":1}}],["元素属性",{"2":{"575":1}}],["元素属性为",{"2":{"575":2}}],["元素设置",{"2":{"326":1}}],["元素",{"2":{"326":1}}],["元素向下偏移",{"2":{"326":1}}],["元素显示成一行时",{"2":{"326":1}}],["元素包含多个",{"2":{"326":1}}],["元素外部移入元素边界之内",{"2":{"226":1}}],["元素移入另一个元素触发",{"2":{"226":1}}],["元素获取焦点时触发",{"2":{"225":2}}],["元素获得焦点时触发",{"2":{"225":1}}],["元素失去焦点时触发",{"2":{"225":2}}],["元素可见性",{"2":{"166":1}}],["入口文件",{"2":{"832":1}}],["入口编译之后文件",{"2":{"143":2}}],["凭证",{"2":{"832":1}}],["日志",{"2":{"832":1}}],["描述",{"2":{"832":1,"833":1}}],["版本",{"2":{"857":4}}],["版本号",{"2":{"832":1}}],["版本控制以及",{"2":{"65":1}}],["让回调在栈展开后",{"2":{"830":1}}],["让我们从最熟悉的的",{"2":{"715":1}}],["阻止事件到达轮询阶段",{"2":{"828":1}}],["阻止默认行为",{"2":{"195":2,"230":1}}],["几乎所有情况下",{"2":{"824":1}}],["待定的回调",{"0":{"822":1}}],["待垃圾回收完毕之后恢复脚本的执行",{"2":{"184":1}}],["阈值",{"2":{"821":2}}],["─────┤",{"2":{"820":1}}],["────────────",{"2":{"294":4}}],["┌───────────────┐",{"2":{"820":1}}],["┌───────────────────────────┐",{"2":{"820":1}}],["┌─────────────┴─────────────┐",{"2":{"820":5}}],["┌─",{"2":{"820":1}}],["造成任务饿死",{"2":{"820":1}}],["造轮子",{"2":{"59":1}}],["阶段继续执行",{"2":{"819":1}}],["阶段操作前",{"2":{"365":1}}],["轮询阶段计算出来的阈值",{"2":{"827":1}}],["轮询阶段变为空闲状态",{"2":{"825":1}}],["轮询阶段完成后立即执行回调",{"2":{"825":1}}],["轮询阶段控制何时定时器执行",{"2":{"821":1}}],["轮询队列不为空",{"2":{"819":1,"824":1}}],["轮询队列为空",{"2":{"819":1,"824":1}}],["轮询",{"0":{"824":1},"2":{"819":1}}],["挂起的回调函数",{"2":{"822":1}}],["挂起的回调",{"2":{"819":1}}],["擦除行",{"2":{"815":1}}],["擦除显示",{"2":{"815":1}}],["格",{"2":{"815":1}}],["格式模型",{"2":{"637":1}}],["格式化上下文",{"0":{"573":1},"1":{"574":1,"575":1,"576":1,"577":1,"578":1,"579":1,"580":1,"581":1,"582":1,"583":1}}],["格式错误的请求语法",{"2":{"528":1}}],["格式支持",{"2":{"339":1}}],["格式",{"0":{"454":1},"2":{"339":3}}],["若干个中间字节",{"2":{"815":1}}],["若干个",{"2":{"815":1}}],["若有回调函数",{"2":{"730":1}}],["箭头函数中",{"2":{"861":1}}],["箭头函数会继承外层函数调用的",{"2":{"811":1}}],["箭头函数",{"0":{"811":1}}],["软绑定",{"0":{"810":1}}],["软链接是一个指向文件的指针",{"2":{"323":1}}],["软链接指向文件名",{"2":{"323":1}}],["软链接将会无效",{"2":{"317":1}}],["软链接也被称为符号链接",{"2":{"316":1}}],["软链接",{"2":{"315":1}}],["间接引用采用的是默认绑定",{"2":{"809":1}}],["间接引用",{"0":{"809":1}}],["间隙间距为4px",{"2":{"647":1}}],["间隙存在",{"2":{"644":1}}],["显式绑定",{"0":{"803":1},"2":{"805":1}}],["显示即可操作",{"2":{"655":1}}],["显示元素属性内容",{"2":{"640":1}}],["显示创建的",{"2":{"322":2}}],["显示",{"2":{"318":2}}],["显示的窗口的值",{"2":{"230":1}}],["隐式丢失",{"2":{"802":2}}],["隐式绑定",{"0":{"802":1},"2":{"805":2}}],["隐藏不可操作",{"2":{"655":1}}],["隐藏元素并保持自身的渲染状态",{"2":{"654":1,"655":1}}],["隐藏",{"2":{"168":2}}],["匿名函数无法调用自身",{"2":{"797":2}}],["❎",{"2":{"797":2}}],["误解",{"0":{"797":1}}],["超出范围安全处理",{"2":{"788":1}}],["超过一定数目",{"2":{"787":1}}],["容量限制",{"2":{"787":1}}],["容器布局下的子元素",{"2":{"575":2}}],["容器",{"2":{"51":1}}],["管理函数调用的关系的一种数据结构",{"2":{"783":1}}],["拥有自己的作用域",{"2":{"775":1}}],["降低性能",{"2":{"774":1}}],["降低资源占用",{"0":{"55":1}}],["欺骗作用域",{"0":{"774":1},"1":{"775":1,"776":1,"777":1}}],["逐级向外或者向上进行",{"2":{"773":1}}],["逐级向上传播到较为不具体的节点",{"2":{"213":1}}],["遮蔽效应",{"2":{"773":1}}],["闭包",{"0":{"772":1}}],["谁是赋值操作的源头",{"2":{"768":1}}],["谁先下载完谁就执行",{"2":{"680":1}}],["程序中定义变量的区域",{"2":{"767":1}}],["词法阶段的作用域",{"2":{"771":1}}],["词法作用域规定",{"2":{"772":1}}],["词法作用域是静态的作用域",{"2":{"771":1}}],["词法作用域",{"0":{"771":1},"1":{"772":1,"773":1,"774":1,"775":1,"776":1,"777":1,"778":1,"779":1,"780":1}}],["词法最小单元",{"2":{"766":1}}],["词法分析",{"2":{"172":1,"766":1}}],["渐渐被定义成规范",{"2":{"763":1}}],["渐进空间复杂度",{"2":{"2":1}}],["渐进时间复杂度",{"2":{"1":1}}],["巧借中间函数",{"2":{"762":2}}],["借用构造函数",{"2":{"762":1}}],["借助",{"2":{"104":2}}],["寄生组合式继承",{"2":{"762":1}}],["寄生式继承",{"2":{"762":1}}],["寄生构造函数模式",{"2":{"761":1}}],["寄语",{"2":{"324":1}}],["认同度最高的一种方法",{"2":{"761":1}}],["认证的根",{"2":{"568":1}}],["认证是电子认证服务行业中唯一的国际性认证标准",{"2":{"568":1}}],["毫无封装性可言",{"2":{"761":1}}],["构造器",{"2":{"864":1}}],["构造一组元组类型或者数组类型使用在构造函数当中",{"2":{"838":1}}],["构造一组元组类型使用在函数参数当中",{"2":{"838":1}}],["构造函数调用指定当前实例类",{"2":{"864":1}}],["构造函数只是一些用",{"2":{"804":1}}],["构造函数",{"2":{"762":1,"864":1}}],["构造函数模式",{"2":{"761":1}}],["构建可选",{"2":{"65":1}}],["括号",{"2":{"744":1}}],["短路",{"0":{"737":1}}],["赋值会更好",{"2":{"876":1}}],["赋值操作的目标是谁",{"2":{"768":1}}],["赋值操作的左侧或右侧",{"2":{"768":1}}],["赋值",{"0":{"736":1}}],["添加",{"2":{"870":2}}],["添加到微任务队列",{"2":{"733":1}}],["添加两次保持两次",{"2":{"668":1}}],["添加两次只有一个",{"2":{"668":1}}],["微任务队列",{"2":{"733":1}}],["微任务",{"2":{"733":1}}],["循环内调用",{"2":{"827":1}}],["循环",{"2":{"733":1}}],["宏任务执行完毕",{"2":{"733":1}}],["宏任务执行完毕后",{"2":{"733":1}}],["宏任务完成立即执行当前一轮的微任务",{"2":{"733":1}}],["宏任务",{"2":{"733":1}}],["销毁",{"2":{"728":1}}],["严格相等",{"0":{"721":1}}],["严格模式与",{"2":{"801":1}}],["严格模式中",{"2":{"775":1}}],["严格模式",{"2":{"237":1,"801":2}}],["被",{"2":{"804":1}}],["被隐藏在内容区域上方的像素数",{"2":{"718":1}}],["被隐藏在内容区域左侧的像素数",{"2":{"718":1}}],["被请求的资源必须通过指定的代理才能被访问",{"2":{"523":1}}],["被请求的资源已永久移动到新位置",{"2":{"519":1}}],["被请求的资源有一系列可供选择的回馈信息",{"2":{"518":1}}],["垂",{"2":{"718":1}}],["垂直方向",{"2":{"594":2}}],["偏移量",{"2":{"718":1}}],["偏移高度",{"2":{"190":2,"191":2}}],["",{"2":{"717":5,"718":31}}],["浅复制",{"2":{"716":1}}],["深复制",{"2":{"716":1}}],["深度优先遍历",{"2":{"14":1}}],["举例",{"2":{"715":1}}],["举例说明",{"2":{"317":1,"321":1}}],["看完",{"2":{"715":1}}],["绑定和显式绑定分析",{"2":{"806":1}}],["绑定和显式绑定无法判定",{"2":{"805":1}}],["绑定优先级",{"0":{"805":1},"1":{"806":1}}],["绑定",{"0":{"804":1},"2":{"805":1,"811":1}}],["绑定的是全局对象",{"2":{"801":2}}],["绑定规则",{"0":{"800":1},"1":{"801":1,"802":1,"803":1,"804":1}}],["绑定事件",{"2":{"713":2}}],["绑定事件接收三个参数",{"2":{"711":1}}],["绑定多个相同的事件",{"2":{"218":1,"219":1}}],["问号",{"2":{"706":1}}],["问题描述",{"0":{"329":1}}],["问题",{"0":{"327":1},"1":{"328":1,"329":1,"330":1}}],["问题解决",{"0":{"330":1}}],["问题解决方式",{"2":{"326":1}}],["问题解答",{"2":{"326":1}}],["问题一",{"0":{"326":1}}],["问题定位效率低",{"0":{"66":1}}],["问题定位困难",{"2":{"65":1}}],["井号",{"2":{"706":1}}],["冒号",{"2":{"706":1}}],["冒泡",{"2":{"221":1,"225":4}}],["码进行编码",{"2":{"703":2}}],["持续连接",{"2":{"822":1}}],["持续学习",{"2":{"702":1}}],["持续成长",{"2":{"702":1}}],["持续集成自动构建",{"2":{"25":1}}],["专注",{"2":{"702":1}}],["秒数",{"2":{"701":1}}],["序列化",{"2":{"859":2}}],["序列在",{"2":{"815":1}}],["序列由",{"2":{"815":1}}],["序列",{"0":{"815":1},"2":{"697":1}}],["段落引述内容",{"2":{"693":3}}],["段落标签",{"2":{"691":1}}],["遵循新规范的新浏览器",{"2":{"683":1}}],["旧浏览器违反当时的规范",{"2":{"683":1}}],["旧浏览器除外",{"2":{"683":2}}],["携带凭证",{"2":{"683":8}}],["携带参数是作为上一个",{"2":{"669":1}}],["携带参数",{"2":{"669":1}}],["导航",{"0":{"875":1}}],["导出的对象",{"2":{"672":2}}],["导出",{"2":{"672":2}}],["导入",{"2":{"672":2}}],["导致",{"2":{"776":2}}],["导致设置的",{"2":{"330":1}}],["导致该元素与父元素之间的基线为底部边沿",{"2":{"326":1}}],["导致页面卡顿",{"2":{"186":1}}],["导致用户体验下降",{"2":{"185":1}}],["导致大对象无法分配一块连续空间的内存",{"2":{"183":1}}],["继承多个逗号隔开",{"2":{"860":1}}],["继承",{"0":{"762":1},"2":{"670":1,"864":1}}],["继续匹配位置",{"2":{"666":1}}],["暂停执行",{"2":{"669":1}}],["暂时行死区",{"2":{"663":1}}],["暂时性的",{"2":{"542":1}}],["订阅",{"2":{"669":1}}],["诞生之前回调函数",{"2":{"669":1}}],["遇到",{"2":{"669":1}}],["遇到的一些问题",{"0":{"494":1}}],["遇到的问题",{"0":{"325":1},"1":{"326":1}}],["放在函数内部",{"2":{"669":1}}],["放弃已提交到工作区的所有文件",{"2":{"263":1}}],["放弃所有更改",{"2":{"263":1}}],["终结",{"2":{"669":1}}],["至少执行一次",{"2":{"669":1}}],["至少要有一个范围",{"2":{"114":1}}],["传值调用",{"2":{"669":1}}],["传名调用",{"2":{"669":2}}],["传统的",{"2":{"668":1}}],["传输自定义应用数据相关协议",{"2":{"569":1}}],["传输音视频数据相关协议",{"2":{"569":1}}],["传输协议",{"2":{"488":1}}],["传输性较差",{"2":{"481":1}}],["传输指定端口",{"2":{"481":1}}],["传输控制协议",{"2":{"478":1,"481":1,"571":1}}],["传输表头包含了所使用的协议等发送信息",{"2":{"474":1}}],["传输层",{"0":{"474":1,"481":1},"2":{"427":1}}],["传输携带",{"2":{"401":1}}],["弱引用",{"2":{"668":1}}],["必须指定",{"2":{"838":1}}],["必须显式指定作为函数还是作为对象使用",{"2":{"670":1}}],["必须放在方括号中",{"2":{"667":1}}],["必须在子类中实现",{"2":{"864":1}}],["必须在事件内进行操作",{"2":{"200":2}}],["必须在一个文档事件",{"2":{"198":1}}],["独一无二",{"2":{"667":1}}],["独立文档之外",{"2":{"653":1}}],["独立于",{"2":{"637":1}}],["具体元素转发一次",{"2":{"877":2}}],["具名函数",{"2":{"797":2}}],["具名组匹配",{"2":{"666":1}}],["具有对数据的分组过滤",{"2":{"466":1}}],["具有副作用",{"2":{"461":1}}],["具有将图转化为一个个栅格组成的图象的作用",{"2":{"364":1}}],["具有",{"2":{"280":1}}],["π",{"2":{"666":2}}],["€90",{"2":{"666":2}}],["𠮷",{"2":{"666":2}}],["充当绝对定位和固定位置元素的包含块",{"2":{"660":1}}],["充当转换重任的计算机系统或设备",{"2":{"465":1}}],["样式更改不会传播回包含元素",{"2":{"659":1}}],["样式信息",{"2":{"357":1}}],["达到优化效果",{"2":{"658":1}}],["推断类型",{"2":{"837":1}}],["推断和设置的尺寸是使用的尺寸",{"2":{"657":1}}],["推荐使用flex布局",{"2":{"651":1}}],["推荐规则只能eslint主要版本上更改",{"2":{"251":1}}],["跳过屏幕之外的元素",{"2":{"655":1}}],["跳到最近的页面",{"2":{"268":1}}],["兼容",{"2":{"655":1,"656":1}}],["兼容性",{"0":{"152":1,"674":1,"747":1},"2":{"112":2,"196":1,"212":1,"218":1,"225":2,"311":1,"312":1}}],["物理上显示空白",{"2":{"654":1}}],["物理层",{"0":{"477":1},"2":{"427":1}}],["破坏渲染状态",{"2":{"653":1}}],["控制序列",{"2":{"815":1}}],["控制字符集的码位范围是",{"2":{"812":2}}],["控制合并操作符",{"0":{"735":1},"1":{"736":1,"737":1}}],["控制元素的显隐",{"2":{"653":1}}],["控制展示以及具体功能",{"2":{"38":1}}],["忽略",{"2":{"854":1}}],["忽略的",{"0":{"808":1}}],["忽略闭合标签",{"0":{"648":1}}],["忽略规则",{"2":{"246":2}}],["压缩代码",{"2":{"646":1}}],["压缩方式",{"0":{"646":1}}],["压缩及防护墙等各项功能",{"2":{"466":1}}],["理论上支持属性值为",{"2":{"641":1}}],["理解作用域",{"0":{"767":1},"1":{"768":1,"769":1,"770":1}}],["理解",{"0":{"257":1,"260":1,"263":1,"266":1,"818":1},"1":{"819":1,"820":1},"2":{"506":1}}],["增加去除引号",{"2":{"640":1}}],["增量标记",{"0":{"185":1}}],["某个节点是不是另一个节点的后代",{"2":{"717":1}}],["某个组的机器都能收到",{"2":{"429":1}}],["某些特殊情况下",{"2":{"638":1}}],["某些替换元素具有固有尺寸或定义的基线",{"2":{"637":1}}],["他们是外部对象",{"2":{"637":1}}],["替换元素",{"0":{"638":1}}],["替换元素是表示形式超出",{"2":{"637":1}}],["替换值",{"2":{"156":1,"751":1}}],["列",{"2":{"815":2}}],["列举",{"0":{"633":1,"635":1}}],["列组合选择器",{"2":{"616":1}}],["名词",{"2":{"627":1}}],["名称",{"2":{"323":1,"815":1}}],["符号的选择器",{"0":{"617":1},"1":{"618":1,"619":1,"620":1,"621":1,"622":1,"623":1,"624":1,"625":1,"626":1}}],["符号位不变",{"2":{"293":1}}],["符号位加上真值的绝对值",{"2":{"292":1}}],["带",{"0":{"617":1},"1":{"618":1,"619":1,"620":1,"621":1,"622":1,"623":1,"624":1,"625":1,"626":1}}],["带有",{"2":{"394":1}}],["兄弟选择器",{"2":{"615":1}}],["兄弟元素组合选择器",{"2":{"613":1}}],["伪元素中插入内容",{"2":{"639":1}}],["伪元素必须跟在普通选择器和基础选择器之后",{"2":{"632":1}}],["伪元素是一个附加至选择器末的关键词",{"2":{"632":1}}],["伪元素",{"0":{"631":1,"632":1},"1":{"632":1,"633":2,"634":1,"635":1},"2":{"609":1}}],["伪类是添加到选择器的关键词",{"2":{"634":1}}],["伪类",{"0":{"631":1,"634":1},"1":{"632":1,"633":1,"634":1,"635":2},"2":{"609":1,"632":1,"635":2}}],["伪类选择器",{"0":{"609":1}}],["粘性布局",{"0":{"595":1}}],["粘贴",{"2":{"113":1}}],["居右依次布局",{"2":{"594":2}}],["居左",{"2":{"594":2}}],["居中",{"2":{"113":1}}],["水平滚动条的高度",{"2":{"718":1}}],["水平方向",{"2":{"594":2}}],["水平垂直居中",{"2":{"591":2}}],["水平写入模式",{"2":{"579":1}}],["盒子",{"2":{"587":1}}],["盒模型",{"0":{"584":1},"1":{"585":1,"586":1,"587":1}}],["父元素设置font",{"2":{"649":1}}],["父元素后第一代子元素选择器",{"2":{"614":1}}],["父级",{"2":{"583":2}}],["父容器高度塌陷",{"2":{"576":1}}],["情形",{"0":{"583":1}}],["块容器盒子",{"2":{"587":1}}],["块盒子",{"2":{"587":1}}],["块",{"2":{"587":1}}],["块的上外边距和下外边距有时合并",{"2":{"582":1}}],["块元素中文字",{"2":{"629":1}}],["块元素在确定宽度元素下",{"2":{"590":1}}],["块元素",{"2":{"583":1}}],["块元素不发生旋转",{"2":{"581":1}}],["块元素应用书写模式",{"2":{"581":1}}],["块级作用域是通过词法环境的栈结构实现的",{"2":{"780":1}}],["块级作用域",{"0":{"780":1}}],["块级盒子",{"2":{"587":1}}],["块级元素",{"2":{"587":1,"643":1}}],["块级元素的",{"2":{"575":1}}],["块级格式化上下文",{"2":{"574":1}}],["书写模式",{"2":{"580":2}}],["浮动区间内的元素",{"2":{"600":1}}],["浮动区间元素依次排列",{"2":{"599":1}}],["浮动元素的高度",{"2":{"600":1}}],["浮动元素的实际",{"2":{"600":1}}],["浮动元素与非浮动元素可视",{"2":{"599":1}}],["浮动元素表示使用块布局",{"2":{"597":1}}],["浮动元素",{"2":{"596":1}}],["浮动不会影响其他",{"2":{"575":1}}],["浮点数以大字节序形式表示",{"2":{"281":1}}],["浮点数范围",{"0":{"280":1},"1":{"281":1,"282":1}}],["脱离文档流",{"2":{"575":1}}],["布局和绘制",{"2":{"730":1}}],["布局方式",{"0":{"651":1}}],["布局下的元素",{"2":{"590":1}}],["布局容器下的项目属性",{"2":{"590":1}}],["布局容器下的项目使用",{"2":{"589":1}}],["布局中项目属性的同等效果",{"2":{"589":1}}],["布局",{"2":{"575":1}}],["布尔值",{"2":{"114":1}}],["绝对值最大的负边距",{"2":{"583":1}}],["绝对定位的元素",{"2":{"575":1}}],["绝对路径",{"2":{"857":2}}],["绝对路径icon地址",{"2":{"134":2}}],["绝对路径地址",{"2":{"134":2}}],["适用于让事件循环继续之前",{"2":{"828":1}}],["适用",{"2":{"628":1,"629":1}}],["适用以下的方法可以创建一个新的",{"2":{"575":1}}],["适合自己的数据结构与算法的记忆方法",{"2":{"10":1}}],["流式布局",{"2":{"579":1}}],["流控制传输协议",{"2":{"572":1}}],["流程",{"2":{"356":1}}],["银行",{"2":{"568":1}}],["金融机构",{"2":{"568":1}}],["普通方法",{"2":{"864":1}}],["普通公司申请的证书属于",{"2":{"568":1}}],["普通文字",{"2":{"342":1}}],["否则",{"2":{"826":1}}],["否则报错",{"2":{"761":1}}],["否则返回左侧操作数",{"2":{"735":1}}],["否则不会执行",{"2":{"684":1}}],["否则会报错",{"2":{"670":1}}],["否则视为不合法",{"2":{"566":1}}],["否则无效",{"2":{"218":1}}],["验证数字证书",{"0":{"566":1}}],["签发数字证书",{"2":{"564":1}}],["信息摘要",{"2":{"566":2}}],["信息审核通过",{"2":{"564":1}}],["信号转发的网络设备",{"2":{"464":1}}],["机构的权威性",{"2":{"568":1}}],["机构链查找",{"2":{"566":1}}],["机构验证信息是否合理合法",{"2":{"564":1}}],["机构提交公钥以及相关信息",{"2":{"564":1}}],["机器存储一个具体数字的编码方式",{"2":{"291":1}}],["准备一套公钥和私钥",{"2":{"564":1}}],["申请数字证书是不需要提供私钥的",{"2":{"567":1}}],["申请数字证书",{"0":{"564":1}}],["申请协议升级",{"2":{"490":1}}],["劫持替换",{"2":{"562":1}}],["证书序列号等明文信息",{"2":{"564":1}}],["证书",{"0":{"562":1},"1":{"563":1,"564":1,"565":1,"566":1,"567":1}}],["影响数据传输速率",{"2":{"558":1}}],["私钥永远只能存在于服务器上",{"2":{"567":1}}],["私钥留着自己使用",{"2":{"564":1}}],["私钥只有服务器存在",{"2":{"557":1}}],["私钥只有公钥能解密",{"2":{"556":1}}],["私有属性",{"2":{"864":1}}],["私有地址",{"0":{"439":1}}],["私有",{"2":{"429":1,"440":1}}],["拿到随机数和加密方式",{"2":{"555":1}}],["混合类型",{"2":{"860":1,"865":1}}],["混合起来生成密钥",{"2":{"554":1}}],["混杂模式",{"2":{"224":1,"715":1,"718":1}}],["密钥都能用来解密",{"2":{"554":1}}],["随机数",{"2":{"553":2,"559":2,"561":1,"563":2}}],["便于管理",{"2":{"549":1}}],["便于隔离更新",{"2":{"362":1}}],["划分子网",{"0":{"549":1}}],["运行在",{"2":{"827":1}}],["运行一个函数",{"2":{"784":1}}],["运行速度",{"2":{"463":1}}],["运算符优先级",{"0":{"744":1}}],["运算符",{"0":{"734":1},"1":{"735":1,"736":1,"737":1,"738":1,"739":1,"740":1,"741":1,"742":1,"743":1,"744":1}}],["运算",{"2":{"548":1}}],["声明网络地址与主机地址",{"0":{"548":1}}],["背景",{"0":{"546":1}}],["背景文字",{"2":{"342":1}}],["又可以表现为对象形式",{"2":{"860":1}}],["又是如何执行",{"0":{"820":1}}],["又叫网络掩码",{"2":{"545":1}}],["又想处理没有结束",{"2":{"163":1,"758":1}}],["热点",{"2":{"544":1}}],["热键",{"2":{"226":1}}],["旨在限制用户群访问特定网络",{"2":{"544":1}}],["身份验证并不能提供任何帮助",{"2":{"531":1}}],["域中指明",{"2":{"517":1}}],["域名下访问不到",{"2":{"196":1}}],["断点续传",{"2":{"513":1}}],["且不覆盖",{"2":{"861":1}}],["且不能越界方位",{"2":{"859":2}}],["且默认为",{"2":{"815":1}}],["且其",{"2":{"508":1}}],["且每个节点一般需要一个",{"2":{"447":1}}],["临时响应",{"2":{"501":1}}],["消息发出重定向",{"2":{"521":1}}],["消息",{"2":{"514":1}}],["消息之前返回一些响应头",{"2":{"505":1}}],["消息头通知客户端采用不同的协议来完成这个请求",{"2":{"503":1}}],["消息类型",{"2":{"501":1}}],["消息包",{"2":{"422":1}}],["五类状态码",{"2":{"500":1}}],["占满剩余空间",{"2":{"594":2}}],["占位符",{"2":{"496":1}}],["占用",{"2":{"48":1,"274":1,"275":1}}],["握手不会产生无用的缓存",{"2":{"493":1}}],["长时间保持会浪费连接资源",{"2":{"491":1}}],["长时间没有数据往来的连接",{"2":{"491":1}}],["长乘法",{"2":{"288":1}}],["较少的控制开销",{"2":{"489":1}}],["优点",{"0":{"489":1}}],["优化关键渲染路径",{"2":{"381":1}}],["优化资源大小数量",{"2":{"376":1}}],["优化资源加载的顺序和粒度",{"2":{"51":1}}],["优化",{"0":{"376":1},"2":{"381":2}}],["优化处理",{"2":{"132":3}}],["试试监控网络状态",{"2":{"487":1}}],["试验用处",{"2":{"445":1}}],["处于等待连接的状态",{"2":{"487":1}}],["处理轮询队列里的事件",{"2":{"824":1}}],["处理轮询队列中的事件",{"2":{"819":1}}],["处理不可见操作",{"2":{"728":1}}],["处理接收包",{"2":{"479":1}}],["处理元素的几何属性",{"2":{"358":1}}],["处理entries",{"2":{"143":2}}],["处理之后",{"2":{"143":2}}],["处理",{"2":{"137":2}}],["套接字或处理函数关闭",{"2":{"826":1}}],["套接字在尝试连接时接收到",{"2":{"822":1}}],["套接字上联应用进程",{"2":{"485":1}}],["套接字",{"2":{"485":1}}],["缺陷",{"0":{"483":1,"555":1,"558":1}}],["缺点",{"2":{"65":2}}],["首部",{"2":{"481":1}}],["首屏加载优化",{"0":{"51":1}}],["检查",{"2":{"854":1}}],["检查是否执行",{"2":{"819":1}}],["检查网络是否通畅",{"2":{"480":1}}],["检索新的",{"2":{"819":1,"824":1}}],["检测",{"0":{"825":1}}],["检测到方向变化触发此事件",{"2":{"233":1}}],["检测图是否存在环",{"2":{"17":1}}],["寻址",{"2":{"480":1}}],["制定了一套新地址",{"2":{"480":1}}],["线缆规范",{"2":{"477":1}}],["线程控制",{"2":{"795":1}}],["线程继续接管",{"2":{"733":1}}],["线程接管渲染",{"2":{"733":1}}],["线程是建立在进程的基础上的一次程序运行单位",{"2":{"725":1}}],["线程是",{"2":{"725":1}}],["线程之间的关系",{"0":{"725":1}}],["线程处理",{"2":{"363":1}}],["线程",{"2":{"350":2,"356":1,"357":1,"358":1,"359":1,"360":1,"361":3,"362":2,"363":2,"364":2,"365":2,"366":2,"367":1,"368":1,"669":1,"724":1}}],["针脚",{"2":{"477":1}}],["针对场景",{"2":{"186":1}}],["针对线上发布的流程规范",{"2":{"23":1}}],["针对通用组件变更的版本变更报警",{"2":{"23":1}}],["针对基础框架和通用组件的单元测试",{"2":{"23":1}}],["针对",{"2":{"23":2,"666":1}}],["针对整个业务层的",{"2":{"23":1}}],["介质访问控制子层",{"2":{"476":1}}],["介绍",{"2":{"154":1,"749":1}}],["决定数据的路径选择和转寄",{"2":{"475":1}}],["媒体响应式布局",{"2":{"621":1}}],["媒体存取控制位址",{"2":{"467":1}}],["媒体类型",{"2":{"205":1}}],["起网关作用",{"2":{"466":1}}],["起一个",{"2":{"354":1}}],["翻译器",{"2":{"465":1}}],["局域网地址",{"2":{"467":1}}],["局域网互连",{"2":{"465":1}}],["局限性",{"2":{"188":1}}],["广域网",{"2":{"547":1}}],["广域网互连",{"2":{"465":1}}],["广播返回给客户机一个",{"2":{"422":1}}],["广播包封装了",{"2":{"422":1}}],["广播包分配一个地址",{"2":{"422":1}}],["广播",{"2":{"422":4,"480":1}}],["广播地址",{"2":{"421":1,"429":1}}],["光标位置",{"2":{"815":1}}],["光标移动到第",{"2":{"815":2}}],["光标移动到上面第",{"2":{"815":1}}],["光标移动到下面第",{"2":{"815":1}}],["光标移到上一行",{"2":{"815":1}}],["光标移到下一行",{"2":{"815":1}}],["光标后移",{"2":{"815":2}}],["光标前移",{"2":{"815":1}}],["光标下移",{"2":{"815":1}}],["光标在屏幕边缘",{"2":{"815":1}}],["光标向指定的方向移动",{"2":{"815":1}}],["光标上移",{"2":{"815":1}}],["光",{"2":{"464":1}}],["光栅化",{"2":{"364":2}}],["光栅化任务",{"2":{"352":1}}],["光栅化线程",{"2":{"350":1}}],["经典以太网",{"2":{"463":1}}],["经历多一点你以后的路就好走一点",{"2":{"324":1}}],["电商平台申请的证书属于",{"2":{"568":1}}],["电压",{"2":{"477":1}}],["电子信号和介质访问层协议的内容",{"2":{"463":1}}],["电脑桌面",{"2":{"226":1}}],["拓扑结构",{"2":{"463":1}}],["涉及到资源的修改和创建都是不安全的",{"2":{"461":1}}],["响应值",{"2":{"494":2}}],["响应协议升级",{"2":{"490":1}}],["响应客户端套接字的请求",{"2":{"487":1}}],["响应体",{"2":{"461":1}}],["响应头",{"0":{"492":1},"1":{"493":1},"2":{"461":1}}],["幂等",{"2":{"461":1}}],["隧道",{"2":{"459":1}}],["直接在元素上使用回调函数",{"2":{"877":2}}],["直接创建",{"2":{"877":2}}],["直接返回这个",{"2":{"761":1}}],["直接修改",{"2":{"455":1}}],["直滚动条的宽度",{"2":{"718":1}}],["直到队列为空",{"2":{"824":1}}],["直到队列用尽",{"2":{"819":1}}],["直到遇见第一个匹配的标识符为止",{"2":{"773":1}}],["直到根证书机构为止",{"2":{"566":1}}],["直到堆为空",{"2":{"12":1}}],["种方法",{"2":{"450":1}}],["该位置决定了变量的生命周期",{"2":{"767":1}}],["该线程就会执行",{"2":{"730":1}}],["该数组的成员是一个个表示键值对的数组",{"2":{"668":1}}],["该ip地址属于192",{"2":{"548":2}}],["该",{"2":{"547":1}}],["该请求不可接受",{"2":{"534":1}}],["该类地址中数字",{"2":{"446":1}}],["该如何处理",{"2":{"168":1}}],["特性",{"2":{"718":6}}],["特定地址被拒绝访问网站",{"2":{"529":1}}],["特殊字符",{"2":{"706":1}}],["特殊字符进行编码",{"2":{"706":1}}],["特殊地址",{"0":{"495":1},"1":{"496":1,"497":1,"498":1,"499":1}}],["特殊的网址",{"0":{"446":1}}],["特点是每个元素对应帧缓冲区中的一像素",{"2":{"364":1}}],["特点",{"0":{"7":1}}],["权威机构",{"2":{"438":1}}],["公钥",{"2":{"564":1}}],["公钥是可以被拦截获取的",{"2":{"558":1}}],["公钥只有私钥能解密",{"2":{"556":1}}],["公有地址",{"0":{"438":1}}],["公共组件",{"2":{"33":1}}],["唯一地址",{"2":{"436":1}}],["互联网协议地址",{"2":{"434":1}}],["就执行脚本",{"2":{"827":1}}],["就无法绑定其他",{"2":{"803":2}}],["就会栈溢出",{"2":{"787":1}}],["就会使用",{"2":{"770":1}}],["就会创建一个prototype对象",{"2":{"761":1}}],["就是记录其中的一个属性",{"2":{"796":1}}],["就是一个独立的进程",{"2":{"726":1}}],["就是你现在付出的",{"2":{"324":1}}],["就可以使用对称加密方式传输数据",{"2":{"560":1}}],["就可以测试本机中配置的",{"2":{"446":1}}],["就需要分片来传输",{"2":{"433":1}}],["作用域中",{"2":{"776":2}}],["作用域泄露",{"2":{"776":1}}],["作用域查找始终从运行时所处的最内部作用域开始",{"2":{"773":1}}],["作用域查找会在找到第一个匹配的标识符停止",{"2":{"773":1}}],["作用域是由代码中函数声明的位置来决定的",{"2":{"771":1}}],["作用域是一套规则",{"2":{"770":1}}],["作用域链保证对执行环境有权访问",{"2":{"770":1}}],["作用域链",{"2":{"770":1,"794":1}}],["作用域控制着变量的可见性与生命周期",{"2":{"767":1}}],["作用域",{"0":{"765":1},"1":{"766":1,"767":1,"768":1,"769":1,"770":1,"771":1,"772":1,"773":1,"774":1,"775":1,"776":1,"777":1,"778":1,"779":1,"780":1}}],["作用",{"2":{"433":1,"815":1}}],["作为函数参数时使用",{"2":{"838":1}}],["作为函数调用时",{"2":{"670":1,"864":1}}],["作为对象时",{"2":{"670":1,"864":1}}],["作为父类的构造对象",{"2":{"670":1}}],["作为构造函数",{"2":{"668":1}}],["作为属性名",{"2":{"667":1}}],["作为网关或者代理工作的服务器尝试执行请求时",{"2":{"541":1,"543":1}}],["作为开头",{"2":{"446":1}}],["作为",{"2":{"104":1}}],["除了关闭的回调函数",{"2":{"824":1}}],["除了要有确定的地址",{"2":{"432":1}}],["除",{"2":{"814":1}}],["除非指定",{"2":{"866":1}}],["除非后一个元素加上",{"2":{"583":1}}],["除非没有流入流线框",{"2":{"326":1}}],["环回地址",{"2":{"499":1}}],["环回接口",{"2":{"429":1}}],["环境变量长度太大",{"2":{"330":1}}],["环境变量配置",{"2":{"330":1}}],["环境准备",{"0":{"107":1}}],["组成部分",{"2":{"815":1}}],["组合类型的值",{"2":{"838":1}}],["组合继承",{"2":{"762":1}}],["组合使用构造函数和原型模式",{"2":{"761":1}}],["组合使用",{"0":{"661":1}}],["组名",{"2":{"666":2}}],["组织信息",{"2":{"564":1}}],["组播地址",{"2":{"429":1}}],["组件上",{"2":{"877":1}}],["组件内维护自身的事件",{"2":{"38":1}}],["组件内维护自身的数据和状态",{"2":{"38":1}}],["组件封装",{"0":{"38":1}}],["组件划分",{"0":{"37":1}}],["组件化设计",{"0":{"36":1},"1":{"37":1,"38":1}}],["组件化与模块化设计",{"0":{"31":1},"1":{"32":1,"33":1,"34":1,"35":1,"36":1,"37":1,"38":1}}],["留待后用",{"2":{"429":1}}],["另外要配置初始启动文件",{"2":{"424":1}}],["租期",{"2":{"424":1}}],["租给你",{"2":{"422":1}}],["租房",{"2":{"422":1}}],["源端口",{"2":{"422":2}}],["源码",{"2":{"147":1,"191":1,"715":2}}],["源码移步这里",{"2":{"142":1}}],["源码可以点击下方链接",{"2":{"142":1}}],["源码分析",{"0":{"130":1},"1":{"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1}}],["源码实现",{"0":{"98":1,"133":1},"1":{"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1}}],["退租",{"2":{"422":1}}],["都会生成一个",{"2":{"764":1}}],["都会执行",{"2":{"737":2}}],["都是指在一个进程内的单和多",{"2":{"725":1}}],["都是明文的",{"2":{"555":1}}],["都不是幂等",{"2":{"461":1}}],["都相同的话",{"2":{"416":1}}],["都有一套完整的统一流程",{"2":{"181":1}}],["告知服务器正式请求会使用哪一种",{"2":{"414":1}}],["告知服务器正式请求会使用哪些",{"2":{"413":1}}],["告诉开发人员设备什么时候开始移动",{"2":{"233":1}}],["哪些域名可以被允许发送消息",{"2":{"419":1}}],["哪些",{"2":{"410":1}}],["给用户分配",{"2":{"551":1}}],["给",{"2":{"406":1}}],["给选中的文本加上背景颜色",{"2":{"114":1}}],["头部开始",{"2":{"666":1}}],["头信息返回",{"2":{"508":1}}],["头带正文合起来不允许超过",{"2":{"433":1}}],["头的名称能在响应中列出",{"2":{"411":1}}],["头",{"2":{"409":1,"413":1,"422":6}}],["头决定浏览器是否阻止前端",{"2":{"405":1}}],["头组成",{"2":{"405":1}}],["跨域问题",{"0":{"682":1}}],["跨域访问的几种方式",{"0":{"418":1},"1":{"419":1}}],["跨域资源共享",{"2":{"405":1}}],["跨站攻击",{"2":{"402":1}}],["跨站",{"0":{"72":1}}],["跨站脚本攻击",{"2":{"68":1}}],["黑名单不被允许",{"2":{"404":1}}],["仅在需要时加载模块",{"2":{"842":1}}],["仅在内部使用",{"2":{"819":1}}],["仅适用于同一格式上下文中的项目",{"2":{"575":1}}],["仅用于两个高层协议不同的网络互连",{"2":{"465":1}}],["仅属于当前域名和当前页",{"2":{"404":1}}],["仅加载需要的资源",{"2":{"51":1}}],["过后运行脚本",{"2":{"827":1}}],["过几秒刷新跳转",{"2":{"701":1}}],["过期时间",{"0":{"398":1},"1":{"399":1,"400":1}}],["过滤那些节点的属性不被监听改变",{"2":{"160":1,"755":1}}],["隔开",{"2":{"395":1}}],["隔开document",{"2":{"395":1}}],["由单独的",{"2":{"795":1}}],["由于",{"2":{"776":2}}],["由一系列传输的",{"2":{"405":1}}],["由一系列字符串组成",{"2":{"393":1}}],["由观察者实例决定",{"2":{"161":1,"756":1}}],["累计布局偏移",{"2":{"391":1}}],["测量工具",{"0":{"382":1}}],["测试包",{"2":{"870":1}}],["测试解析路径",{"0":{"851":1}}],["测试",{"2":{"61":1}}],["测试数据",{"2":{"42":1}}],["网际协议",{"2":{"478":1}}],["网际协议地址",{"2":{"434":1}}],["网间连接器",{"2":{"465":1}}],["网关在网络层以上实现网络互连",{"2":{"465":1}}],["网关",{"0":{"465":1}}],["网关地址",{"2":{"421":1,"424":1}}],["网线插着",{"2":{"433":1}}],["网卡可以发送多播包",{"2":{"433":1}}],["网卡有广播地址",{"2":{"433":1}}],["网卡处于启动状态",{"2":{"433":1}}],["网卡生产出来就带着这个地址",{"2":{"432":1}}],["网卡的物理地址",{"2":{"432":1}}],["网卡",{"2":{"429":1,"477":1,"479":1}}],["网页速度测量工具",{"2":{"382":1}}],["网页字体",{"2":{"381":1}}],["网络操作",{"2":{"728":1}}],["网络信任",{"2":{"568":1}}],["网络中编号为11的主机",{"2":{"548":2}}],["网络划分为若干个小的子网络",{"2":{"547":1}}],["网络加速器",{"2":{"510":1}}],["网络地址",{"2":{"480":1}}],["网络地址的最高位必须为",{"2":{"441":1,"442":1,"443":1}}],["网络表头包含了网络数据",{"2":{"475":1}}],["网络传输协议",{"0":{"469":1}}],["网络模型",{"0":{"468":1,"470":1},"1":{"469":1,"470":1,"471":2,"472":2,"473":2,"474":2,"475":2,"476":2,"477":2,"478":1,"479":1,"480":1,"481":1,"482":1,"483":1}}],["网络分层",{"0":{"448":1},"1":{"449":1}}],["网络",{"2":{"446":1}}],["网络设备的状态标识",{"0":{"433":1},"2":{"433":1}}],["网络号的计算",{"2":{"429":1}}],["网络号",{"2":{"429":1}}],["网络跳线",{"2":{"427":1}}],["网络协议例子",{"2":{"427":1}}],["网络协议",{"0":{"426":1},"1":{"427":1,"428":1,"429":1,"430":1,"431":1,"432":1,"433":1}}],["网络资源请求时间",{"2":{"56":1}}],["网络请求优化",{"0":{"50":1}}],["网络耗时",{"2":{"48":1}}],["网络层设备",{"2":{"466":1}}],["网络层",{"0":{"475":1,"480":1},"2":{"33":1,"427":1}}],["改进",{"0":{"381":1}}],["改变了全局作用域function",{"2":{"776":1}}],["改变了全局作用域",{"2":{"775":2,"776":1}}],["改变大小",{"2":{"718":2}}],["改变文字方向",{"2":{"581":1}}],["改变不会重载",{"2":{"271":1}}],["改变的目标结点",{"2":{"156":1,"751":1}}],["改变生成标签组",{"2":{"139":2}}],["改变",{"2":{"139":2,"156":4,"158":2,"159":1,"672":2,"751":4,"753":2,"754":1}}],["子类静态方法中",{"2":{"670":1}}],["子类普通方法中",{"2":{"670":1}}],["子元素将根据新的上下文堆叠",{"2":{"660":1}}],["子元素",{"2":{"649":1}}],["子元素的float",{"2":{"651":1}}],["子元素的",{"2":{"583":2}}],["子元素设置",{"2":{"576":1}}],["子网络遮罩",{"2":{"545":1}}],["子网内",{"2":{"480":1}}],["子网掩码的十进制数值",{"2":{"548":1}}],["子网掩码的二进制数值",{"2":{"548":1}}],["子网掩码和",{"2":{"429":1}}],["子网掩码",{"0":{"431":1,"545":1},"1":{"546":1,"547":1,"548":1,"549":1,"550":1,"551":1},"2":{"421":1,"424":1,"429":1,"545":1}}],["子框架可以使用",{"2":{"380":1}}],["子文件夹",{"2":{"309":1}}],["您应该考虑这些元素",{"2":{"380":1}}],["真正计算的指标存在差异",{"2":{"380":1}}],["面向链接的",{"2":{"481":1}}],["面向用户",{"2":{"59":1}}],["面试",{"0":{"377":1}}],["供",{"2":{"359":1}}],["职责",{"2":{"356":1,"357":1,"358":1,"359":1,"360":1,"361":1,"362":1,"363":1,"364":1,"365":1,"366":1,"367":1,"368":1}}],["职责驱动设计",{"2":{"34":1}}],["老版本的默认策略",{"2":{"354":1}}],["老生代",{"0":{"180":1}}],["绘制等",{"2":{"729":1}}],["绘制到用户界面上",{"2":{"728":1}}],["绘制",{"2":{"352":1}}],["生命周期",{"2":{"351":1}}],["生成的文本是具有给定名称的所有计数器的值",{"2":{"641":1}}],["生成的签名",{"2":{"564":1}}],["生成以太网数据包",{"2":{"480":1}}],["生成位图",{"2":{"364":1}}],["生成",{"2":{"357":1,"359":1,"368":1}}],["生成字节码",{"0":{"173":1}}],["生成抽象语法树和执行上下文",{"0":{"172":1}}],["生成抽象语法树",{"2":{"170":1}}],["生成访问的html文件",{"2":{"104":1}}],["k",{"2":{"666":6,"815":1,"866":4}}],["khtml",{"2":{"347":1}}],["keep",{"2":{"256":2,"265":2,"266":1}}],["keyof",{"2":{"837":1,"866":2}}],["keywords",{"2":{"701":1,"832":1}}],["keyfor",{"2":{"667":3}}],["key",{"0":{"493":1,"624":1},"2":{"490":2,"494":7,"668":2,"865":1,"866":4}}],["keyid",{"2":{"259":2}}],["keycode",{"2":{"227":1}}],["keypress按下能够影响文本显示的键",{"2":{"227":1}}],["keypress",{"2":{"227":3}}],["keypress用户按下任意键触发",{"2":{"227":1}}],["keyup",{"2":{"227":3}}],["keydown",{"2":{"227":3}}],["keys",{"2":{"13":2,"309":3,"668":2,"838":6}}],["→",{"2":{"347":7,"356":4}}],["安装时会在",{"2":{"832":1}}],["安装所需要的依赖包",{"2":{"107":1}}],["安排回调在轮询阶段完成后立即执行",{"2":{"825":1}}],["安全的",{"2":{"808":1}}],["安全性",{"0":{"561":1}}],["安全",{"2":{"461":1}}],["安全浏览器",{"2":{"347":1}}],["库",{"2":{"347":2,"382":1}}],["⚠️⚠️⚠️",{"2":{"672":2}}],["⚠️super",{"2":{"670":1}}],["⚠️反斜杠与通常的顺序相反",{"2":{"666":2}}],["⚠️",{"2":{"345":1}}],["za",{"2":{"852":2}}],["zone",{"2":{"808":1}}],["z",{"2":{"660":1,"666":6,"814":1,"815":2,"852":2,"864":4}}],["zzz",{"2":{"345":1}}],["zero",{"2":{"345":1,"641":1}}],["⌚",{"2":{"345":1}}],["❌",{"2":{"345":1,"762":2}}],["☕",{"2":{"345":1}}],["危险",{"2":{"343":3}}],["警告用户发生错误的情况",{"2":{"828":1}}],["警告",{"2":{"343":3,"777":1}}],["轻提示",{"2":{"343":3}}],["风格类",{"0":{"342":1}}],["百度一下",{"2":{"341":2}}],["部分属性",{"2":{"838":1}}],["部分",{"2":{"336":1,"345":1,"815":1}}],["腾讯云",{"0":{"334":1}}],["阿里云服务器",{"0":{"332":1},"1":{"333":1}}],["云服务器ecs",{"0":{"331":1},"1":{"332":1,"333":1,"334":1}}],["命名空间",{"2":{"618":1}}],["命名的文件",{"2":{"330":1}}],["命令空间",{"2":{"852":1}}],["命令使用",{"2":{"669":1}}],["命令可以使得",{"2":{"257":1}}],["命令的结果相同",{"2":{"114":1}}],["命令",{"2":{"113":1,"254":1}}],["规定了包括物理层的连线",{"2":{"463":1}}],["规定",{"2":{"326":1,"590":1}}],["规范主要对属性变化的是操作",{"2":{"672":2}}],["规范中建议使用",{"2":{"196":1}}],["规范中表示",{"2":{"194":1}}],["规范是为性能而设计的",{"2":{"161":1,"756":1}}],["向下滚动",{"2":{"815":1}}],["向下偏移一点了",{"2":{"326":2}}],["向上滚动",{"2":{"815":1}}],["向服务器发出预请求",{"2":{"458":1}}],["向服务器发出指定资源的请求",{"2":{"452":1}}],["向指定资源位置上传其最新内容",{"2":{"455":1}}],["向指定资源提交数据",{"2":{"453":1}}],["向指定的资源发起请求",{"2":{"451":1}}],["向",{"2":{"425":1,"564":1}}],["向着自己的目标进发",{"2":{"324":1}}],["努力下去",{"2":{"324":1}}],["走下去",{"2":{"324":1}}],["走入社会",{"2":{"324":1}}],["慢慢积累自己的经历",{"2":{"324":1}}],["往后的路还长",{"2":{"324":1}}],["～",{"2":{"324":3}}],["社会中面对着不同的层次",{"2":{"324":1}}],["学校中身边的都是你的同龄人",{"2":{"324":1}}],["靠着自己的一分热血",{"2":{"324":1}}],["靠着校招拿到一个",{"2":{"324":1}}],["沾沾自喜的我开始了第一份自己的工作",{"2":{"324":1}}],["路径目录",{"2":{"857":2}}],["路径不报错",{"2":{"857":2}}],["路径支持",{"0":{"676":1}}],["路从现在开始",{"2":{"324":1}}],["路途未知",{"2":{"324":1}}],["路由是否可用",{"2":{"480":1}}],["路由协议",{"2":{"480":1}}],["路由器",{"0":{"466":1}}],["路由",{"2":{"349":1}}],["路由url加上",{"2":{"270":1}}],["路由管理工具",{"2":{"58":1}}],["迈出校门",{"2":{"324":1}}],["年初",{"2":{"324":1}}],["毕业",{"2":{"324":1}}],["确认机制的",{"2":{"481":1}}],["确认是否租用",{"2":{"422":1}}],["确保服务端理解",{"2":{"493":1}}],["确保",{"2":{"365":1}}],["确切位置",{"2":{"323":1}}],["确定元素大小",{"2":{"718":1}}],["确定",{"2":{"480":1}}],["确定指定的节点是否包含在选区中",{"2":{"114":1}}],["确定各个模块间的边界和调用方式",{"2":{"63":1}}],["完整路径",{"2":{"676":1}}],["完全可行",{"2":{"321":1}}],["完成之前执行",{"2":{"138":1}}],["完成一次通信",{"2":{"106":1}}],["虽然是独立的文件",{"2":{"321":1}}],["更强的隔离性以及对捆绑的更好工具支持",{"2":{"853":1}}],["更好的代码重用性",{"2":{"853":1}}],["更好的二进制支持",{"2":{"489":1}}],["更多阅读",{"2":{"816":1}}],["更多",{"0":{"816":1}}],["更改元素的布局",{"2":{"658":1}}],["更改硬盘驱动器上的数据",{"2":{"321":1}}],["更新日志信息",{"2":{"832":1}}],["更新文件或文档的一部分来节省带宽",{"2":{"460":1}}],["更新配置",{"2":{"422":1}}],["更新当前页面的历史状态",{"2":{"268":1}}],["硬绑定",{"2":{"803":1}}],["硬盘中存在一个文件为",{"2":{"321":1}}],["硬链接依然占据空间",{"2":{"323":1}}],["硬链接指向文件本身",{"2":{"323":1}}],["硬链接是原始文件的镜像副本",{"2":{"320":1}}],["硬链接相当于存储在硬盘驱动器中的文件",{"2":{"320":1}}],["硬链接",{"2":{"319":1}}],["连接保持+心跳",{"0":{"491":1}}],["连接建立",{"2":{"487":1}}],["连接确认",{"2":{"487":1}}],["连接",{"0":{"487":1},"2":{"493":2,"499":1,"804":1}}],["连接两个或多个网络的硬件设备",{"2":{"466":1}}],["连接是逻辑连接",{"2":{"316":1}}],["连续点击了多次",{"2":{"168":1}}],["链",{"0":{"715":1},"2":{"715":1}}],["链路层不是通常意义的一层",{"2":{"483":1}}],["链路层",{"0":{"479":1},"2":{"427":1}}],["链接类",{"0":{"341":1}}],["链接",{"0":{"314":1},"1":{"315":1,"316":1,"317":1,"318":1,"319":1,"320":1,"321":1,"322":1,"323":1},"2":{"402":1}}],["链表倒转",{"0":{"19":1}}],["链表",{"0":{"18":1},"1":{"19":1},"2":{"13":1,"15":1}}],["也称组播地址",{"2":{"444":1}}],["也称符号链接",{"2":{"315":1}}],["也会启动一个新的",{"2":{"354":1}}],["也不一定会在",{"2":{"311":1}}],["也可以不指定参数类型",{"2":{"860":2}}],["也可以指定值",{"2":{"859":2}}],["也可以接受一个数组作为参数",{"2":{"668":1}}],["也可以生成密钥来解析数据",{"2":{"555":1}}],["也可以全称配置",{"2":{"242":1}}],["也可以转换位",{"2":{"206":1}}],["延迟脚本",{"2":{"311":1}}],["延期风险",{"2":{"67":1}}],["匹配模式对比",{"2":{"666":1}}],["匹配",{"2":{"396":2}}],["匹配文件",{"2":{"309":1}}],["匹配媒体属性相关的信息",{"2":{"149":1}}],["已遗弃",{"2":{"854":1}}],["已经被弃用",{"2":{"797":2}}],["已经随",{"2":{"508":1}}],["已经存在的",{"2":{"395":1}}],["已经定义好的模块",{"2":{"303":1}}],["已否有异常涨跌",{"2":{"47":1}}],["函数能一个定义完",{"2":{"872":1}}],["函数返回",{"2":{"872":1}}],["函数返回不要使用",{"2":{"872":1}}],["函数泛型",{"2":{"866":1}}],["函数可以重复定义类型",{"2":{"861":1}}],["函数类型",{"2":{"860":1}}],["函数本身",{"2":{"802":2}}],["函数被调用的位置",{"2":{"799":1}}],["函数都可以看成对象",{"2":{"797":1}}],["函数都在构造函数中定义",{"2":{"762":1}}],["函数的参数等信息",{"2":{"796":1}}],["函数的调用",{"2":{"796":1}}],["函数名称跟着一对小括号执行",{"2":{"784":1}}],["函数作用域",{"0":{"779":1}}],["函数复用性问题与构造函数模式相似",{"2":{"762":1}}],["函数复用无从谈起",{"2":{"762":1}}],["函数调用",{"0":{"740":1,"784":1}}],["函数执行完毕之后",{"2":{"786":1}}],["函数执行",{"2":{"669":1}}],["函数执行上下文",{"2":{"176":1}}],["函数参数默认值",{"2":{"664":2}}],["函数算法计算明文信息",{"2":{"565":1}}],["函数",{"0":{"303":1,"304":1},"2":{"642":1,"669":1,"795":1,"806":2,"828":1}}],["例子",{"0":{"644":1,"713":1},"2":{"295":1}}],["例如队列长度为",{"2":{"162":1,"757":1}}],["←",{"2":{"294":6}}],["扩充了负数的最小值",{"2":{"294":1}}],["扩展配置",{"2":{"857":2}}],["扩展",{"0":{"204":1,"251":1,"307":1,"588":1,"717":1},"1":{"205":1,"206":1,"308":1,"309":1,"589":1,"590":1,"591":1,"592":1,"593":1,"594":1,"595":1},"2":{"643":1,"718":1}}],["补码具有两种表示形式",{"2":{"294":1}}],["补码",{"0":{"294":1}}],["补充",{"2":{"191":1}}],["减法",{"2":{"293":1}}],["减少访问的次数",{"2":{"716":1}}],["减少网络上的通信量",{"2":{"549":1}}],["减少关键资源的请求数量以及大小",{"2":{"376":1}}],["减少缩进",{"2":{"113":1}}],["减少对象的创建",{"2":{"55":1}}],["减少运行次数",{"2":{"53":1}}],["减少计算等待时长",{"2":{"53":1}}],["减少计算耗时",{"2":{"53":1}}],["减少浏览器渲染过程中的计算耗时",{"2":{"52":1}}],["减少页面二次请求和渲染的耗时",{"2":{"51":1}}],["减少白屏时间",{"2":{"51":1}}],["减少通信次数",{"2":{"50":1}}],["减少传输数据大小",{"2":{"50":1}}],["减少请求资源的体积",{"2":{"50":1}}],["减少",{"2":{"50":1,"52":2}}],["减少耗时",{"2":{"49":1}}],["八进制",{"2":{"290":1}}],["八进制转换",{"0":{"290":1}}],["依次累加",{"2":{"865":1}}],["依次类推",{"2":{"288":1,"296":1}}],["依然有效",{"2":{"666":2}}],["依据路由表的信息",{"2":{"466":1}}],["依旧存在",{"2":{"322":2}}],["依赖于模块加载器",{"2":{"853":1}}],["依赖于其他的分支可以回基到想要的分支上",{"2":{"257":1}}],["依赖的上游",{"2":{"255":1}}],["依赖倒置",{"2":{"35":1,"63":1}}],["余",{"2":{"287":3}}],["舍入为",{"2":{"282":1}}],["偶数",{"2":{"282":1}}],["之外的其他",{"2":{"814":1}}],["之间由指定字符串分隔",{"2":{"641":1}}],["之间的整数=",{"2":{"282":2}}],["之一",{"2":{"519":1}}],["之内",{"2":{"379":1}}],["之后各个组成部分的字符范围",{"2":{"815":1}}],["之后",{"2":{"368":1,"422":1}}],["之后再计算当前位置偏移高度",{"2":{"191":2}}],["−9007199254740992",{"2":{"282":1}}],["≈",{"2":{"280":2}}],["半精度",{"0":{"279":1}}],["十进制",{"2":{"287":1}}],["十进制舍入",{"2":{"278":1}}],["十六进制",{"2":{"289":1,"432":1,"814":1}}],["十六进制转换",{"0":{"289":1}}],["十六进制转换成",{"0":{"208":1}}],["十六进制颜色带透明度的颜色值",{"2":{"208":2}}],["四倍精度",{"0":{"277":1}}],["四种情况",{"2":{"8":1}}],["双重扩展",{"0":{"276":1}}],["双精度浮点数",{"2":{"295":1}}],["双精度",{"0":{"275":1}}],["双击鼠标按钮",{"2":{"226":1}}],["约",{"2":{"274":1,"275":1,"276":1,"277":1}}],["约定规范",{"0":{"30":1}}],["基本类型",{"2":{"793":1}}],["基本原始类型数据存放与栈空间中",{"2":{"790":1}}],["基本原始类型",{"2":{"788":1}}],["基本别废弃",{"2":{"703":1}}],["基本使用",{"0":{"675":1}}],["基本格式",{"0":{"273":1},"1":{"274":1,"275":1,"276":1,"277":1,"278":1,"279":1}}],["基于可变长子网掩码",{"2":{"551":1}}],["基于字节流的通信协议",{"2":{"481":1}}],["基于",{"2":{"393":1,"464":1}}],["基线自动设置为",{"2":{"326":1}}],["基线是底部边沿",{"2":{"326":1}}],["基础",{"0":{"855":1},"1":{"856":1,"857":1,"858":1,"859":1,"860":1,"861":1,"862":1,"863":1,"864":1,"865":1,"866":1}}],["基础盒模型",{"0":{"585":1}}],["基础库变更报警",{"0":{"27":1}}],["基础服务组件",{"2":{"23":1}}],["基础框架层",{"2":{"23":1}}],["现实当中",{"2":{"311":1}}],["现代计算机中的浮点",{"2":{"272":1}}],["现有框架",{"2":{"59":1}}],["打开",{"2":{"321":2}}],["打开显示错误",{"2":{"318":2}}],["打开新的",{"2":{"271":1}}],["打印情况",{"2":{"158":2,"753":2}}],["打印出来",{"2":{"157":2,"752":2}}],["端口号",{"2":{"271":2,"486":1}}],["则事件循环可能继续到检查阶段而不是等待",{"2":{"825":1}}],["则事件循环将绕回计时器阶段以执行计时器回调",{"2":{"824":1}}],["则事件循环将结束轮询阶段",{"2":{"824":1}}],["则事件循环将等待回调被添加到队列中",{"2":{"819":1,"824":1}}],["则事件结束轮询阶段",{"2":{"819":1}}],["则需要用",{"2":{"718":1}}],["则这两个",{"2":{"416":1}}],["则将下边距边缘与父对象的基线对齐",{"2":{"326":1}}],["则返回空字符串",{"2":{"271":1}}],["则不会",{"2":{"268":1}}],["个属性",{"2":{"717":1}}],["个内置的",{"2":{"667":1}}],["个人申请的证书属于",{"2":{"568":1}}],["个",{"2":{"283":5,"348":4,"432":1,"815":1}}],["个指数位的系数",{"2":{"280":1}}],["个符号位",{"2":{"280":1}}],["个十进制数",{"2":{"274":1,"275":1,"276":1,"277":1}}],["个或者多个字符",{"2":{"271":1}}],["个版本以前",{"2":{"263":1}}],["哈希路由",{"0":{"270":1}}],["应用的是默认绑定",{"2":{"808":1}}],["应用的模块与层级划分",{"0":{"33":1}}],["应用了默认绑定",{"2":{"802":2}}],["应用程序与网络协议栈进行交互的接口",{"2":{"485":1}}],["应用程序通过网络协议进行通信的接口",{"2":{"485":1}}],["应用程序访问通信协议的操作系统调用套接字",{"2":{"485":1}}],["应用层",{"0":{"471":1,"482":1},"2":{"427":1}}],["应用在历史记录导航上设置默认滚动行为",{"2":{"268":1}}],["允许使用",{"2":{"857":2}}],["允许用户处理错误",{"2":{"830":1}}],["允许在调用回调之前初始化所有的变量",{"2":{"828":1}}],["允许通过递归调用来阻止i",{"2":{"828":1}}],["允许同源访问",{"2":{"683":1}}],["允许跨域就可以访问",{"2":{"682":1}}],["允许跨域",{"2":{"682":2}}],["允许跨域请求访问到它们的资源",{"2":{"406":1}}],["允许限制元素的渲染范围",{"2":{"656":1}}],["允许对被选择元素的特定部分修改样式",{"2":{"632":1}}],["允许获取当前页面的域名以及设置域名下的子域名",{"2":{"417":1}}],["允许",{"2":{"268":1}}],["允许全局使用return语句",{"2":{"237":1}}],["手册帮助",{"2":{"832":1}}],["手动遍历",{"2":{"669":1}}],["手动配置",{"2":{"421":1}}],["手动调用",{"2":{"268":1}}],["手势事件",{"2":{"234":1}}],["状态码的第一个数字代表了响应的五种状态之一",{"2":{"500":1}}],["状态码",{"0":{"500":1},"1":{"501":1,"502":1,"503":1,"504":1,"505":1,"506":1,"507":1,"508":1,"509":1,"510":1,"511":1,"512":1,"513":1,"514":1,"515":1,"516":1,"517":1,"518":1,"519":1,"520":1,"521":1,"522":1,"523":1,"524":1,"525":1,"526":1,"527":1,"528":1,"529":1,"530":1,"531":1,"532":1,"533":1,"534":1,"535":1,"536":1,"537":1,"538":1,"539":1,"540":1,"541":1,"542":1,"543":1,"544":1},"2":{"501":1}}],["状态代码",{"2":{"490":1}}],["状态",{"2":{"268":1}}],["状态对象",{"2":{"268":2}}],["状态管理工具",{"2":{"58":1}}],["负载定义注意声明的顺序",{"2":{"872":1}}],["负载",{"2":{"861":1}}],["负责收据并维护所有声明的标识符",{"2":{"766":1}}],["负责处理解析和执行",{"2":{"730":1}}],["负责渲染页面",{"2":{"730":1}}],["负责页面渲染",{"2":{"729":1}}],["负责管理计算机通信设备和网络媒体之间的互通",{"2":{"477":1}}],["负责网络寻址",{"2":{"476":1}}],["负责单个",{"2":{"350":1}}],["负责",{"2":{"349":1}}],["负数二进制可以用补码表示",{"2":{"294":1}}],["负数的反码是在其原码的基础上",{"2":{"293":1}}],["负数",{"2":{"268":1}}],["负值表示逆时针旋转",{"2":{"234":1}}],["区分",{"2":{"618":2}}],["区分网段",{"2":{"480":1}}],["区分两台主机是否属于同一网络",{"2":{"480":1}}],["区别",{"0":{"323":1},"2":{"266":1}}],["区间为",{"2":{"210":2}}],["恢复",{"2":{"860":2}}],["恢复执行",{"2":{"669":1}}],["恢复工作区的文件",{"2":{"261":1}}],["恢复存在的提交记录",{"2":{"258":1}}],["​",{"2":{"259":2,"262":4,"265":4}}],["精简分支树",{"2":{"257":1}}],["精简提交记录",{"2":{"257":1}}],["报错",{"2":{"664":3,"669":1}}],["报",{"2":{"329":1}}],["报告核心常见问题的规则子集",{"2":{"251":1}}],["报警",{"0":{"28":1},"2":{"23":1}}],["└─┬",{"2":{"250":1,"857":2}}],["└──┤",{"2":{"820":1}}],["└───────────────────────────┘",{"2":{"820":1}}],["└───────────────┘",{"2":{"820":1}}],["└─────────────┬─────────────┘",{"2":{"820":5}}],["└──",{"2":{"250":2,"850":22,"857":6}}],["│",{"2":{"250":1,"820":30,"850":18,"857":4}}],["├──",{"2":{"250":3,"850":18,"857":6}}],["层次结构",{"2":{"250":1}}],["层的概念",{"2":{"433":1}}],["层的接口测试",{"2":{"23":1}}],["层的",{"2":{"23":1}}],["级绑定事件",{"0":{"710":1},"1":{"711":1,"712":1,"713":1}}],["级联",{"2":{"250":1}}],["级事件处理程序",{"0":{"217":1,"218":1}}],["共享配置",{"0":{"249":1}}],["共同加入到",{"2":{"106":1}}],["禁止使用",{"0":{"248":1},"2":{"761":1}}],["行",{"2":{"815":3}}],["行的开头",{"2":{"815":2}}],["行框内的高度",{"2":{"630":1}}],["行框内文字",{"2":{"629":1}}],["行框元素",{"2":{"627":1}}],["行内样式",{"2":{"718":2}}],["行内引述内容",{"2":{"693":3}}],["行内执行顺序",{"0":{"679":1}}],["行内块级元素",{"2":{"643":1}}],["行内元素",{"0":{"627":1},"1":{"628":1,"629":1,"630":1},"2":{"599":1,"627":1,"643":1}}],["行内元素设置垂直间距不适用",{"2":{"578":1}}],["行内元素设置水平间距可以适用",{"2":{"578":1}}],["行内盒子",{"2":{"587":1}}],["行内级盒子",{"2":{"587":1}}],["行内级元素",{"2":{"587":1}}],["行内内容",{"2":{"583":3}}],["行内格式化上下文填充和边框不会将行框撑开",{"2":{"578":1}}],["行内格式化上下文",{"2":{"577":1}}],["行内注释",{"0":{"246":1}}],["行走",{"2":{"233":1}}],["顺序不绝对先后",{"2":{"680":1}}],["顺序",{"2":{"234":1}}],["触摸事件",{"2":{"234":1}}],["触摸与手势事件",{"0":{"234":1}}],["触发顺序",{"2":{"225":1}}],["触发条件",{"2":{"224":1}}],["触发",{"2":{"224":1}}],["掉下",{"2":{"233":1}}],["号后面的所有字符串",{"2":{"232":1}}],["及",{"2":{"232":1}}],["及时解除引用",{"2":{"55":1}}],["及时进行缓存清理",{"2":{"55":1}}],["下联网络协议栈",{"2":{"485":1}}],["下载完毕",{"2":{"425":1}}],["下一行",{"2":{"246":2}}],["下运行",{"2":{"232":2}}],["下划线",{"2":{"113":1,"690":1}}],["稳妥构造函数模式",{"2":{"761":1}}],["稳妥",{"2":{"232":1}}],["指针指向这个函数",{"2":{"761":1}}],["指明一个",{"2":{"545":1}}],["指示获取资源的请求是从什么域发起的",{"2":{"415":1}}],["指示预请求的结果能被缓存多久",{"2":{"412":1}}],["指示哪些",{"2":{"411":1}}],["指示实际的请求中可以使用哪些",{"2":{"409":1}}],["指示当请求的凭证标记为",{"2":{"408":1}}],["指示请求的资源能共享给哪些域",{"2":{"407":1}}],["指令把",{"2":{"368":1}}],["指向当前子类",{"2":{"864":1}}],["指向当前类的实例对象",{"2":{"864":1}}],["指向当前的子类实例",{"2":{"670":1}}],["指向函数的作用域",{"2":{"797":1}}],["指向函数",{"2":{"797":1}}],["指向环境",{"2":{"794":1}}],["指向变量对象",{"2":{"770":1}}],["指向后一个同辈元素",{"2":{"717":1}}],["指向前一个同辈元素",{"2":{"717":1}}],["指向最后一个子元素",{"2":{"717":1}}],["指向第一个子元素",{"2":{"717":1}}],["指向子类",{"2":{"670":1}}],["指向父类",{"2":{"670":1,"864":1}}],["指向父类的原型对象",{"2":{"670":1,"864":1}}],["指向语言内部使用的方法",{"2":{"667":1}}],["指向",{"2":{"424":1}}],["指向硬盘驱动器上完全相同的位置",{"2":{"321":1}}],["指向不能认为始终等于事件目标",{"2":{"222":1}}],["指数对齐相加",{"0":{"298":1}}],["指数对齐",{"2":{"297":1}}],["指数表示法",{"2":{"296":1}}],["指数偏差",{"2":{"283":1}}],["指数",{"2":{"283":1}}],["指数可以表示的数",{"2":{"280":1}}],["指定下标元素类型",{"2":{"859":2}}],["指定输出文件",{"2":{"857":2}}],["指定输出目录",{"2":{"857":2}}],["指定哪些包使用",{"2":{"857":2}}],["指定哪些文件需要上传到包中",{"2":{"832":1}}],["指定",{"2":{"857":2}}],["指定插件",{"2":{"857":2}}],["指定了",{"2":{"857":2}}],["指定了unload事件处理程序的页面会被排除在bfcache之外",{"2":{"231":1}}],["指定为",{"2":{"837":1,"863":1}}],["指定运行环境变量",{"2":{"832":1}}],["指定运行环境",{"2":{"832":1}}],["指定边框",{"2":{"718":2}}],["指定允许的服务器元和脚本端点",{"2":{"701":1}}],["指定编码集",{"2":{"701":1}}],["指定要选择的元素的特殊状态",{"2":{"634":1}}],["指定对预请求的响应中",{"2":{"410":1}}],["指定规则",{"2":{"246":8}}],["指定全局环境",{"0":{"241":1}}],["指定预处理器",{"0":{"239":1}}],["指定解析环境",{"0":{"240":1}}],["指定解析",{"0":{"238":1}}],["指定解析选项",{"0":{"237":1}}],["形成一个执行栈",{"2":{"733":1}}],["形成一个新的格式化上下文",{"2":{"660":1}}],["形成堆叠上下文",{"2":{"660":1}}],["形成完整的dom树之后触发",{"2":{"230":1}}],["形象举例",{"2":{"422":1}}],["形式",{"2":{"208":4,"209":2}}],["形式是",{"2":{"208":2}}],["95ca",{"2":{"494":1}}],["9f78",{"2":{"428":2}}],["9f49",{"2":{"428":4}}],["9f",{"2":{"428":4,"812":1}}],["98",{"2":{"428":2}}],["9",{"0":{"295":1},"1":{"296":1,"297":1,"298":1,"299":1},"2":{"283":1,"344":2,"450":1,"815":1}}],["9007199254740992",{"2":{"282":1}}],["900px",{"2":{"188":2}}],["90右旋转的横向模式",{"2":{"233":1}}],["90左旋转的横向模式",{"2":{"233":1}}],["9脚本输入",{"2":{"227":1}}],["什么位置上的键",{"2":{"227":1}}],["转义序列",{"0":{"814":1},"2":{"812":1}}],["转义标签",{"2":{"698":3}}],["转交到协程",{"2":{"669":1}}],["转成",{"2":{"356":1}}],["转换位可执行代码",{"2":{"766":1}}],["转换为屏幕上的像素所执行的一系列步骤",{"2":{"369":1}}],["转换为二进制为",{"2":{"287":1}}],["转换成",{"0":{"210":1,"211":1}}],["转换成十六进制",{"0":{"209":1}}],["转换成一个链接",{"2":{"113":1}}],["转为实际字符",{"2":{"227":1}}],["键值字符串",{"2":{"865":1}}],["键值数字类型依次类推",{"2":{"865":1}}],["键码",{"2":{"227":1}}],["键盘与文本事件",{"0":{"227":1}}],["释放键触发",{"2":{"227":1}}],["释放鼠标",{"2":{"226":1}}],["计时器回调尽可能早的运行",{"2":{"821":1}}],["计时器和",{"2":{"819":1,"824":1}}],["计时完毕后",{"2":{"730":1}}],["计数器的使用",{"2":{"659":1}}],["计数",{"2":{"226":1,"640":1}}],["计算应该阻塞和轮询",{"2":{"819":1,"824":1}}],["计算密钥",{"0":{"554":1}}],["计算开始位置",{"2":{"191":1}}],["计算开始位置滚动条高度",{"2":{"190":2}}],["计算可视区域数据",{"2":{"190":2}}],["计算样式",{"2":{"188":2}}],["计算当前页数",{"2":{"188":2}}],["计算当前节点的高度",{"2":{"21":1}}],["计算滚动之后的需要替换的节点个数",{"2":{"188":2}}],["计算",{"0":{"53":1},"2":{"352":1}}],["计算机通信或网上设备的共同语言",{"2":{"469":1}}],["计算机局域网技术",{"2":{"463":1}}],["计算机网络名词",{"0":{"462":1},"1":{"463":1,"464":1,"465":1,"466":1,"467":1}}],["计算机网络相互连接进行通信而设计的协议",{"2":{"435":1}}],["计算机专业什么都学",{"2":{"324":1}}],["计算机编码方式",{"0":{"291":1},"1":{"292":1,"293":1,"294":1}}],["计算机",{"2":{"50":1}}],["计算内存中二进制处理运算",{"2":{"3":1}}],["78f8",{"2":{"428":4}}],["70ff",{"2":{"428":4}}],["70",{"2":{"428":4}}],["7a",{"2":{"428":4}}],["79",{"2":{"276":1}}],["754",{"0":{"272":1},"1":{"273":1,"274":1,"275":1,"276":1,"277":1,"278":1,"279":1,"280":1,"281":1,"282":1,"283":1,"284":1,"285":1,"286":1,"287":1,"288":1,"289":1,"290":1,"291":1,"292":1,"293":1,"294":1,"295":1,"296":1,"297":1,"298":1,"299":1},"2":{"283":1}}],["7语音输入",{"2":{"227":1}}],["7",{"2":{"226":1,"232":2,"274":1,"283":1,"344":2,"428":2,"429":1,"761":1}}],["次鼠标按钮",{"2":{"226":1}}],["位于底部",{"2":{"595":2}}],["位于数据链路层",{"2":{"467":1}}],["位主机号",{"2":{"550":1}}],["位地址",{"2":{"547":1}}],["位组也不能全置为",{"2":{"446":1}}],["位是主机号",{"2":{"429":1}}],["位是网络号",{"2":{"429":1}}],["位中",{"2":{"429":1}}],["位的",{"2":{"429":1}}],["位有效域",{"2":{"284":1}}],["位指数位",{"2":{"284":1}}],["位表示标志位",{"2":{"284":1}}],["位浮点数标准",{"2":{"284":1}}],["位浮点值",{"2":{"279":1}}],["位精度",{"2":{"283":1}}],["位双精度",{"2":{"280":1}}],["位",{"2":{"274":2,"275":2,"276":1,"277":1,"280":1,"284":1,"429":10,"430":1}}],["位置",{"2":{"226":1}}],["位运算",{"0":{"3":1},"1":{"4":1,"5":1}}],["客户区大小",{"2":{"718":1}}],["客户区坐标位置",{"2":{"226":1}}],["客户端需要进行身份验证才能获得网络访问权限",{"2":{"544":1}}],["客户端需要有个",{"2":{"424":1}}],["客户端必须在代理服务器上进行身份验证",{"2":{"535":1}}],["客户端错误",{"2":{"527":1}}],["客户端应该假定服务器已经收到数据",{"2":{"521":1}}],["客户端确认了此描述",{"2":{"487":1}}],["客户端的套接字提出连接请求",{"2":{"487":1}}],["客户端请求",{"2":{"487":1}}],["客户端会请求这些文件",{"2":{"425":1}}],["客户端一个配置文件包括内核",{"2":{"425":1}}],["客户端向",{"2":{"425":1}}],["客户端调入内存",{"2":{"423":1}}],["客户端在",{"2":{"423":1}}],["客户端和服务端建立安全通信验证",{"2":{"393":1}}],["客户端渲染",{"2":{"381":1}}],["客户端",{"0":{"498":1},"2":{"108":1,"425":2,"490":1}}],["点击两次触发顺序",{"2":{"226":1}}],["点我显示",{"2":{"168":2}}],["任何时候再给定的阶段中调用",{"2":{"820":1}}],["任何子元素都基于元素定位",{"2":{"660":1}}],["任何外部都不能影响内部布局",{"2":{"658":1}}],["任何获得焦点的元素都能触发keypress事件",{"2":{"227":1}}],["任意鼠标按钮",{"2":{"226":1}}],["任务中",{"2":{"185":1}}],["鼠标点击",{"2":{"730":1}}],["鼠标滚轮事件",{"2":{"226":1}}],["鼠标按钮",{"2":{"226":1}}],["鼠标光标在页面中的位置",{"2":{"226":1}}],["鼠标在元素内部移动触发",{"2":{"226":1}}],["鼠标从元素内部移动到外部触发",{"2":{"226":1}}],["鼠标移动从元素外部首次移动到元素范围之内触发",{"2":{"226":1}}],["鼠标与滚轮事件",{"0":{"226":1}}],["鼠标和键盘",{"2":{"224":1}}],["失去焦点时触发",{"2":{"225":1}}],["焦点事件",{"0":{"225":1}}],["窗口或者框架的大小变化时触发",{"2":{"224":1}}],["嵌套计数器",{"2":{"641":1}}],["嵌套计数",{"2":{"640":1}}],["嵌套代码的复杂度等于嵌套内外复杂度的乘积",{"2":{"1":1}}],["嵌入的内容触发",{"2":{"224":1}}],["包的目录以及文件",{"2":{"870":1}}],["包结构",{"2":{"870":1}}],["包名",{"2":{"832":1}}],["包含",{"2":{"863":2}}],["包含自身",{"2":{"717":1}}],["包含元素的后代不会显示在其边界之外",{"2":{"660":1}}],["包含元素相对于布局来说是完全透明的",{"2":{"658":1}}],["包含固有的大小",{"2":{"655":1}}],["包含块",{"2":{"587":1}}],["包含了其内部所有的内容",{"2":{"575":1}}],["包含一位隐含位",{"2":{"284":1}}],["包含一个隐含位",{"2":{"280":1}}],["包含滚动距离",{"2":{"226":1}}],["包含图像文件",{"2":{"224":1}}],["包括文字颜色",{"2":{"815":1}}],["包括",{"2":{"815":1}}],["包括元素的宽度",{"2":{"718":1}}],["包括元素的高度",{"2":{"718":1}}],["包括位置信息",{"2":{"666":1}}],["包括使用所有",{"2":{"575":1}}],["包括渲染",{"2":{"349":1}}],["包括鼠标",{"2":{"234":1}}],["包括技术储备",{"2":{"128":1}}],["包括页面加载耗时",{"2":{"41":1}}],["包括常见的",{"2":{"41":1}}],["激活",{"2":{"224":1}}],["捕获所有",{"2":{"810":2}}],["捕获外部",{"2":{"669":1}}],["捕获内部",{"2":{"669":1}}],["捕获错误",{"2":{"669":1}}],["捕获",{"2":{"221":1}}],["说明浮点数相加之后的偏差原因",{"2":{"295":1}}],["说明",{"0":{"578":1,"581":1},"2":{"221":1,"222":1,"548":2,"650":1}}],["始终等于",{"2":{"221":1}}],["始终为false",{"2":{"112":2}}],["倒序执行",{"2":{"219":1}}],["支持扩展",{"2":{"489":1}}],["支持双向通信",{"2":{"489":1}}],["支持热键",{"2":{"227":1}}],["支持捕获",{"2":{"225":2}}],["支持",{"2":{"212":1}}],["567",{"2":{"835":2}}],["511",{"0":{"544":1}}],["504",{"0":{"543":1}}],["503",{"0":{"542":1}}],["502",{"0":{"541":1}}],["501",{"0":{"540":1}}],["500",{"0":{"539":1}}],["5xx",{"0":{"538":1},"1":{"539":1,"540":1,"541":1,"542":1,"543":1,"544":1}}],["52+",{"2":{"656":1}}],["5234",{"2":{"428":2}}],["52位尾数",{"2":{"295":1}}],["52",{"2":{"283":1,"284":1,"298":1}}],["53",{"2":{"275":1,"280":1,"283":1,"284":1}}],["5个状态",{"2":{"230":1}}],["5表单中选择某一项输入",{"2":{"227":1}}],["5表示手柄",{"2":{"227":1}}],["5+和",{"2":{"225":2}}],["5+",{"2":{"225":2}}],["5",{"2":{"210":2,"211":2,"225":2,"226":1,"237":2,"283":1,"311":2,"312":1,"344":2,"429":1,"666":1,"668":6,"717":1,"761":1,"762":1,"806":2,"860":2}}],["5s",{"2":{"168":2,"379":1}}],["qdisc",{"2":{"433":3}}],["q",{"0":{"693":1},"2":{"210":18,"265":6,"294":1,"693":4}}],["queryselectorall",{"2":{"717":1}}],["queryselector",{"2":{"717":1}}],["querycommandstate",{"2":{"113":1}}],["querycommandenabled",{"2":{"113":1}}],["queueing",{"2":{"433":1}}],["quads",{"2":{"366":1,"368":1}}],["quit",{"2":{"256":2,"259":2}}],["quiet",{"2":{"253":2}}],["quote",{"2":{"640":4}}],["quotes",{"2":{"245":2}}],["quot",{"0":{"673":2},"1":{"674":2,"675":2,"676":2,"677":2,"678":2,"679":2,"680":2,"681":2,"682":2,"683":2,"684":2},"2":{"104":8,"114":2,"131":20,"134":4,"146":20,"147":40,"156":8,"168":4,"188":32,"195":8,"216":4,"217":4,"218":4,"219":4,"239":44,"241":20,"242":24,"244":8,"245":20,"247":14,"249":12,"326":14,"328":4,"339":4,"402":18,"424":4,"591":8,"592":16,"593":16,"594":36,"595":12,"608":2,"646":64,"666":20,"667":4,"675":4,"677":12,"678":16,"679":20,"680":12,"681":32,"682":24,"683":40,"684":8,"689":4,"694":4,"701":2,"713":12,"715":4,"717":16,"718":10,"751":8,"815":1,"843":4,"848":6,"849":12,"850":48,"852":4,"854":20,"857":16,"870":4,"871":4,"876":12}}],["亮度",{"2":{"210":1}}],["饱和度",{"2":{"210":1}}],["色调",{"2":{"210":1}}],["$100",{"2":{"666":2}}],["$uri",{"2":{"269":4}}],["$",{"2":{"208":6,"209":6,"402":1,"666":12,"815":1}}],["44",{"2":{"666":4}}],["4px",{"2":{"647":2}}],["415",{"0":{"537":1}}],["40+",{"2":{"656":1}}],["40px",{"2":{"618":2}}],["408",{"0":{"536":1}}],["407",{"0":{"535":1}}],["406",{"0":{"534":1}}],["405",{"0":{"533":1}}],["404",{"0":{"532":1}}],["403",{"0":{"531":1}}],["402",{"0":{"530":1}}],["401",{"0":{"529":1}}],["400",{"0":{"528":1}}],["4xx",{"0":{"527":1},"1":{"528":1,"529":1,"530":1,"531":1,"532":1,"533":1,"534":1,"535":1,"536":1,"537":1}}],["47da",{"2":{"494":1}}],["49",{"2":{"428":4}}],["43200",{"2":{"424":2}}],["4kb",{"2":{"393":1}}],["4️⃣",{"2":{"345":1}}],["4使用ime输入",{"2":{"227":1}}],["4表示移动设备键盘",{"2":{"227":1}}],["4",{"2":{"208":8,"211":2,"226":1,"237":1,"274":1,"282":1,"287":2,"288":3,"289":1,"296":2,"297":2,"344":2,"594":2,"666":3,"668":8,"761":1,"762":1,"859":4,"860":2}}],["4位",{"2":{"208":4}}],["60",{"2":{"674":1}}],["60fps",{"2":{"52":1}}],["61",{"2":{"674":1}}],["63",{"2":{"428":4}}],["67",{"2":{"422":2}}],["68",{"2":{"422":2}}],["65534",{"2":{"429":1,"440":1}}],["65",{"2":{"290":1}}],["64",{"2":{"275":1,"280":1,"283":4,"284":1,"428":12}}],["6手写输入",{"2":{"227":1}}],["6",{"0":{"295":1,"296":1},"1":{"296":1,"297":1,"298":1,"299":1},"2":{"208":4,"210":6,"211":4,"226":1,"237":1,"288":2,"296":4,"297":4,"298":1,"312":1,"344":2,"428":2,"432":1,"446":1,"666":1,"668":6,"762":1}}],["6位",{"2":{"208":4}}],["颜色输出不一样的信息",{"2":{"858":1}}],["颜色和其他选项",{"2":{"813":1}}],["颜色值变换",{"0":{"207":1},"1":{"208":1,"209":1,"210":1,"211":1}}],["颜色字符串",{"2":{"113":2}}],["二层",{"2":{"433":1}}],["二级域名",{"2":{"397":1}}],["二级标题名称",{"2":{"337":2}}],["二级标题",{"2":{"337":2,"688":1}}],["二进制正数转换负数",{"2":{"294":1}}],["二进制十进制",{"2":{"294":1}}],["二进制",{"2":{"289":1,"290":1}}],["二进制转换",{"0":{"286":1},"1":{"287":1,"288":1}}],["二进制格式至少占用",{"2":{"276":1}}],["二进制数据",{"2":{"206":1}}],["二叉树",{"2":{"20":1}}],["读取访问",{"2":{"403":1}}],["读取",{"0":{"394":1}}],["读取了",{"2":{"330":1}}],["读取的流",{"2":{"206":1}}],["读取失败",{"2":{"202":2,"203":2}}],["读取成功",{"2":{"202":2,"203":2}}],["读写分离",{"2":{"51":1,"65":1}}],["非相对路径会根据",{"2":{"846":1}}],["非相对路径",{"0":{"846":1},"2":{"848":1,"849":1}}],["非确定性",{"2":{"827":1}}],["非阻塞",{"0":{"819":1}}],["非军事区",{"2":{"808":1}}],["非严格模式",{"2":{"801":2}}],["非浮动元素与非浮动元素之间正常定位",{"2":{"600":1}}],["非浮动元素设置",{"2":{"600":1}}],["非对称",{"2":{"556":1}}],["非对称加密套件列表以及",{"2":{"559":1,"563":1}}],["非对称加密算法效率太慢",{"2":{"558":1}}],["非对称加密",{"0":{"556":1,"559":1},"1":{"557":1,"558":1,"560":1,"561":1}}],["非安全模式下不支持",{"2":{"200":2}}],["非活动对象",{"2":{"181":1}}],["此后再调用",{"2":{"669":1}}],["此方式为了规范不推荐",{"2":{"648":1}}],["此代码在全局无法运行",{"2":{"200":2}}],["此时运行代码会发现还是没有过渡效果",{"2":{"168":2}}],["内存管理",{"0":{"792":1},"1":{"793":1,"794":1,"795":1}}],["内存空间",{"0":{"788":1},"1":{"789":1,"790":1,"791":1}}],["内存整理",{"2":{"181":1,"182":1}}],["内部函数可以访问外部函数声明中的变量",{"2":{"772":1}}],["内部",{"2":{"669":1,"806":2}}],["内部表示",{"0":{"283":1}}],["内联样式",{"2":{"718":2}}],["内联元素",{"2":{"627":1}}],["内联格式上下文存在于其他格式上下文中",{"2":{"577":1}}],["内容格式",{"2":{"701":1}}],["内容不存在遮盖",{"2":{"599":1}}],["内容流",{"2":{"586":1}}],["内容边界",{"2":{"585":1}}],["内边距边界",{"2":{"585":1}}],["内边距",{"2":{"583":3,"586":1}}],["内置",{"2":{"567":1}}],["内核如果需要通过某个网络接口发送数据包",{"2":{"433":1}}],["内核",{"2":{"425":1}}],["内核启动",{"2":{"423":1}}],["内单个站点",{"2":{"350":1}}],["内触发",{"2":{"198":1}}],["态的",{"2":{"198":1}}],["相反",{"2":{"838":1}}],["相当于增加新的属性类型定义",{"2":{"837":1}}],["相等",{"0":{"720":1}}],["相等性",{"0":{"719":1},"1":{"720":1,"721":1,"722":1,"723":1},"2":{"719":1}}],["相邻的两个元素之间的外边距重叠",{"2":{"583":1}}],["相对",{"2":{"857":2}}],["相对于",{"2":{"857":2}}],["相对于文字的",{"2":{"630":2}}],["相对路径",{"0":{"846":1},"2":{"848":1,"849":1}}],["相对上一个非浮动元素的位置",{"2":{"600":1}}],["相对地址",{"2":{"268":2}}],["相对屏幕",{"2":{"226":1}}],["相关的回调",{"2":{"819":1,"824":1}}],["相关的读取权限操作可以查看",{"2":{"198":1}}],["相关的",{"2":{"198":1}}],["相关的操作",{"2":{"196":1}}],["相关操作",{"2":{"197":1}}],["相关",{"2":{"196":1}}],["相同则返回",{"2":{"480":1}}],["相同",{"2":{"321":1}}],["相同实例还可以重新唤起",{"2":{"159":1,"754":1}}],["相同的元素",{"2":{"12":1}}],["还需要有定位功能",{"2":{"432":1}}],["还没完全加载",{"2":{"230":1}}],["还可以采用",{"2":{"195":2}}],["还请多多指点",{"2":{"192":1}}],["还有一个作用就是解释执行字节码",{"2":{"174":1}}],["初始位置",{"2":{"191":2}}],["初始的高度",{"2":{"188":2}}],["项",{"2":{"190":2}}],["项目文件目录依赖关系",{"2":{"857":2}}],["项目",{"2":{"857":2}}],["项目启动",{"0":{"109":1}}],["项目入口",{"2":{"106":1}}],["项目目录",{"2":{"102":2,"104":2}}],["项目利用",{"2":{"101":1}}],["项目地址",{"2":{"99":1}}],["项目前期准备与复盘",{"0":{"67":1}}],["项目管理",{"2":{"65":1}}],["项目代码量过大",{"0":{"65":1}}],["项目复杂熟悉成本过高",{"0":{"64":1}}],["项目质量",{"2":{"61":1}}],["项目规模调整后",{"2":{"63":1}}],["项目规模",{"2":{"59":1}}],["项目设计",{"0":{"57":1},"1":{"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1}}],["保护属性",{"2":{"864":1}}],["保证",{"2":{"857":2}}],["保证文件的相对应用不报错",{"2":{"857":2}}],["保证相对引用正确",{"2":{"850":1}}],["保证用户代码的其余部分之后在让事件循环继续进行之前",{"2":{"828":1}}],["保证计算的开始位置",{"2":{"191":1}}],["保证计算的开始位置和结束位置都在可视区域",{"2":{"190":1}}],["保存页面的状态",{"2":{"231":1}}],["保存代码",{"2":{"100":1}}],["等价于",{"2":{"718":6}}],["等信息",{"2":{"683":2}}],["等网络的互连",{"2":{"466":1}}],["等式要必须成立",{"2":{"188":2}}],["等等",{"2":{"168":1}}],["取决于函数在哪调用",{"2":{"799":1}}],["取得自定义属性的值",{"2":{"717":2}}],["取其中一个",{"2":{"582":1}}],["取出",{"2":{"480":1}}],["取反",{"2":{"294":1}}],["取消事件冒泡",{"2":{"222":1}}],["取消事件的冒泡行为",{"2":{"221":1}}],["取消事件的进一步冒泡或捕获",{"2":{"221":1}}],["取消事件的默认行为",{"2":{"221":1,"222":1}}],["取消执行",{"2":{"95":1}}],["取值0开始",{"2":{"859":2}}],["取值",{"0":{"630":1,"640":1},"2":{"198":1,"268":1,"815":2}}],["取整为",{"2":{"282":1}}],["取整",{"2":{"188":2}}],["按下非字符键触发顺序",{"2":{"227":1}}],["按下字符键触发顺序",{"2":{"227":1}}],["按住不放时",{"2":{"227":2}}],["按先后顺序执行",{"2":{"218":1}}],["按顺序",{"2":{"188":2}}],["按需加载",{"2":{"51":1}}],["页一个渲染进程",{"2":{"729":1}}],["页",{"2":{"726":1}}],["页边距仅在同一格式上下文中的元素之间折叠",{"2":{"575":1}}],["页数对应替换节点高度的基准",{"2":{"188":2}}],["页的大小10",{"2":{"188":2}}],["页面需要重绘和回流时",{"2":{"730":1}}],["页面需要渲染上千个上万个节点甚至更多",{"2":{"186":1}}],["页面描述",{"2":{"701":1}}],["页面作者",{"2":{"701":1}}],["页面应用名",{"2":{"701":1}}],["页面卸载前阻止这一操作",{"2":{"230":1}}],["页面完全卸载或者嵌入的内容完全卸载",{"2":{"224":1}}],["页面完全加载",{"2":{"224":1}}],["页面会出现卡顿现象",{"2":{"185":1}}],["页面目录",{"2":{"108":1}}],["页面可交互时间",{"2":{"56":1}}],["页面解析完成的时间",{"2":{"56":1}}],["页面性能优化",{"2":{"42":1}}],["页面性能",{"2":{"42":1}}],["页面稳定性",{"2":{"42":2}}],["页面访问速度",{"2":{"42":1}}],["页面的",{"2":{"268":1}}],["页面的性能情况",{"2":{"41":1}}],["页面的整体访问情况",{"2":{"41":1}}],["页面检测",{"2":{"23":1}}],["才开始替换操作",{"2":{"188":2}}],["滚动大小",{"2":{"718":1}}],["滚动",{"2":{"350":1}}],["滚动元素触发",{"2":{"224":1}}],["滚动预留",{"2":{"188":2}}],["滚动高度",{"2":{"188":2,"190":2,"191":2}}],["滚动到底部加载",{"2":{"187":1}}],["演示代码",{"2":{"188":1,"189":1}}],["演示地址",{"2":{"188":1,"189":1}}],["条件加载模块",{"2":{"842":1}}],["条件类型",{"2":{"837":1}}],["条目报告给父框架来进行聚合",{"2":{"380":1}}],["条目",{"2":{"380":3}}],["条",{"2":{"188":1}}],["固定渲染每页大小",{"2":{"188":1}}],["或一个八进制转义符",{"2":{"833":1}}],["或一个向后引用",{"2":{"833":1}}],["或",{"2":{"521":1,"522":1,"575":1,"718":1,"737":3,"738":1,"769":1}}],["或二者都可",{"2":{"453":1}}],["或者根据定义的",{"2":{"846":1}}],["或者在事件循环继续之前重试请求",{"2":{"830":1}}],["或者在package",{"2":{"236":1}}],["或者达到了与系统相关的硬性限制",{"2":{"819":1,"824":1}}],["或者一个空字符串",{"2":{"718":1}}],["或者是命名过或数值索引的",{"2":{"419":1}}],["或者如果",{"2":{"326":1}}],["或者覆盖建议的规则",{"2":{"251":1}}],["或者enter",{"2":{"226":1}}],["或者",{"0":{"188":1},"2":{"735":1,"853":1,"857":2,"872":1}}],["或分配",{"2":{"64":1}}],["照样会造成页面节点太多卡顿的问题",{"2":{"187":1}}],["穿插在",{"2":{"185":1}}],["小端字节序",{"2":{"671":1}}],["小数",{"0":{"288":1}}],["小数位数",{"2":{"283":1}}],["小任务执行时间很短",{"2":{"185":1}}],["小顶堆",{"2":{"12":1}}],["能一次性使用可选参数",{"2":{"872":1}}],["能不使用",{"2":{"872":1}}],["能执行",{"2":{"682":2}}],["能够在多个不同网络间实现信息传输的协议簇",{"2":{"478":1}}],["能完成封装转发数据帧功能的网络设备",{"2":{"464":1}}],["能访问到的元素为活动对象",{"2":{"183":1}}],["能跑一次绝不多跑",{"2":{"147":1}}],["主页",{"2":{"832":1}}],["主模块中运行",{"2":{"827":1}}],["主进程",{"0":{"728":1}}],["主题相关",{"2":{"695":1}}],["主布局中创造了一个小布局",{"2":{"575":1}}],["主机是否可达",{"2":{"480":1}}],["主机与路由器之间进行控制信息传递",{"2":{"480":1}}],["主机收到数据包",{"2":{"480":1}}],["主机读取",{"2":{"479":1}}],["主机适配器",{"2":{"477":1}}],["主机号",{"2":{"429":1}}],["主线程",{"0":{"351":1},"2":{"350":1,"356":1,"357":1,"358":1,"359":1,"360":1,"368":1}}],["主中次",{"2":{"226":1}}],["主中",{"2":{"226":1}}],["主鼠标按钮",{"2":{"226":1}}],["主要负责老生代区间的垃圾回收",{"2":{"183":1}}],["主要负责新生代区间的垃圾回收",{"2":{"182":1}}],["主垃圾回收器",{"0":{"183":1}}],["副垃圾回收器会对没有进行标记的对象进行复制",{"2":{"182":1}}],["副垃圾回收器",{"0":{"182":1}}],["整页向下滚动",{"2":{"815":1}}],["整页向上滚动",{"2":{"815":1}}],["整数除余法",{"2":{"287":1}}],["整数",{"0":{"287":1}}],["整数值的精度限制",{"0":{"282":1}}],["整数以小字节序表示",{"2":{"281":1}}],["整个文件",{"2":{"246":2}}],["整理",{"2":{"183":1}}],["整理内存碎片",{"2":{"181":1}}],["整体的功能点覆盖曲线是否正常",{"2":{"47":1}}],["整体访问",{"2":{"42":2}}],["统一清理内存中所有被标记为可回收的对象",{"2":{"181":1}}],["正确",{"2":{"737":2}}],["正确答案",{"2":{"294":2}}],["正斜杠",{"2":{"706":1}}],["正文里面有",{"2":{"433":1}}],["正则的扩展",{"0":{"665":1},"1":{"666":1}}],["正则表达式",{"0":{"833":1},"2":{"309":1}}],["正则匹配",{"2":{"252":1,"857":2}}],["正数的二进制取反+1",{"2":{"294":1}}],["正数的反码是其本身",{"2":{"293":1}}],["正数",{"2":{"268":1}}],["正值表示顺时针旋转",{"2":{"234":1}}],["正常流",{"2":{"579":1}}],["正常情况",{"2":{"402":1}}],["正常",{"2":{"208":2}}],["正常防抖",{"0":{"75":1},"1":{"76":1,"77":1}}],["正在使用中的对象",{"2":{"181":1}}],["活动对象",{"2":{"181":1}}],["标识符",{"2":{"770":1,"837":1}}],["标准",{"2":{"716":1}}],["标准的鼠标事件",{"2":{"234":1}}],["标题类",{"0":{"337":1}}],["标志",{"2":{"283":1}}],["标志符",{"2":{"270":1}}],["标记清除算法会产生大量的不连续内存碎片",{"2":{"183":1}}],["标记",{"2":{"183":2}}],["标记完毕",{"2":{"182":1}}],["标记空间中的活动对象和非活动对象",{"2":{"181":1}}],["标签设置成",{"2":{"643":1}}],["标签元素设置高度或者单行",{"2":{"650":1}}],["标签元素",{"2":{"643":1}}],["标签类",{"0":{"338":1}}],["标签｜资源文件｜favicon",{"2":{"139":2}}],["标签插入位置",{"2":{"134":2}}],["标签",{"0":{"310":1,"700":1},"1":{"311":1,"312":1,"313":1,"701":1},"2":{"113":2,"139":2,"618":2}}],["栈溢出",{"0":{"787":1}}],["栈",{"0":{"785":1}}],["栈结构",{"0":{"782":1},"1":{"783":1,"784":1,"785":1,"786":1,"787":1}}],["栈中执行上下文",{"2":{"794":1}}],["栈中没有从事件队列中获取",{"2":{"733":1}}],["栈中存储的是引用地址",{"2":{"177":1}}],["栈空间",{"0":{"176":1,"790":1},"2":{"788":1}}],["采用混合加密方式进行数据的加密",{"2":{"559":1}}],["采用新的",{"2":{"494":1}}],["采用心跳实现",{"2":{"491":1}}],["采用的是二分查找的方式来确定偏移量最接近滚动偏移位置",{"2":{"191":1}}],["采用调用栈的形式记录数据",{"2":{"176":1}}],["采用异步加载的方式加载其他资源",{"2":{"51":1}}],["原型式继承",{"2":{"762":1}}],["原型链",{"2":{"762":1}}],["原型模式",{"2":{"761":1}}],["原型",{"0":{"760":1},"1":{"761":1,"762":1,"763":1,"764":1},"2":{"804":1}}],["原子行内级盒子",{"2":{"587":1}}],["原理",{"0":{"424":1}}],["原始文件",{"2":{"317":1,"321":1}}],["原始数据类型存放与栈空间中",{"2":{"176":1}}],["原码",{"0":{"292":1}}],["原文阅读",{"2":{"110":1}}],["垃圾回收流程",{"0":{"181":1}}],["垃圾回收",{"0":{"175":1},"1":{"176":1,"177":1,"178":1,"179":1,"180":1,"181":1,"182":1,"183":1,"184":1,"185":1}}],["收藏",{"2":{"728":1}}],["收费",{"2":{"564":1}}],["收发数据包",{"2":{"466":1}}],["收集代码信息",{"2":{"174":1}}],["收到信号",{"2":{"106":1}}],["那么这两个页面会共用一个",{"2":{"354":1}}],["那么编译器就会抛出异常",{"2":{"170":1}}],["那如何在中间这段时间加上动画呢",{"2":{"168":1}}],["但其实是",{"2":{"802":2}}],["但允许用户的后续请求",{"2":{"532":1}}],["但无响应可用",{"2":{"504":1}}],["但要想正确测量",{"2":{"380":1}}],["但在事件循环继续之前运行的必要",{"2":{"830":1}}],["但在这些情况下应该测量",{"2":{"380":1}}],["但在计算",{"2":{"380":2}}],["但注意站点内部的跨站",{"2":{"354":1}}],["但指向硬盘驱动器上完全相同的位置",{"2":{"321":1}}],["但会导致软链接无法操作",{"2":{"320":1}}],["但仍会生成新的历史记录",{"2":{"271":1}}],["但只有编辑区域才能触发textinput事件",{"2":{"227":1}}],["但如果编译过程发生了语法或者其他的错误",{"2":{"170":1}}],["但是操作系统调度或其它正在运行的回调可能会存在延迟",{"2":{"821":1}}],["但是内部函数引用外部函数的变量依然保存在内存中",{"2":{"772":1}}],["但是是经过公钥加密过的",{"2":{"561":1}}],["但是拒绝执行",{"2":{"531":1}}],["但是没有响应头",{"2":{"452":1}}],["但是有些浏览器还是可以继续支持",{"2":{"194":1}}],["但是与特定类型的机器码无关",{"2":{"173":1}}],["但是",{"2":{"168":1}}],["但是代码放在settimeout中",{"2":{"157":2,"752":2}}],["但是前端文档非常值得思考",{"2":{"128":1}}],["然后立即执行",{"2":{"819":1,"824":1}}],["然后",{"2":{"733":1}}],["然后附加",{"2":{"494":1}}],["然后以广播的形式通过物理介质发送给接收方",{"2":{"479":1}}],["然后逐级向下传播的到最具体元素接收事件",{"2":{"214":1}}],["然后直接清理掉端边界以外的内存",{"2":{"183":1}}],["然后是优化代码",{"2":{"170":1}}],["然后被记录到一个记录队列中",{"2":{"161":1,"756":1}}],["语言",{"2":{"765":1}}],["语法",{"2":{"844":1}}],["语法上不能再分的",{"2":{"172":1}}],["语法分析",{"2":{"170":2,"172":1,"766":1}}],["语雀自研之路",{"2":{"123":1}}],["语雀",{"0":{"123":1}}],["🌹",{"2":{"345":1}}],["🏈",{"2":{"345":1}}],["🍎",{"2":{"345":1}}],["🎉",{"2":{"345":1}}],["🆚",{"2":{"168":1,"345":1,"669":1}}],["🏀",{"2":{"168":1,"345":1}}],["🏀加入",{"2":{"168":1}}],["🍵",{"2":{"132":3}}],["引述作品名",{"2":{"693":3}}],["引用一个词法作用域内部的东西",{"2":{"797":2}}],["引用会导致",{"2":{"770":1}}],["引用值",{"2":{"769":1}}],["引用上面的object方法",{"2":{"762":2}}],["引用类型存放与堆空间中",{"2":{"791":1}}],["引用类型",{"2":{"788":1,"795":1,"859":1}}],["引用类型共享值问题",{"2":{"762":1}}],["引用类型使用堆空间存储",{"2":{"177":1}}],["引用对象",{"2":{"761":1}}],["引用",{"2":{"693":1,"762":1}}],["引擎会将函数的上下文出栈",{"2":{"786":1}}],["引擎会将执行上下文压入栈中",{"2":{"786":1}}],["引擎计时的",{"2":{"730":1}}],["引擎所在的执行队列中",{"2":{"730":1}}],["引擎线程空闲",{"2":{"733":1}}],["引擎线程上执行",{"2":{"733":1}}],["引擎线程互斥",{"0":{"732":1}}],["引擎线程",{"2":{"730":2}}],["引擎互斥",{"2":{"730":1}}],["引擎",{"2":{"347":1}}],["引发回流的方法有",{"2":{"168":1}}],["引入全局依赖",{"2":{"871":1}}],["引入系统声明文件",{"2":{"854":1}}],["引入声明的文件",{"2":{"854":1}}],["引入一个文件夹匹配的所有文件",{"2":{"309":1}}],["引入最好使用绝对地址",{"2":{"144":2}}],["引入其他第三方插件",{"2":{"139":1}}],["引入",{"2":{"132":2,"139":1,"305":2,"306":2,"480":1,"843":1,"854":1}}],["难道就没有办法了吗",{"2":{"168":2}}],["上触发",{"2":{"829":1}}],["上边框高度和下边框高度",{"2":{"718":1}}],["上被找到",{"2":{"521":1}}],["上",{"2":{"257":1}}],["上述是不是没有看到过渡效果呢",{"2":{"168":2}}],["上线",{"2":{"61":1}}],["片段三",{"2":{"168":2}}],["片段2",{"2":{"168":2}}],["片段一",{"2":{"168":2}}],["想实现点动画过渡效果",{"2":{"168":1}}],["切换",{"2":{"168":1}}],["我会飘在哪里",{"2":{"599":2}}],["我分配了这个",{"2":{"422":1}}],["我还没有",{"2":{"422":1}}],["我的",{"2":{"422":1}}],["我是浮动元素",{"2":{"599":2}}],["我是危险",{"2":{"343":2}}],["我是警告",{"2":{"343":2}}],["我是轻提示",{"2":{"343":2}}],["我是一名前端开发者",{"2":{"324":1}}],["我们并没有触发",{"2":{"168":2}}],["我们思考一下",{"2":{"168":2}}],["我们介入三种状态",{"2":{"168":2}}],["我们重新写一下",{"2":{"168":2}}],["我们一般控制显示隐藏的操作",{"2":{"168":2}}],["我们是否用过",{"2":{"168":1}}],["我作为一个普通开发者来说",{"2":{"128":1}}],["抛出问题",{"2":{"168":1}}],["抛出想法",{"2":{"100":1}}],["^",{"2":{"167":1,"289":1,"290":1,"666":8,"814":1,"815":1,"852":2,"865":2}}],["先执行",{"2":{"669":1}}],["先回顾一下",{"2":{"167":1}}],["先来了解一下重绘与回流",{"2":{"165":1}}],["外层函数或全局作用域",{"2":{"811":1}}],["外边距",{"2":{"586":1}}],["外边距边界",{"2":{"585":1}}],["外边距为负值",{"2":{"583":1}}],["外边距重叠",{"0":{"582":1},"1":{"583":1}}],["外边距重叠问题",{"2":{"576":1}}],["外观发生变化",{"2":{"166":1}}],["外部",{"2":{"669":1}}],["外部内部都存在",{"2":{"669":1}}],["外部服务调用",{"2":{"42":1}}],["外部调用服务情况",{"2":{"42":1}}],["重置",{"2":{"815":1}}],["重写需要小心",{"2":{"762":1}}],["重写需要小心function",{"2":{"762":1}}],["重写",{"2":{"761":1}}],["重定向目标在本次响应的",{"2":{"517":1}}],["重定向类型",{"2":{"517":1}}],["重复引用一个对象的多个属性的快捷方式",{"2":{"776":1}}],["重复",{"2":{"525":1,"526":1}}],["重复触发",{"2":{"227":2}}],["重复执行多次",{"2":{"174":1}}],["重绘",{"2":{"166":1}}],["重绘不一定回流",{"2":{"166":1}}],["重新发送数据包",{"2":{"481":1}}],["重新加载方式",{"2":{"271":1}}],["重新加载页面",{"2":{"271":1}}],["重新设置提交记录",{"2":{"266":1}}],["重新设置当前",{"2":{"264":1}}],["重新恢复某个已经存在的提交",{"2":{"260":1}}],["重新",{"2":{"255":1}}],["重新计算元素的位置和几何形状",{"2":{"166":1}}],["重新使用",{"0":{"159":1,"754":1}}],["重新向下建堆",{"2":{"12":1}}],["重新建堆",{"2":{"12":1}}],["回显服务器收到的请求",{"2":{"457":1}}],["回环地址除外",{"2":{"196":1}}],["回收非活动对象占用的空间",{"2":{"181":1}}],["回流",{"2":{"166":1}}],["回流必将引起重绘",{"2":{"166":1}}],["回流与重绘",{"0":{"166":1}}],["回调置于",{"2":{"828":1}}],["回调函数在这里执行",{"2":{"825":1}}],["回调函数负责完整地处理数组中的每个实例",{"2":{"162":1,"757":1}}],["回调",{"2":{"819":1,"822":1}}],["回调参数属性分析",{"0":{"156":1,"751":1}}],["动态的读写",{"2":{"795":1}}],["动态生成的函数代码",{"2":{"775":1}}],["动态",{"2":{"765":1}}],["动态原型模式",{"2":{"761":1}}],["动态主机配置协议",{"0":{"422":1},"2":{"420":1}}],["动画",{"0":{"167":1,"168":1},"2":{"349":1,"350":1}}],["动画那些事",{"0":{"165":1},"1":{"166":1,"167":1,"168":1}}],["动手实现一个",{"0":{"142":1},"1":{"143":1,"144":1,"145":1,"146":1,"147":1}}],["调度的之外",{"2":{"824":1}}],["调度的脚本",{"2":{"819":1}}],["调度的最小单位",{"2":{"725":1}}],["调度",{"2":{"819":2,"824":2}}],["调度之外",{"2":{"819":1}}],["调用的普通函数",{"2":{"804":1}}],["调用位置如何决定",{"2":{"800":1}}],["调用位置",{"0":{"799":1}}],["调用栈调用结束自然销毁",{"2":{"794":1}}],["调用栈是有大小的",{"2":{"787":1}}],["调用栈",{"0":{"783":1,"794":1},"2":{"790":1}}],["调用了两次",{"2":{"762":1}}],["调用函数不存在时返回",{"2":{"738":1}}],["调用父类的方法是",{"2":{"864":1}}],["调用父类的方法时",{"2":{"670":2}}],["调用父类的静态属性和方法",{"2":{"670":1}}],["调用另一个generate函数",{"2":{"669":1}}],["调用",{"2":{"368":1}}],["调用事件处理程序的阶段",{"2":{"221":1}}],["调用takerecords",{"2":{"163":1,"758":1}}],["调整",{"2":{"59":1}}],["因特网控制报文协议",{"2":{"480":1}}],["因素",{"2":{"381":1}}],["因此无法生成相应实体",{"2":{"534":1}}],["因此最好包含一个延迟脚本",{"2":{"311":1}}],["因此经过两次垃圾回收的活动对象依然存在",{"2":{"182":1}}],["因此记录队列被清空",{"2":{"162":1,"757":1}}],["因为这对用户来说是多次不同的页面访问体验",{"2":{"380":1}}],["因为高度未固定",{"2":{"191":2}}],["因为它们不会在函数之后持久存在退出",{"2":{"162":1,"757":1}}],["因为选区中",{"2":{"114":1}}],["会两次渲染",{"2":{"877":2}}],["会产生一些副作用",{"2":{"808":1}}],["会在函数执行的过程中调用",{"2":{"796":1}}],["会在左侧操作数为假值时返回右侧操作数",{"2":{"736":1}}],["会创建一个活动记录",{"2":{"796":1}}],["会创建新的历史状态",{"2":{"268":1}}],["会干扰作用域",{"2":{"774":1}}],["会导致标识符的位置是无效的",{"2":{"777":1}}],["会导致不同的作用域链和标识符解析",{"2":{"761":1}}],["会导致对不齐",{"2":{"650":1}}],["会改变引号层级",{"2":{"640":1}}],["会发生重叠",{"2":{"583":1}}],["会发现",{"2":{"326":2}}],["会与父元素重叠",{"2":{"583":2}}],["会沿着",{"2":{"566":1}}],["会形成帧",{"2":{"476":1}}],["会话层",{"0":{"473":1}}],["会继续分发",{"2":{"380":1}}],["会为在后台选项卡中加载的页面分发",{"2":{"380":1}}],["会被放入到老生代区间中",{"2":{"182":1}}],["会执行一次垃圾回收操作",{"2":{"182":1}}],["会终止抛出错误",{"2":{"172":1}}],["会向被调用的回调传递一个数组",{"2":{"162":1,"757":1}}],["会打造出越来越完美的前端文档",{"2":{"129":1}}],["观察者回调",{"2":{"162":1,"757":1}}],["它们会随时更新",{"2":{"716":1}}],["它只对",{"2":{"703":1}}],["它都需要按照为这个接口配置的",{"2":{"433":1}}],["它表示每个dom突变的有序记录",{"2":{"161":1,"756":1}}],["它的细腻程度非常之细",{"2":{"128":1}}],["其大小为单个边距的最大值",{"2":{"582":1}}],["其主机号为11",{"2":{"548":2}}],["其余情况",{"2":{"824":1}}],["其余各个位取反",{"2":{"293":1}}],["其余位表示值",{"2":{"292":1}}],["其有效数字为",{"2":{"274":1,"275":1}}],["其他方法不可缓存",{"2":{"461":1}}],["其他请求方法相对安全",{"2":{"461":1}}],["其他请求方法都可以有响应体",{"2":{"461":1}}],["其他请求方法可选",{"2":{"461":1}}],["其他窗口的一个引用",{"2":{"419":1}}],["其他组件",{"2":{"347":2}}],["其他",{"0":{"699":1},"2":{"236":1,"347":1,"586":1}}],["其他开发可通过开启断点方式来直接定位问题",{"2":{"66":1}}],["其实会发现问题",{"2":{"168":1}}],["其实上述代码的关键在于切换不同的状态类名",{"2":{"168":1}}],["其内容被丢弃",{"2":{"162":1,"757":1}}],["其设计的核心是异步回调和记录队列模型",{"2":{"161":1,"756":1}}],["节省",{"2":{"549":1}}],["节点",{"2":{"160":1,"755":1}}],["节点的属性改变时",{"2":{"160":1,"755":1}}],["节流最终执行",{"0":{"91":1},"1":{"92":1,"93":1}}],["节流定时器版",{"0":{"88":1},"1":{"89":1,"90":1}}],["节流非定时器版",{"0":{"85":1},"1":{"86":1,"87":1}}],["节流",{"0":{"84":1},"1":{"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1,"92":1,"93":1}}],["目前记住规则",{"2":{"719":1}}],["目前有",{"2":{"568":1}}],["目前在杭州就业",{"2":{"324":1}}],["目录的测试文件",{"2":{"857":2}}],["目录下的文件先编译再进行编译测试",{"2":{"857":2}}],["目录下",{"2":{"857":2}}],["目录下面的文件输出到",{"2":{"857":2}}],["目录中的",{"2":{"857":2}}],["目录类",{"0":{"340":1}}],["目录搭建",{"0":{"108":1}}],["目标端口",{"2":{"422":2}}],["目标展望",{"2":{"324":1}}],["目标",{"2":{"221":1}}],["目标元素",{"2":{"188":2}}],["目标元素以及整个结点子树都将被监听改变",{"2":{"160":1,"755":1}}],["只读属性",{"2":{"838":1,"860":1}}],["只取决函数的调用方式",{"2":{"796":1}}],["只能用于子类的构造函数中",{"2":{"864":1}}],["只能用于子类",{"2":{"864":1}}],["只能用字符串作为键值",{"2":{"668":1}}],["只能为",{"2":{"837":1}}],["只能读写自己栈帧的内存",{"2":{"794":1}}],["只执行一次",{"2":{"681":2}}],["只允许一个module",{"2":{"672":2}}],["只接受回调函数作为单参数",{"2":{"669":1}}],["只接受键名为对象",{"2":{"668":1}}],["只适用",{"2":{"650":1}}],["只适用于外部脚本中",{"2":{"310":1}}],["只有一个",{"2":{"730":1}}],["只有可替换的元素才能具有固有尺寸",{"2":{"637":1}}],["只有私钥才能解密",{"2":{"561":1}}],["只有",{"2":{"461":1}}],["只有当页面始终处于前台时才考虑元素",{"2":{"380":1}}],["只有在操作系统中能追溯到数字证书链才能验证证书合法",{"2":{"568":1}}],["只有在事件处理程序执行期间",{"2":{"221":1}}],["只有在没有已经调度的回调微任务时才被调度为微任务",{"2":{"162":1,"757":1}}],["只指向",{"2":{"317":1}}],["只包含事件的目标",{"2":{"221":1}}],["只针对计算代码的书写",{"2":{"190":2,"191":2}}],["只监听目标元素的改变",{"2":{"160":1,"755":1}}],["只关注循环最多的那一段代码",{"2":{"1":1}}],["仍然可以监听改变",{"2":{"157":2,"752":2}}],["立即关闭",{"2":{"157":2,"752":2}}],["立即执行当前微任务队列的所有微任务",{"2":{"733":1}}],["立即执行函数",{"2":{"301":2}}],["立即执行",{"2":{"79":2,"82":2,"85":2,"88":2,"91":2,"95":1}}],["立即执行防抖函数ii",{"0":{"81":1},"1":{"82":1,"83":1},"2":{"80":1}}],["立即执行防抖函数i",{"0":{"78":1},"1":{"79":1,"80":1}}],["第",{"2":{"815":1}}],["第四种",{"2":{"646":2}}],["第三种",{"2":{"646":2}}],["第三方插件进程",{"0":{"729":1}}],["第三方",{"0":{"404":1}}],["第三个字符串",{"2":{"113":1}}],["第二次",{"2":{"877":2}}],["第二次调用supertype",{"2":{"762":2}}],["第二个字节则是",{"2":{"814":1}}],["第二个参数允许使用类似",{"2":{"762":1}}],["第二种",{"2":{"646":2}}],["第二种情况",{"2":{"157":2,"752":2}}],["第二份工作进行中",{"2":{"324":1}}],["第一个参数为一个对象",{"2":{"762":1}}],["第一次调用supertype",{"2":{"762":2}}],["第一次传参数无效",{"2":{"669":1}}],["第一次执行的字节码",{"2":{"174":1}}],["第一种",{"2":{"646":2}}],["第一种情况",{"2":{"157":2,"752":2}}],["第一份工作",{"2":{"324":1}}],["默认命令为包名",{"2":{"832":1}}],["默认绑定指定一个全局对象和",{"2":{"810":1}}],["默认绑定",{"0":{"801":1},"2":{"805":1}}],["默认情况下会将凭据发送到同源url",{"2":{"683":1}}],["默认情况下不将凭据发送到同源url",{"2":{"683":1}}],["默认情况下",{"2":{"683":1}}],["默认行为是否立即执行",{"2":{"712":1}}],["默认行为",{"2":{"661":1}}],["默认格式",{"2":{"339":1}}],["默认导出",{"2":{"305":2,"306":2}}],["默认值生效的条件",{"2":{"664":1}}],["默认值为",{"2":{"268":1}}],["默认值",{"2":{"237":2,"238":1,"402":1,"640":1}}],["默认观察为所有属性",{"2":{"160":1,"755":1}}],["默认为text",{"2":{"684":1}}],["默认为十进制",{"2":{"641":1}}],["默认为当前的",{"2":{"396":1}}],["默认为",{"2":{"160":6,"303":1,"590":1,"755":6}}],["默认",{"2":{"156":4,"751":4,"815":5}}],["默认调用",{"0":{"96":1,"97":1}}],["变通",{"2":{"669":1}}],["变长子网掩码",{"0":{"550":1}}],["变化触发事件",{"2":{"270":1}}],["变化时",{"2":{"151":1,"746":1}}],["变动事件",{"0":{"229":1}}],["变量对象",{"2":{"794":1}}],["变量对象包含执行环境所有变量和函数的对象",{"2":{"770":1}}],["变量分配",{"0":{"792":1},"1":{"793":1,"794":1,"795":1}}],["变量函数的有序访问",{"2":{"770":1}}],["变量和函数的可访问范围",{"2":{"767":1}}],["变量",{"2":{"766":1}}],["变量为",{"2":{"95":1}}],["变量含义",{"2":{"16":1}}],["当提供的值是一个对象时",{"2":{"876":1}}],["当不使用",{"2":{"861":1}}],["当一个函数调用时",{"2":{"796":1}}],["当通过调用一个外部函数返回内部函数后",{"2":{"772":1}}],["当左表达式不为",{"2":{"737":1}}],["当左侧的操作数为",{"2":{"735":1}}],["当js引擎线程执行时",{"2":{"732":1}}],["当请求完成时",{"2":{"730":1}}],["当事件满足触发条件时",{"2":{"730":1}}],["当为对象时",{"2":{"712":1}}],["当为",{"2":{"712":1}}],["当时遵循规范的浏览器",{"2":{"683":1}}],["当隐藏时仍然保有设置的大小的空间",{"2":{"655":1}}],["当服务器无法识别请求的方法",{"2":{"540":1}}],["当响应于",{"2":{"521":1}}],["当表头和表尾被加至数据包时",{"2":{"476":1}}],["当页面通过往返缓存恢复时",{"2":{"380":1}}],["当焦点从页面中的一个元素移动到另一个元素",{"2":{"225":1}}],["当前执行上下文的变量对象",{"2":{"770":1}}],["当前设置的",{"2":{"396":1}}],["当前页面完整",{"2":{"271":1}}],["当前正在处理事件的元素",{"2":{"221":1}}],["当前偏移高度",{"2":{"191":2}}],["当前顶点值",{"2":{"15":1}}],["当我们加入enter",{"2":{"168":2}}],["当你想调用disconnect",{"2":{"163":1,"758":1}}],["当mutationrecord实例出现在记录队列中时",{"2":{"162":1,"757":1}}],["当",{"2":{"151":1,"422":1,"746":1}}],["概念",{"0":{"151":1,"746":1},"2":{"574":1,"577":1,"582":1}}],["比如",{"2":{"149":1,"808":1}}],["比较",{"0":{"723":1,"739":1},"2":{"115":1}}],["你以后得到的",{"2":{"324":1}}],["你所想的永远是太天真",{"2":{"324":1}}],["你可能会想到用",{"2":{"168":1}}],["你不知道的正则表达式",{"0":{"834":1},"1":{"835":1}}],["你不知道的",{"0":{"148":1,"700":1},"1":{"149":1,"701":1}}],["你知道的节流又是怎样呢",{"2":{"84":1}}],["你知道的防抖是怎样呢",{"2":{"74":1}}],["是两种不同的类型",{"2":{"837":1}}],["是对象",{"2":{"802":2}}],["是在调用时绑定的",{"2":{"799":1}}],["是由定时触发线程来计时的",{"2":{"730":1}}],["是能拥有资源和独立运行的最小单位",{"2":{"725":1}}],["是标题组",{"2":{"688":1}}],["是机构",{"2":{"566":1}}],["是无法确定哪个应用程序要接收这个包",{"2":{"481":1}}],["是包含了物理地址和错误侦测及改错的方法",{"2":{"476":1}}],["是读取每一个数据包中的地址然后决定如何传送的专用智能性的网络设备",{"2":{"466":1}}],["是复杂的网络互连设备",{"2":{"465":1}}],["是当前子网的广播地址",{"2":{"446":1}}],["是",{"2":{"422":1,"718":1,"812":1}}],["是这个",{"2":{"422":1}}],["是把顶点数据转换为片元的过程",{"2":{"364":1}}],["是一串指示数据包末端的字符串",{"2":{"476":1}}],["是一个不带任何修饰符的函数调用",{"2":{"802":2}}],["是一个隐式引用",{"2":{"763":1}}],["是一个逻辑操作符",{"2":{"735":1}}],["是一个唯一的表示",{"2":{"432":1}}],["是一个函数",{"2":{"144":2}}],["是一种指向不同文件的特殊文件",{"2":{"316":1}}],["是运行在主线程之上",{"2":{"184":1}}],["是立即消失立即隐藏",{"2":{"168":1}}],["是否保留命令行",{"2":{"858":1}}],["是否存在",{"2":{"848":1}}],["是否优先其他事件执行",{"2":{"712":1}}],["是否执行一次即销毁",{"2":{"712":1}}],["是否设置",{"0":{"600":1}}],["是否设置宽度",{"0":{"599":1}}],["是否响应该请求",{"2":{"408":1}}],["是否允许第三方网站设置",{"2":{"404":1}}],["是否可以取消事件的默认行为",{"2":{"221":1}}],["是否可以访问",{"2":{"196":1}}],["是否在设置的时间未执行时",{"2":{"95":1}}],["是否立即执行",{"2":{"95":1}}],["请求线程",{"2":{"730":1}}],["请求的编码类型",{"2":{"718":1}}],["请求的资源的内容特性无法满足请求头中的条件",{"2":{"534":1}}],["请求中提交的媒体类型不支持",{"2":{"537":1}}],["请求中介建立到请求目标表示的源服务器的",{"2":{"459":1}}],["请求超时",{"2":{"536":1}}],["请求行中指定的请求方法不能被用于请求相应的资源",{"2":{"533":1}}],["请求所希望得到的资源未被在服务器上发现",{"2":{"532":1}}],["请求所希望的响应头或数据体将随此响应返回",{"2":{"507":1}}],["请求失败",{"2":{"532":1}}],["请求不应该被重复提交",{"2":{"531":1}}],["请求限制",{"2":{"530":1}}],["请求和所有将来的请求应该使用另一个",{"2":{"526":1}}],["请求应该与另一个",{"2":{"525":1}}],["请求已经被实现",{"2":{"508":1}}],["请求已成功",{"2":{"507":1}}],["请求已被接受",{"2":{"501":1}}],["请求包含许多涉及文件操作的自请求",{"2":{"504":1}}],["请求设置",{"2":{"493":1}}],["请求头",{"0":{"492":1},"1":{"493":1}}],["请求数据包",{"2":{"480":1}}],["请求多次",{"2":{"461":1}}],["请求体",{"2":{"461":1}}],["请求目标资源根据请求中包含的表示中定义的部分更新来修改其状态",{"2":{"460":1}}],["请求目标资源在响应正文中传输收到的请求",{"2":{"457":1}}],["请求服务删除",{"2":{"456":1}}],["请求服务器进行处理",{"2":{"453":1}}],["请求",{"0":{"454":1},"2":{"482":1,"513":1,"730":1}}],["请求方法",{"0":{"450":1},"1":{"451":1,"452":1,"453":1,"454":1,"455":1,"456":1,"457":1,"458":1,"459":1,"460":1,"461":1},"2":{"414":1,"461":1}}],["请求类型",{"2":{"402":1,"718":1}}],["请求进行域名拆分",{"2":{"50":1}}],["请移步hwp源码",{"2":{"143":2}}],["得到信息摘要",{"2":{"566":2}}],["得到的是主机地址",{"2":{"548":1}}],["得到近似结果",{"2":{"298":1}}],["得到结果",{"2":{"147":2,"296":1,"297":1}}],["得到entries编译结果",{"2":{"143":2}}],["得到最低位的",{"2":{"4":1}}],["错误侦测和改错",{"2":{"476":1}}],["错误",{"2":{"143":2,"329":1,"737":2}}],["错误告警是否有新增错误",{"2":{"47":1}}],["假设数据格式为",{"2":{"191":2}}],["假设",{"2":{"143":2,"188":1}}],["🦐🦐🦐",{"2":{"142":1}}],["🔥事件队列",{"2":{"724":1}}],["😃",{"2":{"706":1}}],["😱",{"2":{"345":1}}],["😭",{"2":{"345":1}}],["👋",{"2":{"345":1}}],["💤",{"2":{"345":1}}],["🔧",{"2":{"345":1,"763":1}}],["👣",{"2":{"345":1}}],["🚶",{"2":{"345":1}}],["😟",{"2":{"345":1}}],["😒",{"2":{"345":1}}],["😳",{"2":{"345":1}}],["👏",{"2":{"345":1}}],["👊",{"2":{"345":1,"702":1}}],["🕐",{"2":{"345":1}}],["👎",{"2":{"345":1,"761":5}}],["👍",{"2":{"345":1,"761":5}}],["😧",{"2":{"345":1}}],["💯",{"2":{"345":1,"764":1}}],["😠",{"2":{"345":1}}],["👀createchildcompiler",{"2":{"141":1}}],["😡emit",{"2":{"139":1}}],["😡make",{"2":{"138":1}}],["😡",{"2":{"137":4,"138":1,"139":1}}],["😡thiscompilation",{"2":{"137":1}}],["产生值的类型",{"2":{"842":1}}],["产生默认绑定",{"2":{"808":1}}],["产生的",{"2":{"353":1}}],["产生之前",{"2":{"139":2}}],["产品体验",{"2":{"67":1}}],["资源分配的最小单元",{"2":{"725":1}}],["资源不需要重新传输资源",{"2":{"522":1}}],["资源在有请求头的",{"2":{"522":1}}],["资源已创建",{"2":{"455":1}}],["资源加载时间",{"2":{"381":1}}],["资源指标是否允许跨域收集",{"2":{"380":1}}],["资源文件",{"2":{"139":2}}],["资源占用",{"2":{"48":1}}],["为单个边距",{"2":{"582":1}}],["为网络号",{"2":{"550":1}}],["为应用程序标识身份",{"2":{"481":1}}],["为接入交换机的任意两个网络节点提供独享的电信号通路",{"2":{"464":1}}],["为调用",{"2":{"268":1}}],["为",{"2":{"221":1,"303":1,"326":1,"433":1,"590":1,"701":2,"717":1,"857":2}}],["为了配合",{"2":{"841":1}}],["为了执行效率",{"2":{"182":1}}],["为了允许在不降低性能的情况下注册大量的突变",{"2":{"161":1,"756":1}}],["为了",{"2":{"139":1}}],["为什么使用",{"0":{"830":1}}],["为什么",{"0":{"40":1}}],["到达当前执行位置所调用的所有函数",{"2":{"799":1}}],["到某个提交记录",{"2":{"264":1}}],["到",{"2":{"139":1,"282":2,"446":1}}],["到浏览器响应的时间",{"2":{"56":1}}],["把这种管理执行上下文称为执行上下文栈",{"2":{"786":1}}],["把这些变量的集合成为闭包",{"2":{"772":1}}],["把这段代码编译成机器码",{"2":{"174":1}}],["把传输表头",{"2":{"474":1}}],["把数据转换为能与接收者的系统格式兼容并适合传输的格式",{"2":{"472":1}}],["把数据包加入队列",{"2":{"433":1}}],["把不需要的提交记录修剪掉",{"2":{"257":1}}],["把处理封装成一个函数",{"2":{"168":2}}],["把模板文件加入到compiler编译文件队列中",{"2":{"143":2}}],["把模板文件加入进去",{"2":{"132":1}}],["把",{"2":{"137":1,"423":1}}],["地址进行归类的方法",{"2":{"551":1}}],["地址以及在互联网上有效的路由",{"2":{"551":1}}],["地址二进制进行逻辑与",{"2":{"548":1}}],["地址是在局域网上还是在远程网",{"2":{"547":1}}],["地址分配而产生的虚拟",{"2":{"546":1}}],["地址分配地址",{"2":{"429":1}}],["地址资源紧缺",{"2":{"546":1}}],["地址划分成网络地址和主机地址",{"2":{"545":1}}],["地址使用不同长度的子网掩码",{"2":{"550":1}}],["地址使用",{"2":{"545":1}}],["地址掩码",{"2":{"545":1}}],["地址完成这个路由协议的物理设备就是路由器",{"2":{"480":1}}],["地址对应保留一定时间",{"2":{"480":1}}],["地址对比",{"2":{"480":1}}],["地址获取",{"2":{"480":1}}],["地址缓存",{"2":{"464":1}}],["地址识别",{"2":{"464":1}}],["地址都保留用于将来和实验使用",{"2":{"446":1}}],["地址中不能以十进制",{"2":{"446":1}}],["地址中凡是以",{"2":{"446":1}}],["地址中的每一个字节都为",{"2":{"446":1}}],["地址编址方式",{"0":{"440":1},"1":{"441":1,"442":1,"443":1,"444":1,"445":1,"446":1}}],["地址类型",{"0":{"437":1},"1":{"438":1,"439":1}}],["地址有一定定位功能的",{"2":{"432":1}}],["地址像是身份证",{"2":{"432":1}}],["地址才有远程定位功能",{"2":{"432":1}}],["地址号全局唯一",{"2":{"432":1}}],["地址如何计算广播地址",{"0":{"431":1}}],["地址按位计算",{"2":{"429":1}}],["地址范围",{"2":{"429":2,"440":2}}],["地址段",{"2":{"424":1}}],["地址的一部分以区别网络标识和主机标识",{"2":{"547":1}}],["地址的一个网络层协议",{"2":{"480":1}}],["地址的哪些位标识的是主机所在的子网以及哪些位标识的是主机的位掩码",{"2":{"545":1}}],["地址的分配效率",{"2":{"546":1}}],["地址的分配",{"0":{"447":1}}],["地址的收回和续租",{"2":{"422":1}}],["地址的合法租用信息和其他配置的信息放入广播包",{"2":{"422":1}}],["地址并生成一条新的历史记录",{"2":{"271":1}}],["地址",{"0":{"421":1,"428":1,"432":1,"434":1,"436":1,"467":1},"1":{"429":1,"430":1,"431":1,"435":1,"436":1,"437":1,"438":1,"439":1,"440":1,"441":1,"442":1,"443":1,"444":1,"445":1,"446":1,"447":1},"2":{"137":1,"424":1,"425":1,"446":2,"447":1,"465":1,"479":1,"480":6,"486":1,"497":1,"498":1,"548":2,"549":1,"562":1}}],["做了以下操作",{"2":{"137":1,"138":1,"139":1}}],["写入",{"0":{"395":1}}],["写在最后",{"0":{"192":1}}],["写了",{"2":{"137":1}}],["写插件",{"2":{"135":1}}],["写一个",{"0":{"135":1}}],["|",{"2":{"134":2,"167":14,"198":2,"223":6,"226":7,"227":14,"229":3,"230":2,"237":8,"238":3,"250":1,"251":1,"256":16,"259":6,"265":10,"268":1,"271":1,"344":30,"598":4,"603":3,"837":1,"850":10,"862":8,"863":3,"865":2}}],["||",{"0":{"616":1},"2":{"98":10,"114":1,"195":2,"200":2,"222":1,"227":1,"232":2,"344":1,"718":2,"736":4,"737":8,"744":1,"810":4}}],["输出",{"2":{"775":2,"809":2,"858":1}}],["输出的结果都是一样的",{"2":{"461":1}}],["输出类",{"0":{"339":1}}],["输出结果",{"2":{"170":1}}],["输出文件名",{"2":{"134":2}}],["输入",{"2":{"775":2}}],["输入字段中插入新字符",{"2":{"228":1}}],["输入立即执行",{"2":{"81":1}}],["输入直接执行",{"2":{"78":1}}],["未被",{"2":{"819":1}}],["未查询到作用域",{"2":{"769":1}}],["未定义",{"2":{"737":1}}],["未能及时从上游服务器收到响应",{"2":{"543":1}}],["未能实时监听模板文件的改变",{"2":{"132":1}}],["未认证",{"2":{"529":1}}],["未曾被修改",{"2":{"522":1}}],["未知或不适用的目标",{"2":{"496":1}}],["未来",{"0":{"129":1}}],["钩子中实现",{"2":{"132":1}}],["钩子中的",{"2":{"132":1}}],["钩子",{"2":{"132":1}}],["890",{"2":{"835":2}}],["8999999999999999",{"2":{"298":1}}],["8c",{"2":{"428":6}}],["82",{"2":{"428":6}}],["83",{"2":{"428":2}}],["8a3c",{"2":{"428":2}}],["86400e3",{"2":{"399":2}}],["8080",{"2":{"419":8,"490":2}}],["80",{"2":{"283":1}}],["8组合输入",{"2":{"227":1}}],["8m",{"2":{"179":1}}],["8字符串",{"2":{"144":2}}],["8",{"2":{"131":2,"146":2,"147":4,"206":1,"275":1,"283":1,"287":2,"288":2,"290":3,"296":2,"297":2,"344":2,"429":3,"550":1,"761":1,"841":1}}],["`a",{"2":{"815":1}}],["`hello",{"2":{"342":1}}],["```js",{"2":{"339":1}}],["```md",{"2":{"339":1}}],["```html",{"2":{"339":1}}],["``````js",{"2":{"339":1}}],["``````md",{"2":{"339":1}}],["``````html",{"2":{"339":1}}],["``````",{"2":{"339":1}}],["```",{"2":{"339":5}}],["`",{"2":{"131":4,"208":4,"209":4}}],["关键词",{"2":{"832":1}}],["关键字配合",{"2":{"837":1}}],["关键字时被调用的函数",{"2":{"804":1}}],["关键字",{"2":{"701":1,"837":3,"864":1}}],["关键路径渲染",{"0":{"369":1},"1":{"370":1,"371":1,"372":1,"373":1,"374":1,"375":1,"376":1}}],["关键生命周期上报",{"2":{"46":1}}],["关闭的回调函数",{"0":{"826":1},"2":{"819":1}}],["关闭时触发",{"2":{"228":1}}],["关闭监听",{"2":{"158":2,"753":2}}],["关闭监听改变",{"2":{"157":1,"752":1}}],["关闭连接",{"0":{"157":1,"752":1}}],["关于原型的学习记录",{"2":{"760":1}}],["关于许多细节点没有处理",{"2":{"147":1}}],["关于",{"0":{"796":1},"1":{"797":1,"798":1,"799":1,"800":1,"801":1,"802":1,"803":1,"804":1,"805":1,"806":1,"807":1,"808":1,"809":1,"810":1,"811":1},"2":{"147":1}}],["关于如何把webpack的输出文件注入到模板文件当中",{"2":{"131":2}}],["简介",{"2":{"324":1}}],["简易实现问题",{"0":{"132":1}}],["简易的写一个",{"0":{"131":1},"1":{"132":1}}],["简单选择",{"2":{"115":1}}],["缩短文件目录路径",{"2":{"857":2}}],["缩写",{"2":{"130":1,"689":1}}],["缩进文本",{"2":{"113":1}}],["即返回这个新对象",{"2":{"804":1}}],["即调用栈",{"2":{"786":1}}],["即使该外部函数执行结束了",{"2":{"772":1}}],["即位置与尺寸",{"2":{"358":1}}],["即用第一位表示符号",{"2":{"292":1}}],["即时编译",{"2":{"174":1}}],["即配置匹配的文件返回的utf",{"2":{"144":2}}],["即",{"2":{"130":1}}],["本阶段执行已经被",{"2":{"821":1}}],["本身和子类可以访问",{"2":{"864":1}}],["本身引用",{"2":{"864":1}}],["本身",{"2":{"797":1}}],["本地机器上的所有",{"2":{"498":1}}],["本地缓存占用",{"2":{"48":1}}],["本机相互通信",{"2":{"429":1}}],["本文引用地址",{"2":{"346":1}}],["本文中",{"2":{"130":1}}],["本质上是在硬盘驱动器上引用文件的两种不同方式",{"2":{"323":1}}],["注释文本",{"2":{"716":1}}],["注释",{"2":{"160":1,"236":1,"755":1}}],["注",{"2":{"130":1}}],["注意基本类型小写",{"2":{"872":1}}],["注意顺序覆盖",{"2":{"761":1}}],["注意跨站点",{"2":{"350":1}}],["注意",{"2":{"137":1,"196":1,"198":1,"218":1,"404":1,"632":1,"662":1,"777":1,"877":2}}],["注意点",{"0":{"21":1,"807":1},"1":{"808":1,"809":1,"810":1}}],["注意判断成环的条件",{"2":{"16":1}}],["考虑的问题很多",{"2":{"128":1}}],["像语雀这种在线表格自研之路",{"2":{"128":1}}],["\\b复杂度",{"0":{"128":1}}],["成功类型",{"2":{"506":1}}],["成熟下去",{"2":{"324":1}}],["成千上百万的节点不可能一次性渲染出来",{"2":{"125":1}}],["成正比",{"2":{"0":1}}],["菜鸟业务webexcel",{"2":{"122":1}}],["钉钉",{"0":{"122":1}}],["来查找",{"2":{"846":1}}],["来寻找",{"2":{"846":1}}],["来调用函数",{"2":{"804":1}}],["来进行显式绑定",{"2":{"803":1}}],["来进行任意长度的前缀的分配",{"2":{"551":1}}],["来看看",{"2":{"715":1}}],["来看看一些用过的在线文档编辑设计思路以及架构模式",{"2":{"121":1}}],["来确定结束位置",{"2":{"191":2}}],["来确定初始位置",{"2":{"191":2}}],["来渲染出数据",{"2":{"189":1}}],["来说",{"2":{"159":1,"754":1}}],["来自",{"2":{"112":1}}],["同步任务在",{"2":{"733":1}}],["同步任务和异步任务",{"2":{"733":1}}],["同下document",{"2":{"715":1}}],["同下",{"2":{"715":2}}],["同一层相邻元素",{"2":{"583":1}}],["同一个主机上的每个应用程序都需要指定唯一的端口号",{"2":{"481":1}}],["同一网络号里面的机器都能收到",{"2":{"429":1}}],["同源",{"2":{"416":1,"417":1}}],["同源策略",{"0":{"416":1},"1":{"417":1}}],["同样解释器也会对源代码进行词法分析",{"2":{"170":1}}],["同理",{"2":{"168":2}}],["同时保留隐式绑定或显示绑定修改",{"2":{"810":1}}],["同时操作dom",{"2":{"731":1}}],["同时使用",{"2":{"666":2}}],["同时支持传输音视频数据",{"2":{"569":1}}],["同时主次",{"2":{"226":1}}],["同时阻止任何事件处理程序被调用",{"2":{"221":1}}],["同时还会排列起来",{"2":{"182":1}}],["同时添加",{"2":{"168":2}}],["同时返回编译模板返回的资源内容",{"2":{"138":1}}],["同构表vs异构表",{"0":{"118":1}}],["同上document",{"2":{"715":1}}],["同上",{"2":{"90":1,"715":3}}],["折叠后的外边距的值为最小的负边距的值",{"2":{"583":1}}],["折叠后的外边距的最大的正边距与最小的负边距",{"2":{"583":1}}],["折叠",{"2":{"115":1,"582":1}}],["示例2",{"2":{"144":2}}],["示例1",{"2":{"144":2}}],["示例",{"2":{"114":1,"402":1}}],["清屏",{"2":{"858":1}}],["清理任何不需要的资源",{"2":{"830":1}}],["清除行内的部分区域",{"2":{"815":1}}],["清除屏幕的部分区域",{"2":{"815":1}}],["清除浮动让文档布局正常化",{"2":{"601":1}}],["清除浮动元素或非浮动元素",{"2":{"601":1}}],["清除浮动",{"2":{"583":2,"596":1}}],["清除",{"2":{"183":1}}],["清除选区并选择指定节点的所有子节点",{"2":{"114":1}}],["清零最低位的",{"2":{"4":1}}],["这是你的",{"2":{"422":1}}],["这是一种实现方式",{"2":{"195":2}}],["这是一种配置",{"2":{"144":2}}],["这些",{"2":{"405":1}}],["这时就要移除事件绑定",{"2":{"168":1}}],["这时候你会发现效果大有不同",{"2":{"168":2}}],["这就达到了关闭的效果",{"2":{"163":1,"758":1}}],["这将返回队列中存在的mutationrecord实例数组",{"2":{"163":1,"758":1}}],["这确保记录队列的内容没有双重回调处理",{"2":{"162":1,"757":1}}],["这个记录会包含函数在哪里被调用",{"2":{"796":1}}],["这个属性",{"2":{"763":1}}],["这个可以使文件回到",{"2":{"263":1}}],["这个队列对于每个mutationobserver实例是惟一的",{"2":{"161":1,"756":1}}],["这个在",{"2":{"132":1}}],["这种情况下",{"2":{"326":1}}],["这种方式不会重新加载",{"2":{"271":1}}],["这种方法webpack会解析入口文件中的loader并解析",{"2":{"144":2}}],["这种形式可以通过自定义的",{"2":{"137":1}}],["这也是必须值得思考的地方",{"2":{"126":1}}],["这样会移除选区",{"2":{"114":1}}],["这里就拿",{"2":{"715":1}}],["这里会导出一个对象",{"2":{"672":2}}],["这里会触发文档的",{"2":{"195":2}}],["这里结果就是",{"2":{"494":2}}],["这里将开始自己的写作之旅",{"2":{"324":1}}],["这里返回的是",{"2":{"202":2,"203":2}}],["这里要保证可视区域必定要有数据展示",{"2":{"190":2}}],["这里只针对于计算部分的代码",{"2":{"188":2}}],["这里强制触发一下回流",{"2":{"168":2}}],["这里得到一个函数",{"2":{"147":2}}],["这里loader参照html",{"2":{"147":2}}],["这里为了配置部分代码展示",{"2":{"143":2}}],["这里处理输出文件到",{"2":{"139":1}}],["这里把模板文件",{"2":{"137":1}}],["这里需要把浏览器端需要创建的",{"2":{"106":1}}],["这里通过服务端",{"2":{"106":2}}],["这里是你要创建的",{"2":{"106":2}}],["这里",{"2":{"104":2,"188":2}}],["移动到指定的值来扩展选区",{"2":{"114":1}}],["移除绑定事件",{"2":{"195":2}}],["移除文本的链接",{"2":{"113":1}}],["移除不必要的代码",{"2":{"65":1}}],["与逻辑或操作符",{"2":{"736":1}}],["与盒模型相关的css属性",{"0":{"586":1}}],["与自己的",{"2":{"480":1}}],["与事件关联的抽象视图",{"2":{"221":1}}],["与事件相关的细节信息",{"2":{"221":1}}],["与主compiler类似相同的api",{"2":{"141":1}}],["与",{"2":{"114":1,"512":1,"626":1,"730":3,"737":1,"806":2,"812":1,"838":1,"870":1}}],["与每行代码执行次数",{"2":{"0":1}}],["范围内的字符",{"2":{"814":1}}],["范围的元素",{"2":{"637":1}}],["范围的数量",{"2":{"114":1}}],["范围非常有限",{"2":{"432":1}}],["范围中的内容",{"2":{"115":2}}],["范围",{"2":{"114":3,"115":4}}],["范围添加到选区中",{"2":{"114":1}}],["获取类型",{"2":{"857":2}}],["获取变量的值",{"2":{"770":1}}],["获取到",{"2":{"561":1}}],["获取每一项的偏移高度",{"2":{"191":2}}],["获取结束位置",{"2":{"190":2,"191":2}}],["获取开始位置",{"2":{"190":2,"191":2}}],["获取",{"2":{"168":1,"268":1,"480":1}}],["获取系统主题",{"2":{"149":2}}],["获取选区范围",{"2":{"114":2}}],["获取选区文本",{"2":{"114":2}}],["获取选择文本",{"2":{"114":1}}],["获取组件的状态和数据",{"2":{"38":1}}],["方式定义值",{"2":{"762":1}}],["方式",{"0":{"647":1,"649":1,"650":1}}],["方向",{"2":{"580":1}}],["方案",{"0":{"188":1}}],["方法能对所有的",{"2":{"703":1}}],["方法内部的",{"2":{"670":2}}],["方法允许访问请求的资源",{"2":{"410":1}}],["方法也返回完整",{"2":{"271":1}}],["方法来耗尽mutationobserver实例的记录队列",{"2":{"163":1,"758":1}}],["方法第二个参数对象有哪些属性",{"0":{"160":1,"755":1}}],["方法",{"0":{"155":1,"163":1,"750":1,"758":1},"2":{"132":1,"163":1,"221":1,"222":1,"668":4,"671":1,"758":1,"762":1,"763":1}}],["方法可以检测当前文本是否执行过某个命令",{"2":{"113":1}}],["方法可以检测当前位置是否可以执行某个命令",{"2":{"113":1}}],["方便调试以及修复",{"2":{"65":1}}],["选项",{"2":{"857":2}}],["选择",{"2":{"838":1}}],["选择图形再现",{"2":{"815":1}}],["选择框脚本",{"2":{"718":1}}],["选择器组合",{"0":{"610":1},"1":{"611":1,"612":1,"613":1,"614":1,"615":1,"616":1}}],["选择器",{"0":{"604":1,"606":1},"1":{"605":1,"606":1,"607":1,"608":1,"609":1,"610":1,"611":1,"612":1,"613":1,"614":1,"615":1,"616":1,"617":1,"618":1,"619":1,"620":1,"621":1,"622":1,"623":1,"624":1,"625":1,"626":1}}],["选择加密方式以及返回数字证书和",{"2":{"563":1}}],["选择加密方式以及生成公钥和",{"2":{"559":1}}],["选择加密方式和",{"2":{"553":1}}],["选择适合团队的技术栈",{"2":{"59":1}}],["选区中包含的",{"2":{"114":1}}],["选区终点所在的节点",{"2":{"114":1}}],["选区起点所在的节点",{"2":{"114":1}}],["选中所有文本",{"2":{"113":1}}],["撤销",{"2":{"113":1}}],["斜体",{"2":{"113":1}}],["插画",{"2":{"695":1}}],["插入节点",{"2":{"229":1}}],["插入文档或之后触发",{"2":{"229":1}}],["插入",{"2":{"115":1}}],["插入一张图片",{"2":{"113":1}}],["插入一个",{"2":{"113":1}}],["插件进程",{"2":{"348":1}}],["插件扩展",{"2":{"251":1}}],["插件规则",{"2":{"246":2}}],["插件名",{"2":{"242":2}}],["插件如何处理favicon",{"2":{"145":2}}],["插件",{"0":{"131":1,"135":1,"142":1},"1":{"132":1,"143":1,"144":1,"145":1,"146":1,"147":1},"2":{"104":1}}],["~~~",{"2":{"643":1}}],["~",{"0":{"615":1},"2":{"113":1,"688":1,"865":2,"876":1}}],["要发送的",{"2":{"718":1}}],["要求客户端执行临时重定向",{"2":{"520":1}}],["要求请求者重置文档视图",{"2":{"512":1}}],["要连接的目标是服务器端的套接字",{"2":{"487":1}}],["要使用",{"2":{"424":1}}],["要处理的事件名函数",{"2":{"218":1}}],["要处理的事件名",{"2":{"218":1}}],["要包围当前文本块的",{"2":{"113":1}}],["要执行的命令名称",{"2":{"112":2}}],["修饰符",{"2":{"666":2}}],["修改字体",{"2":{"113":1}}],["修复",{"2":{"64":1}}],["剪切板事件对象",{"2":{"197":1}}],["剪切",{"2":{"113":1}}],["字面类型",{"2":{"862":1}}],["字符范围",{"2":{"815":1}}],["字符",{"2":{"814":1}}],["字符编码",{"2":{"619":1}}],["字符串",{"2":{"113":2,"303":1}}],["字节的掩码",{"2":{"489":1}}],["字节的主机地址",{"2":{"443":1}}],["字节的网络地址",{"2":{"441":1,"442":1,"443":1}}],["字节主机地址",{"2":{"441":1,"442":1}}],["字节序",{"0":{"281":1}}],["字节",{"2":{"274":1,"275":1,"277":1,"433":1}}],["字节码需要通过解释器将其转换为机器码后才能执行",{"2":{"173":1}}],["字节码是介于",{"2":{"173":1}}],["字体颜色",{"2":{"113":1}}],["字体大小",{"2":{"113":1}}],["字体名称",{"2":{"113":1}}],["字典树",{"0":{"14":1}}],["设备事件",{"0":{"233":1}}],["设置背景颜色",{"2":{"718":2}}],["设置html字符串",{"2":{"717":1}}],["设置值",{"2":{"717":2}}],["设置默认css样式表集的名称",{"2":{"701":1}}],["设置flex布局后",{"2":{"651":1}}],["设置高度有效",{"2":{"643":2}}],["设置高度无效",{"2":{"643":1}}],["设置宽度的情况",{"2":{"599":1}}],["设置宽度",{"2":{"599":2}}],["设置的",{"2":{"404":1}}],["设置300s",{"2":{"400":2}}],["设置一天",{"2":{"399":2}}],["设置一个时间来控制显示隐藏",{"2":{"168":1}}],["设置哪些域名可以访问",{"2":{"397":1}}],["设置多个",{"2":{"395":2}}],["设置关键资源的优先级",{"2":{"376":1}}],["设置",{"2":{"268":1,"326":2,"402":1,"403":1,"815":1}}],["设置元素样式",{"2":{"188":2}}],["设置文档的背景颜色",{"2":{"113":1}}],["设计规范",{"0":{"161":1,"756":1},"1":{"162":1,"163":1,"164":1,"757":1,"758":1,"759":1}}],["设计",{"2":{"13":1,"67":1}}],["值从",{"2":{"815":1}}],["值时",{"2":{"712":1}}],["值不在遍历值当中",{"2":{"669":1}}],["值形式",{"2":{"668":1}}],["值必须为对象",{"2":{"668":1}}],["值",{"2":{"113":1,"218":1,"494":1,"667":2,"668":1,"761":1}}],["无效function",{"2":{"803":1}}],["无效",{"2":{"717":2,"803":1,"811":1,"815":1}}],["无效的请求消息或欺骗性路由请求",{"2":{"528":1}}],["无作用域的元素",{"2":{"717":1}}],["无类别域间路由",{"0":{"551":1}}],["无类型域间选路",{"2":{"429":1}}],["无法与",{"2":{"874":1}}],["无法使用",{"2":{"777":1}}],["无法改变所在的作用域",{"2":{"775":3}}],["无法确定优先级",{"2":{"737":1}}],["无法通过",{"2":{"670":1}}],["无法实现垂直居中",{"2":{"590":1}}],["无法保证服务器发送给浏览器的数据安全",{"2":{"558":1}}],["无法完成对请求的处理",{"2":{"539":1}}],["无法收到确认",{"2":{"481":1}}],["无需验证返回",{"2":{"511":1}}],["无需服务端配置",{"2":{"270":1}}],["无特定地址",{"2":{"496":1}}],["无任何副作用",{"2":{"131":2}}],["无",{"2":{"112":2}}],["无向图探测",{"2":{"16":1}}],["无向图",{"2":{"15":1}}],["富文本选区",{"0":{"114":1}}],["富文本编辑",{"0":{"112":1},"1":{"113":1,"114":1,"115":1,"116":1}}],["富文本可编辑属性",{"2":{"111":1}}],["以外的值",{"2":{"810":1}}],["以这种方式创建函数",{"2":{"761":1}}],["以像素计",{"2":{"718":2}}],["以",{"2":{"676":3}}],["以便区分伪元素",{"2":{"632":1}}],["以便最有效的利用现有的地址空间",{"2":{"550":1}}],["以便其方法可以可用于处理数据",{"2":{"206":1}}],["以空行结束",{"2":{"501":1}}],["以防下次请求",{"2":{"480":1}}],["以形成分组",{"2":{"475":1}}],["以设置与另一应用软件之间的通信",{"2":{"471":1}}],["以太网",{"0":{"463":1},"2":{"476":1}}],["以太网规定",{"2":{"433":1}}],["以太网的默认值",{"2":{"433":1}}],["以此类推",{"2":{"297":1}}],["以8位二进制为例",{"2":{"294":1}}],["以上方式如果不指定高度",{"2":{"650":1}}],["以上方式都会生成浏览器新的历史记录",{"2":{"271":1}}],["以上三种方式同样效果",{"2":{"271":1}}],["以及一个最终字节组成",{"2":{"815":1}}],["以及一个",{"2":{"564":1}}],["以及",{"2":{"560":1}}],["以及利用随机数的生成密钥的算法都是公开的",{"2":{"555":1}}],["以及冷门的api学习都要串联起来",{"2":{"128":1}}],["以及各个顶点对应的前一个顶点",{"2":{"16":1}}],["以下优先级从高到底",{"2":{"744":1}}],["以下截图来源",{"2":{"719":1}}],["以下元素也可以是替换元素",{"2":{"638":1}}],["以下代码片段在两个连续异步代码块中重新连接",{"2":{"159":1,"754":1}}],["以下",{"2":{"112":1}}],["以下图片失效",{"2":{"110":1}}],["yield",{"2":{"669":11}}],["yellow",{"2":{"859":2}}],["yeild",{"2":{"669":1}}],["year",{"2":{"666":4}}],["yes",{"2":{"461":25,"761":5,"762":6}}],["y",{"2":{"586":1,"666":3,"861":4,"864":4,"866":2,"874":10}}],["yandex",{"2":{"347":2}}],["yarn",{"0":{"327":1},"1":{"328":1,"329":1,"330":1},"2":{"109":2,"329":1,"330":1}}],["your",{"2":{"250":1,"677":2,"857":2}}],["y距离",{"2":{"226":1}}],["yz",{"0":{"23":1},"1":{"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1}}],["建议使用",{"2":{"859":1}}],["建立新的线程",{"2":{"487":1}}],["建立连接",{"0":{"490":1},"2":{"106":1}}],["建堆",{"2":{"12":3}}],["刷新页面",{"2":{"106":1}}],["文字代码html",{"2":{"698":1}}],["文字特性的",{"2":{"643":1}}],["文字特性",{"0":{"643":1},"1":{"644":1,"645":1,"646":1,"647":1,"648":1,"649":1,"650":1,"651":1}}],["文章",{"2":{"324":1,"687":1}}],["文本内容",{"2":{"640":1}}],["文本和行内元素围绕着浮动元素",{"2":{"597":1}}],["文本方向属性决定",{"2":{"580":1}}],["文本框输入文本时最长用到",{"2":{"227":1}}],["文本",{"2":{"160":1,"755":1}}],["文件结构定义",{"0":{"867":1},"1":{"868":1,"869":1,"870":1,"871":1,"872":1,"873":1,"874":1}}],["文件绝对路经",{"2":{"857":2}}],["文件定义中多个",{"2":{"852":1}}],["文件开头加入以下代码",{"2":{"832":1}}],["文件访问",{"2":{"728":1}}],["文件会指向",{"2":{"425":1}}],["文件编写格式",{"2":{"336":1}}],["文件作为",{"2":{"330":1}}],["文件的硬链接",{"2":{"321":1}}],["文件也会更改",{"2":{"321":1}}],["文件名",{"2":{"263":1}}],["文件夹",{"2":{"139":1,"309":1}}],["文件",{"0":{"145":1,"856":1},"1":{"857":1,"858":1},"2":{"137":1,"322":2,"423":1,"620":1,"854":2,"857":4,"871":1}}],["文件中",{"2":{"106":1}}],["文档片段",{"2":{"716":1}}],["文档结构发生变化时",{"2":{"716":1}}],["文档最外层元素使用块布局规则称为初始块格式上下文",{"2":{"574":1}}],["文档编辑",{"0":{"335":1}}],["文档在",{"2":{"232":2}}],["文档接收到事件",{"2":{"214":1}}],["文档中嵌套层次最深的那个节点",{"2":{"213":1}}],["文档标题",{"2":{"134":2}}],["文档技术",{"0":{"119":1}}],["文档执行预定义命令",{"2":{"112":2}}],["文档",{"2":{"110":1,"213":1}}],["文档桌面应用客户端",{"2":{"110":1}}],["文档对象模型",{"2":{"72":1}}],["和函数如何调用的没关系",{"2":{"771":1}}],["和原型有关的几个",{"2":{"762":1}}],["和根",{"2":{"568":1}}],["和响应数据格式",{"2":{"482":1}}],["和样式重算",{"2":{"357":1}}],["和结束位置",{"2":{"189":1,"191":1}}],["和机器码之间的一种代码",{"2":{"173":1}}],["和",{"0":{"231":1},"2":{"106":1,"114":1,"167":1,"168":4,"212":1,"218":1,"226":1,"266":1,"282":2,"294":1,"311":1,"312":1,"353":1,"369":1,"381":1,"416":1,"452":1,"463":1,"554":2,"555":1,"568":1,"575":1,"582":1,"583":1,"618":2,"639":1,"672":2,"718":2,"761":1,"777":1,"821":1,"863":2,"874":1}}],["所执行的环境作用域",{"2":{"773":1}}],["所在的线程",{"2":{"730":1}}],["所标识的资源",{"2":{"456":1}}],["所以传递到",{"2":{"820":1}}],["所以不能通过取整的方式来计算",{"2":{"191":2}}],["所以这里我们把",{"2":{"106":1}}],["所有文件会被编译成一个文件",{"2":{"857":2}}],["所有序列都以",{"2":{"814":1}}],["所有",{"2":{"797":1}}],["所有属性被实例共享",{"2":{"761":1}}],["所有非标准字符编码",{"2":{"708":1}}],["所有参与折叠的元素外边距都为负值",{"2":{"583":1}}],["所有元素都支持",{"2":{"227":1}}],["所有的活动对象都向一端移动",{"2":{"183":1}}],["所有的顶点",{"2":{"16":1}}],["所有标记完成之后",{"2":{"181":1}}],["所有垃圾回收机制",{"2":{"181":1}}],["所有代码执行的时间",{"2":{"0":1}}],["发出",{"2":{"826":1}}],["发生以下步骤",{"2":{"804":1}}],["发生强制转换类型",{"2":{"720":1}}],["发生的变化比最初计划回调微任务的变化更多",{"2":{"162":1,"757":1}}],["发起请求数据包",{"2":{"480":1}}],["发现是热点代码之后",{"2":{"174":1}}],["发送给服务器确认",{"2":{"559":1,"563":1}}],["发送方",{"2":{"419":2,"491":2}}],["发送",{"2":{"402":10}}],["发送信号",{"2":{"106":1}}],["发送一组信号",{"2":{"106":2}}],["发布到正式环境",{"2":{"870":1}}],["发布包",{"2":{"832":1}}],["发布",{"2":{"67":1,"669":1}}],["⚔",{"2":{"106":4}}],["创建实例",{"2":{"866":1}}],["创建文本节点",{"2":{"716":1}}],["创建文件",{"2":{"317":1}}],["创建新的",{"2":{"575":1,"576":1}}],["创建一个新的对象",{"2":{"804":1}}],["创建一个新函数",{"2":{"764":1}}],["创建一个新对象方法都能用于此处",{"2":{"762":2}}],["创建一个新对象",{"2":{"761":1}}],["创建一个函数",{"2":{"761":1}}],["创建一个全局函数",{"2":{"761":1}}],["创建一个对象",{"0":{"761":1}}],["创建一个到",{"2":{"321":1}}],["创建一个子解析器",{"0":{"140":1},"1":{"141":1}}],["创建软链接",{"2":{"317":1}}],["创建的子",{"2":{"132":1}}],["创建包围元素",{"2":{"114":2}}],["创建",{"0":{"143":1,"318":1,"322":1},"2":{"106":2,"137":1,"206":1,"728":1}}],["创建分支过程",{"2":{"60":1}}],["服务收到非对称加密套件列表",{"2":{"556":1}}],["服务集成",{"2":{"347":4}}],["服务地址",{"2":{"106":2}}],["服务",{"2":{"106":1,"347":3}}],["服务端套接字接收到客户端套接字的连接请求",{"2":{"487":1}}],["服务端",{"2":{"105":1,"106":2,"108":1,"490":1}}],["服务器能够处理的字符集",{"2":{"718":1}}],["服务器浏览器确认返回信息",{"2":{"559":1,"563":1}}],["服务器收到消息",{"2":{"559":1,"563":1}}],["服务器收到加密套件列表",{"2":{"553":1}}],["服务器当前无法处理请求",{"2":{"542":1}}],["服务器维护或者过载",{"2":{"542":1}}],["服务器不支持当前请求所需要的某个功能",{"2":{"540":1}}],["服务器不能或不会处理该请求",{"2":{"528":1}}],["服务器出现问题",{"2":{"539":1}}],["服务器错误",{"2":{"538":1}}],["服务器成功处理了请求",{"2":{"511":1}}],["服务器是一个转换代理服务器",{"2":{"510":1}}],["服务器已经理解请求",{"2":{"531":1}}],["服务器已经理解客户端的请求",{"2":{"503":1}}],["服务器已经成功处理了部分",{"2":{"513":1}}],["服务器已经接受请求",{"2":{"509":1}}],["服务器已经接收到请求头",{"2":{"502":1}}],["服务器已经收到并正在处理请求",{"2":{"504":1}}],["服务器获取握手请求中的",{"2":{"494":1}}],["服务器端套接字继续处于监听状态",{"2":{"487":1}}],["服务器端套接字并不定位具体的客户端套接字",{"2":{"487":1}}],["服务器监听",{"2":{"487":1}}],["服务器会给",{"2":{"425":1}}],["服务器请求计算机的配置信息",{"2":{"425":1}}],["服务器请求下载文件",{"2":{"425":1}}],["服务器的地址",{"2":{"424":1,"425":1}}],["服务器权限",{"2":{"406":1}}],["服务器响应速度",{"2":{"381":1}}],["服务器域名",{"2":{"271":1}}],["服务器",{"0":{"497":1},"2":{"50":1,"446":1}}],["模型不区分物理层和数据链路层",{"2":{"483":1}}],["模型之外的任何协议栈",{"2":{"483":1}}],["模型的第二层",{"2":{"464":1}}],["模式",{"2":{"309":1,"854":1}}],["模板",{"2":{"143":2}}],["模板地址",{"2":{"134":2}}],["模板内容不改变",{"2":{"132":1}}],["模板html",{"2":{"108":1}}],["模板文件生成之后",{"2":{"139":2}}],["模板文件生成之前",{"2":{"139":2}}],["模板文件",{"2":{"104":1,"146":1}}],["模块模板",{"0":{"869":1},"1":{"870":1}}],["模块化",{"0":{"868":1}}],["模块化设计",{"0":{"32":1},"1":{"33":1,"34":1,"35":1}}],["模块路径解析",{"2":{"845":1}}],["模块的运行时",{"2":{"853":1}}],["模块的类型",{"2":{"842":1}}],["模块的负责人负责自身模块的技术优化方案",{"2":{"64":1}}],["模块只加载一次",{"2":{"681":1}}],["模块名",{"2":{"309":2}}],["模块",{"0":{"147":1},"2":{"147":1,"669":1,"857":2}}],["模块负责人对自身模块执行的关键点进行标记",{"2":{"66":1}}],["模块变动其他模块配置都需更新",{"2":{"65":1}}],["模块耦合严重",{"0":{"63":1}}],["模块数量",{"2":{"62":1}}],["模块拆分以及协作方式",{"2":{"34":1}}],["模块划分与设计原则",{"0":{"34":1}}],["时可以定义",{"2":{"861":1}}],["时可调用",{"2":{"221":1}}],["时不会引发错误",{"2":{"738":1}}],["时其浮动的元素",{"2":{"575":1}}],["时是被禁止的",{"2":{"493":1}}],["时应忽略这些条目",{"2":{"380":1}}],["时应忽略这些页面",{"2":{"380":1}}],["时",{"2":{"163":1,"188":2,"326":1,"408":1,"672":2,"735":1,"737":1,"758":1,"808":1}}],["时获取资源文件",{"2":{"104":1}}],["时间获取键码",{"2":{"227":1}}],["时间",{"2":{"168":2,"694":1}}],["时间维度",{"2":{"67":1}}],["时间角度",{"0":{"49":1},"1":{"50":1,"51":1,"52":1,"53":1}}],["时间和空间",{"2":{"48":1}}],["时间复杂度",{"0":{"1":1}}],["访问普通对象的",{"2":{"763":1}}],["访问到被定义为隐式属性的",{"2":{"763":1}}],["访问数组元素",{"0":{"743":1}}],["访问不到有关安全的",{"2":{"196":1}}],["访问",{"2":{"104":1}}],["访问过的节点即存在环",{"2":{"16":1}}],["没多大影响",{"2":{"877":2}}],["没开启",{"2":{"859":2}}],["没按下",{"2":{"226":1}}],["没错",{"2":{"168":2}}],["没看到而已",{"2":{"104":1}}],["没有明显的导出",{"2":{"840":1}}],["没有明显地区区分服务",{"2":{"483":1}}],["没有被调度的计时器时",{"2":{"819":1}}],["没有被内部捕获",{"2":{"669":1}}],["没有",{"2":{"761":1}}],["没有边框",{"2":{"583":3}}],["没有内容将父元素和后代元素分开",{"2":{"583":1}}],["没有返回任何内容",{"2":{"511":1}}],["没有基线",{"2":{"326":1}}],["没有打印",{"2":{"157":2,"158":2,"159":2,"752":2,"753":2,"754":2}}],["没有直接使用webpack插件提供的主compiler",{"2":{"140":1}}],["没有其他作用",{"2":{"95":1}}],["没有父节点或者当前删除的节点与父节点比较",{"2":{"12":1}}],["没有左节点",{"2":{"12":1}}],["进程被创建",{"2":{"729":1}}],["进程是",{"2":{"725":1}}],["进程模式",{"0":{"354":1}}],["进程",{"0":{"348":1,"353":1,"725":1},"1":{"349":1,"350":1,"351":1,"352":1,"353":1},"2":{"348":2,"356":1,"357":1,"358":1,"359":1,"360":1,"361":1,"362":1,"363":1,"364":1,"365":1,"366":1,"367":2,"368":2,"724":1,"729":1}}],["进程合成",{"2":{"52":1}}],["进制转换",{"0":{"285":1},"1":{"286":1,"287":1,"288":1,"289":1,"290":1}}],["进行",{"2":{"494":1}}],["进行外部网关协议和其他自治域之间拓扑信息的交换",{"2":{"466":1}}],["进行样式分析",{"2":{"357":1}}],["进行路由的处理",{"2":{"269":1}}],["进行查看",{"2":{"196":1}}],["进行优化",{"2":{"132":1}}],["进行文件的记忆性生成",{"2":{"104":1}}],["利用私钥解密数据",{"2":{"557":1}}],["利用nodejs",{"2":{"147":2}}],["利用了主",{"2":{"132":1}}],["利用",{"2":{"104":1,"106":3}}],["利用以上变量遍历返回成环的对象",{"2":{"16":1}}],["中配置",{"2":{"857":2}}],["中控制显示隐藏的属性",{"2":{"652":1}}],["中元素的布局",{"2":{"575":1}}],["中继器",{"2":{"477":1}}],["中采用",{"2":{"284":1}}],["中忽略文件不生效",{"2":{"252":1}}],["中次",{"2":{"226":1}}],["中间字节",{"2":{"815":1}}],["中间",{"2":{"226":1,"568":1}}],["中间件作用",{"2":{"104":1}}],["中间件",{"2":{"104":2}}],["中去",{"2":{"137":1}}],["中的配置",{"2":{"831":1}}],["中的",{"2":{"618":2,"668":1,"718":3,"763":1,"848":1}}],["中的元素",{"2":{"380":1}}],["中的滚动与动画",{"2":{"352":1}}],["中的目录和文件名",{"2":{"271":1}}],["中的文件加入到主",{"2":{"137":1}}],["中的字符数量",{"2":{"114":1}}],["中包含在选区之内的字符数量",{"2":{"114":1}}],["中",{"0":{"146":1},"1":{"147":1},"2":{"106":2,"232":1,"482":1,"637":1,"804":1,"828":1,"857":2}}],["中序遍历",{"2":{"21":1}}],["思考",{"2":{"168":1,"188":1}}],["思考三",{"0":{"105":1},"1":{"106":1}}],["思考二",{"0":{"103":1},"1":{"104":1}}],["思考一",{"0":{"101":1},"1":{"102":1}}],["启动文件",{"2":{"425":1}}],["启动参数可控",{"2":{"354":1}}],["启动脚本命令时",{"2":{"329":1}}],["启动项目脚本目录",{"2":{"108":1}}],["启动",{"2":{"104":1,"423":2,"425":2,"433":1}}],["启动端口",{"2":{"102":2}}],["启动一个端口服务作为服务端",{"2":{"101":1}}],["解码",{"2":{"705":1,"707":1,"709":1}}],["解构赋值",{"0":{"664":1}}],["解决了什么问题",{"0":{"576":1}}],["解决了两个编码问题",{"2":{"294":1}}],["解决物理网络本身的某些问题",{"2":{"549":1}}],["解决",{"2":{"546":1}}],["解决方式",{"0":{"645":1},"1":{"646":1,"647":1,"648":1,"649":1,"650":1,"651":1}}],["解决方法",{"0":{"299":1}}],["解决方案",{"0":{"189":1},"1":{"190":1,"191":1}}],["解决问题",{"2":{"100":1}}],["解析成抽象语法树",{"2":{"766":1}}],["解析浏览器进程传送的字节",{"2":{"356":1}}],["解析",{"0":{"848":1,"849":1},"2":{"172":1,"766":1}}],["解析器",{"0":{"144":1}}],["解释执行",{"2":{"765":1}}],["解释器解析生成字节码",{"2":{"174":1}}],["解释器逐条解释执行",{"2":{"174":1}}],["解释器",{"2":{"174":2}}],["解释器和执行器",{"0":{"170":1}}],["解释性代码如下",{"2":{"142":1}}],["解释",{"2":{"113":1}}],["解答",{"0":{"102":1,"104":1,"106":1}}],["编码",{"0":{"703":1},"1":{"704":1,"705":1,"706":1,"707":1,"708":1,"709":1},"2":{"494":1,"703":1,"704":1}}],["编码规范",{"2":{"60":1}}],["编辑器自动从",{"2":{"857":2}}],["编辑器",{"2":{"857":2}}],["编辑",{"2":{"321":1,"336":1}}],["编译能通过运行会报错",{"2":{"863":1}}],["编译ts文件",{"2":{"858":2}}],["编译成",{"2":{"854":1}}],["编译原理",{"0":{"766":1}}],["编译器把热点的字节码编译成机器码",{"2":{"174":1}}],["编译器首先会依次对源代码进行词法分析",{"2":{"170":1}}],["编译结果也不能在分布式系统上移植",{"2":{"765":1}}],["编译结果",{"2":{"147":1}}],["编译",{"2":{"147":2,"857":2}}],["编译入口文件结果资源",{"2":{"143":2}}],["编译后的内容",{"2":{"137":1}}],["编译出错时打印日志",{"2":{"104":2}}],["编译完成",{"2":{"100":1}}],[">",{"2":{"99":1}}],["删减改版",{"2":{"98":1}}],["删除或者更改名字",{"2":{"330":1}}],["删除原始文件不影响硬链接",{"2":{"320":1}}],["删除原始文件",{"2":{"317":1,"318":2,"321":1,"322":2}}],["删除结点",{"2":{"156":1,"751":1}}],["删除选择的文本",{"2":{"113":1}}],["删除节点",{"2":{"21":1,"229":1}}],["删除的元素",{"2":{"12":1}}],["删除",{"2":{"12":1}}],["返回类型",{"2":{"838":1}}],["返回新对象",{"2":{"761":1}}],["返回其右侧操作数",{"2":{"735":1}}],["返回所有的样式",{"2":{"718":2}}],["返回所有匹配的结果数组",{"2":{"666":1}}],["返回给定属性的字符串值",{"2":{"718":1}}],["返回给浏览器",{"2":{"553":1}}],["返回包含给定属性值的",{"2":{"718":1}}],["返回子元素",{"2":{"717":1}}],["返回new命令作用于的那个构造函数",{"2":{"670":1}}],["返回遍历器对象",{"2":{"669":1}}],["返回正则表达式的修饰符",{"2":{"666":1}}],["返回当前匹配的数组",{"2":{"666":1}}],["返回表示指定计数器当前值的拼接字符串",{"2":{"641":1}}],["返回加密方式和公钥",{"2":{"556":1}}],["返回的对象与构造函数或者构造函数属性没有关系",{"2":{"761":1}}],["返回的是一个遍历器对象",{"2":{"669":1}}],["返回的结果给一个赋值变量",{"2":{"669":1}}],["返回的窗口对象",{"2":{"419":1}}],["返回的函数带有三个属性方法",{"2":{"95":1}}],["返回三个属性",{"2":{"309":1}}],["返回服务器域名",{"2":{"271":1}}],["返回一个标识",{"2":{"309":2}}],["返回一个可以被",{"2":{"206":1}}],["返回一个新的",{"2":{"206":1}}],["返回一个数组",{"2":{"206":1,"309":2}}],["返回一个",{"2":{"198":1,"206":1}}],["返回结束位置",{"2":{"190":2}}],["返回字符数据改变的上一个字符",{"2":{"160":1,"755":1}}],["返回属性改变的上一个值",{"2":{"160":1,"755":1}}],["返回属性名的命名空间",{"2":{"156":1,"751":1}}],["返回后一天结点",{"2":{"156":1,"751":1}}],["返回前一个结点",{"2":{"156":1,"751":1}}],["返回",{"2":{"137":1,"156":2,"198":1,"271":3,"669":1,"751":2}}],["返回选区所包含的文本内容",{"2":{"114":1}}],["返回索引对应的选区中的",{"2":{"114":1}}],["返回定时器状态",{"2":{"95":1}}],["详见源码",{"2":{"95":1}}],["如下",{"2":{"857":2}}],["如今版本的默认策略",{"2":{"354":1}}],["如",{"2":{"196":1,"419":1,"446":1}}],["如果支持",{"2":{"859":1}}],["如果仍然想用更高版本的",{"2":{"857":2}}],["如果没有指定规则",{"2":{"838":1}}],["如果没有",{"2":{"838":1}}],["如果需要使用交叉类型",{"2":{"837":1}}],["如果一个或多个计时器已准备就绪",{"2":{"824":1}}],["如果一个脚本来自不同的域",{"2":{"404":1}}],["如果脚本未被",{"2":{"824":1}}],["如果脚本被",{"2":{"819":1,"824":1}}],["如果绑定为",{"2":{"808":1}}],["如果绑定的对象为",{"2":{"808":1}}],["如果函数没有返回其他对象",{"2":{"804":1}}],["如果指定",{"2":{"701":1,"857":2}}],["如果等号左边不是可遍历对象",{"2":{"664":1}}],["如果相等",{"2":{"582":1}}],["如果放不下",{"2":{"433":1}}],["如果两个",{"2":{"416":1}}],["如果从一个页面打开了另一个新页面",{"2":{"354":1}}],["如果该框没有基线",{"2":{"326":1}}],["如果不能推断参数类型",{"2":{"866":1}}],["如果不包括散列",{"2":{"271":1}}],["如果不对上一页数据节点处理",{"2":{"187":1}}],["如果嵌入的内容没有加载完触发",{"2":{"224":1}}],["如果文档中有选择的文字会优先复制该选择的文字",{"2":{"195":2}}],["如果上述描述不对",{"2":{"192":1}}],["如果编译成功",{"2":{"170":1}}],["如果为",{"2":{"160":2,"755":2}}],["如果你去开发你会怎么做",{"2":{"111":1}}],["如果设置了",{"2":{"95":1}}],["如何定义",{"2":{"867":1}}],["如何创建泛型",{"2":{"866":1}}],["如何计算响应头中",{"2":{"494":1}}],["如何配置",{"0":{"421":1}}],["如何衡量",{"0":{"380":1}}],["如何实现复制",{"0":{"193":1},"1":{"194":1,"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1,"206":1}}],["如何实现一个简易热更新",{"2":{"99":1}}],["如何通过时刻变化的滚动高度计算出替换的节点",{"2":{"188":1}}],["如何通信并刷新浏览器",{"2":{"106":1}}],["如何处理过渡或者动画",{"2":{"168":1}}],["如何注入到",{"0":{"146":1},"1":{"147":1}}],["如何写一个",{"2":{"144":1}}],["如何使用额外的",{"2":{"132":1}}],["如何面对项目中的一些痛点",{"2":{"57":1}}],["如何设计一个项目",{"2":{"57":1}}],["如何快速定位并解决问题",{"2":{"40":1}}],["如何及时发现问题",{"2":{"40":1}}],["如何搭建一个前端监控体系",{"2":{"39":1}}],["如何进行模块间依赖的解耦",{"0":{"35":1}}],["如何系统化",{"2":{"22":1}}],["参与折叠的外边距包含负值",{"2":{"583":1}}],["参考链接",{"2":{"552":1}}],["参考文件",{"2":{"106":1}}],["参考目录",{"2":{"106":4}}],["参考",{"2":{"106":2}}],["参考现有的技术方案",{"2":{"59":1}}],["参数名字可以不一致",{"2":{"860":2}}],["参数或者属性可以为",{"2":{"837":1}}],["参数字节",{"2":{"815":2}}],["参数传递也是此行为",{"2":{"802":2}}],["参数是否为",{"2":{"671":1}}],["参数指定的这一版之后",{"2":{"522":1}}],["参数相同",{"2":{"218":1}}],["参数为字符串时",{"2":{"268":1}}],["参数为",{"2":{"210":2}}],["参数属性介绍",{"2":{"160":1,"755":1}}],["参数",{"2":{"95":2,"257":1,"263":1,"266":1,"803":1,"810":2,"815":1}}],["覆盖指定文件配置",{"2":{"239":1}}],["覆盖",{"2":{"95":1,"763":1}}],["属性指向哪里",{"2":{"848":1}}],["属性指向函数",{"2":{"764":1}}],["属性会触发",{"2":{"763":1}}],["属性共享问题",{"2":{"762":1}}],["属性提供值",{"2":{"701":1}}],["属性和",{"2":{"701":1}}],["属性时",{"2":{"672":2}}],["属性类",{"2":{"666":1}}],["属性值必须有",{"2":{"701":1}}],["属性值提供",{"2":{"701":1}}],["属性值严格等于",{"2":{"664":1}}],["属性值默认为",{"2":{"590":1}}],["属性应用在元素的",{"2":{"639":1}}],["属性选择器",{"0":{"608":1}}],["属性取值",{"0":{"598":1,"603":1}}],["属性创建",{"0":{"575":1}}],["属性的所有表格单元格",{"2":{"575":1}}],["属性的",{"2":{"394":1}}],["属性后",{"2":{"326":1}}],["属性不为",{"2":{"326":1,"575":1}}],["属性修改之后触发",{"2":{"229":1}}],["属性名",{"2":{"156":1,"751":1}}],["属性",{"0":{"639":1,"642":1},"1":{"640":1,"641":1},"2":{"95":1,"167":3,"221":1,"222":1,"271":1,"402":1,"589":1,"641":1,"666":4,"717":1,"763":1,"776":2,"864":1}}],["配置站点",{"2":{"857":4}}],["配置为",{"2":{"857":2}}],["配置路径",{"2":{"857":2}}],["配置参数",{"0":{"857":1}}],["配置中的",{"2":{"846":1}}],["配置忽略文件",{"0":{"252":1}}],["配置项目文件结构",{"0":{"250":1}}],["配置举例",{"0":{"245":1}}],["配置规则",{"0":{"243":1},"1":{"244":1,"245":1,"246":1,"247":1}}],["配置插件",{"0":{"242":1}}],["配置文件",{"2":{"236":1,"421":1,"424":1}}],["配置的",{"2":{"139":1}}],["配置",{"0":{"134":1,"236":1,"832":1,"850":1},"2":{"95":2,"424":1,"841":1,"850":1}}],["配合",{"2":{"65":1,"104":1,"842":1}}],["配合客户端将资源和数据进行离线",{"2":{"51":1}}],["配合客户端进行资源预请求和预加载",{"2":{"51":1}}],["执行其回调函数",{"2":{"828":1}}],["执行所提供的回调的阈值",{"2":{"821":1}}],["执行与",{"2":{"819":1,"824":1}}],["执行延迟到下一个循环迭代的",{"2":{"819":1,"822":1}}],["执行上下文",{"2":{"796":1}}],["执行构造函数的代码",{"2":{"761":1}}],["执行过程中如果遇到微任务",{"2":{"733":1}}],["执行一个宏任务",{"2":{"733":1}}],["执行栈中所有同步任务执行完毕",{"2":{"733":1}}],["执行多次",{"2":{"681":2}}],["执行到一半",{"2":{"669":1}}],["执行文件",{"2":{"425":1}}],["执行复制命令",{"2":{"195":2}}],["执行字节码过程中",{"2":{"174":1}}],["执行代码",{"0":{"171":1,"174":1},"1":{"172":1,"173":1,"174":1}}],["执行",{"2":{"147":2,"351":1,"737":2,"797":2}}],["执行命令必须的一个值",{"2":{"112":2}}],["执行继续等待时间",{"2":{"95":1}}],["执行等待时间",{"2":{"95":1}}],["执行函数",{"2":{"95":1,"303":1}}],["执行逻辑",{"2":{"24":1}}],["接入",{"2":{"511":1}}],["接受请求的",{"2":{"718":1}}],["接受多个进程传递过来的",{"2":{"367":1}}],["接受",{"2":{"353":1}}],["接多个分支或者分支的",{"2":{"257":1}}],["接收绑定对象和",{"2":{"803":2}}],["接收一个字符串作为参数",{"2":{"775":1}}],["接收到响应时",{"2":{"521":1}}],["接收到客户机的",{"2":{"422":1}}],["接收其他客户端套接字的连接请求",{"2":{"487":1}}],["接收返回消息",{"2":{"480":1}}],["接收方",{"2":{"419":2,"491":2}}],["接收多少秒",{"2":{"400":1}}],["接收四个参数",{"2":{"309":1}}],["接收两个参数",{"2":{"219":1,"762":1}}],["接收",{"2":{"213":1,"399":1,"422":1}}],["接收三个参数",{"2":{"95":1,"112":2,"218":1,"268":2,"303":1}}],["接下来重新改一下代码",{"2":{"168":2}}],["接下来引入transitionend事件",{"2":{"168":2}}],["接下来介绍一下",{"2":{"168":1}}],["接口之间可以相互继承",{"2":{"860":1}}],["接口继承类",{"2":{"860":1}}],["接口继承",{"2":{"860":1}}],["接口实现",{"2":{"860":1}}],["接口",{"2":{"860":1}}],["接口可以重复定义",{"2":{"837":1}}],["接口可以继承类的属性与方法",{"2":{"860":1}}],["接口可以继承",{"2":{"837":1}}],["接口和协议的概念",{"2":{"483":1}}],["接口协议",{"2":{"67":1}}],["接口耗时等各项数据统计",{"2":{"41":1}}],["接口测试",{"0":{"25":1}}],["剩余时间执行一次",{"2":{"92":2}}],["\\t\\tipfilter",{"2":{"428":2}}],["\\t\\tid",{"2":{"428":2}}],["\\t\\troot",{"2":{"428":2}}],["\\t\\tmaxage",{"2":{"428":2}}],["\\tconfiguration",{"2":{"428":2}}],["\\tstatus",{"2":{"428":14}}],["\\tmember",{"2":{"428":4}}],["\\tmedia",{"2":{"428":14}}],["\\tmax",{"2":{"424":2}}],["\\tether",{"2":{"428":14}}],["\\tnd6",{"2":{"428":14}}],["\\tnext",{"2":{"424":2}}],["\\tinet6",{"2":{"428":14}}],["\\tinet",{"2":{"428":4}}],["\\tfilename",{"2":{"424":2}}],["\\trange",{"2":{"424":2}}],["\\tdefault",{"2":{"424":2}}],["\\toptions=63",{"2":{"428":2}}],["\\toptions=460",{"2":{"428":4}}],["\\toptions=400",{"2":{"428":8}}],["\\toptions=1203",{"2":{"428":2}}],["\\toption",{"2":{"424":6}}],["\\t",{"2":{"92":2,"428":4}}],["再来看看一个具体的元素",{"2":{"715":1}}],["再来看看",{"2":{"715":1}}],["再执行",{"2":{"669":1}}],["再执行一次",{"2":{"91":1}}],["再使用公钥对数字签名解密",{"2":{"566":1}}],["再次触发执行",{"2":{"78":1}}],["见下",{"2":{"80":1}}],["两者结合就实现了javascript的变量提升和块级作用域",{"2":{"780":1}}],["两者都应该依赖于抽象接口",{"2":{"35":1}}],["两边都会发生转换",{"2":{"723":1}}],["两个参数都要操作⚠️⚠️⚠️",{"2":{"672":2}}],["两个手指距离变化",{"2":{"234":1}}],["两种表现形式",{"2":{"859":1}}],["两种数据格式",{"2":{"718":1}}],["两种形式",{"2":{"641":1}}],["两种状态",{"2":{"168":1}}],["两大区别",{"2":{"227":1}}],["两块区域重复利用",{"2":{"182":1}}],["两秒之后",{"2":{"78":1}}],["两秒之后执行",{"2":{"75":1}}],["结束位置的每一项偏移高度进行预算",{"2":{"191":2}}],["结束",{"2":{"106":1}}],["结束顶点",{"2":{"15":1}}],["结合的动画",{"2":{"168":1}}],["结合",{"2":{"73":1,"545":1}}],["防止出现多种情况",{"2":{"872":1}}],["防止渲染结果不可预期",{"2":{"730":2}}],["防止",{"2":{"402":1}}],["防止栈溢出",{"2":{"55":1}}],["防抖",{"0":{"74":1},"1":{"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1}}],["防抖节流",{"0":{"73":1},"1":{"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1,"92":1,"93":1,"94":1,"95":1,"96":1,"97":1,"98":1}}],["一起使用",{"2":{"874":1}}],["一起打包到",{"2":{"106":1}}],["一一对应",{"2":{"870":1}}],["一直调用",{"2":{"820":1}}],["一直触发事件未大于设置的时间",{"2":{"91":1}}],["一直触发事件大于设置的时间",{"2":{"85":1,"88":1,"91":1}}],["一直触发事件大于定时时间",{"2":{"81":1}}],["一种带内信号的转义序列标准",{"2":{"813":1}}],["一种数据结构",{"2":{"785":1}}],["一组构造函数组成",{"2":{"671":1}}],["一段时间",{"2":{"669":1}}],["一般用于表格表示第几列中的元素指定的特殊样式",{"2":{"616":1}}],["一对套接字",{"2":{"487":1}}],["一样",{"2":{"452":1}}],["一级域名",{"2":{"397":1}}],["一级标题名称",{"2":{"337":2}}],["一级标题",{"2":{"337":2}}],["一步一个脚印",{"2":{"324":1}}],["一些关闭的回调函数",{"2":{"826":1}}],["一些常见的文档编辑格式以及前端文档编辑器",{"2":{"335":1}}],["一些新的规则集",{"2":{"251":1}}],["一些浏览器实现了",{"2":{"763":1}}],["一些浏览器可以支持",{"2":{"196":1}}],["一些浏览器在不安全模式下",{"2":{"196":1}}],["一次排列",{"2":{"577":1}}],["一次",{"2":{"234":1,"877":2}}],["一次性匹配所有结果",{"2":{"666":1}}],["一次性",{"2":{"70":1}}],["一个对象既可以表现为函数形式",{"2":{"860":1}}],["一个进程中可以有多个线程",{"2":{"725":1}}],["一个父元素下所有文本节点合并成一个节点",{"2":{"716":1}}],["一个参数⚠️⚠️⚠️",{"2":{"672":2}}],["一个文件同时出现",{"2":{"672":2}}],["一个选择器中只能使用一个伪元素",{"2":{"632":1}}],["一个容器全部为浮动元素时",{"2":{"602":1}}],["一个块元素内存在内联元素",{"2":{"577":1}}],["一个接口处于网络层和数据链路层之间",{"2":{"483":1}}],["一个网络通向其他网络的",{"2":{"465":1}}],["一个网络包从一个地方传到另一个地方",{"2":{"432":1}}],["一个或多个带有",{"2":{"459":1}}],["一个或多个模块",{"2":{"64":1}}],["一个默认网关",{"2":{"447":1}}],["一个子网掩码",{"2":{"447":1}}],["一个函数返回解析的",{"2":{"309":2}}],["一个结点作为子节点插入到另一节点时触发",{"2":{"229":1}}],["一个完整的垃圾回收任务拆分成很小的任务",{"2":{"185":1}}],["一旦在当前轮询阶段完成",{"2":{"827":1}}],["一旦轮询队列为空",{"2":{"824":1}}],["一旦绑定为",{"2":{"803":2}}],["一旦抛出错误",{"2":{"669":1}}],["一旦事件处理程序执行完成",{"2":{"221":1}}],["一旦垃圾回收算法执行时间过长",{"2":{"185":1}}],["一旦执行垃圾回收算法",{"2":{"184":1}}],["一经分配内存",{"2":{"178":1}}],["反转都能获取到值",{"2":{"865":1}}],["反向选择",{"2":{"838":1}}],["反码",{"0":{"293":1},"2":{"294":1}}],["反射型",{"0":{"70":1}}],["反馈问题排查",{"2":{"42":1}}],["三斜杠指令",{"2":{"854":1}}],["三元运算符",{"2":{"744":1}}],["三组随机数",{"2":{"560":1}}],["三类地址划分为若干子网",{"2":{"546":1}}],["三类地址包含的主机数量",{"2":{"429":1}}],["三次对话的确认机制",{"2":{"481":1}}],["三级标题名称",{"2":{"337":2}}],["三级标题",{"2":{"337":2}}],["三方库",{"2":{"299":1}}],["三个分支",{"2":{"257":1}}],["三个参数必须一样",{"2":{"218":1}}],["三个节点呈左右节点分布",{"2":{"8":1}}],["三个节点呈左节点形式",{"2":{"8":1}}],["三个节点呈右左节点分布",{"2":{"8":1}}],["三个节点呈右节点形式",{"2":{"8":1}}],["三种方法可以缓存",{"2":{"461":1}}],["三种状态",{"2":{"168":1}}],["三种类型",{"2":{"69":1,"156":1,"751":1}}],["质量维度",{"2":{"67":1}}],["复用",{"2":{"466":1}}],["复制失败",{"2":{"200":2,"201":2}}],["复制成功",{"2":{"200":2,"201":2}}],["复制的类型",{"2":{"198":1}}],["复制的文字",{"2":{"195":2}}],["复制",{"2":{"195":2}}],["复制到空闲区域",{"2":{"182":1}}],["复制到剪贴板",{"2":{"113":1}}],["复合事件",{"0":{"116":1,"228":1}}],["复杂选择",{"2":{"115":1}}],["复杂的位运算操作",{"0":{"5":1}}],["复盘",{"2":{"67":1}}],["交叉类型",{"2":{"863":2}}],["交集",{"2":{"863":2}}],["交还执行权",{"2":{"669":1}}],["交通枢纽",{"2":{"480":1}}],["交换机",{"0":{"464":1}}],["交换式以太网",{"2":{"463":1}}],["交互",{"2":{"67":1}}],["交并集",{"2":{"17":1}}],["预先确定所有变量和函数的位置",{"2":{"777":1}}],["预启动执行环境",{"2":{"423":1}}],["预加载",{"2":{"402":1}}],["预留给能够将连接改为隧道方式的代理服务器",{"2":{"459":1}}],["预留条数",{"2":{"191":2}}],["预留",{"2":{"190":2}}],["预期不再需要每个mutationrecord",{"2":{"162":1,"757":1}}],["预期功能",{"2":{"67":1}}],["预计工作量和分工排期",{"2":{"67":1}}],["预热",{"2":{"51":1}}],["查找到为止",{"2":{"848":1,"849":1}}],["查找作用域",{"0":{"773":1}}],["查找的目的是为了给变量赋值",{"2":{"770":1}}],["查询",{"2":{"770":2}}],["查询到作用域",{"2":{"769":1}}],["查询属性",{"2":{"149":2}}],["查询时间",{"2":{"50":1}}],["查看调用栈自行分析",{"2":{"66":1}}],["在类组件中获取",{"2":{"877":2}}],["在具体的",{"2":{"877":1}}],["在声明模块中添加模板",{"2":{"870":2}}],["在子类的静态方法使用",{"2":{"864":1}}],["在事件循环的接下来的",{"2":{"829":1}}],["在同一个阶段立即执行",{"2":{"829":1}}],["在当前操作完成后处理",{"2":{"828":1}}],["在执行上下文创建以后",{"2":{"786":1}}],["在严格模式中",{"2":{"777":1}}],["在引用对象",{"2":{"738":1}}],["在多线程不加锁的情况下",{"2":{"731":1}}],["在发生粘贴操作时触发",{"2":{"718":1}}],["在发生粘贴操作前触发",{"2":{"718":1}}],["在发生剪切操作时触发",{"2":{"718":1}}],["在发生剪切操作前触发",{"2":{"718":1}}],["在发生复制操作时触发",{"2":{"718":1}}],["在发生复制操作前触发",{"2":{"718":1}}],["在没有滚动条的情况下",{"2":{"718":2}}],["在静态方法中指向父类",{"2":{"670":1}}],["在普通方法中",{"2":{"670":1}}],["在它前面的元素的浮动",{"2":{"575":1}}],["在局部局域网上传输数据帧",{"2":{"477":1}}],["在数据传输中设置和维护计算机网络中两台计算机之间的通信连接",{"2":{"473":1}}],["在任何物理介质中允许两个或多个在传输系统中的终端之间传播信息的系统标准",{"2":{"469":1}}],["在页面转移到后台后",{"2":{"380":1}}],["在页面不可见的地方进行提前渲染",{"2":{"52":1}}],["在文本节点的值改变之后触发",{"2":{"229":1}}],["在节点从其父节点移除时触发",{"2":{"229":1}}],["在解释执行字节码的同时",{"2":{"174":1}}],["在解释型语言的解释过程中",{"2":{"170":1}}],["在编译阶段会进行性能优化",{"2":{"777":1}}],["在编译型语言的编译过程中",{"2":{"170":1}}],["在编译中作缓存变量处理",{"2":{"138":1}}],["在重绘一次中是不能完成动画过渡的",{"2":{"168":1}}],["在回调执行之后",{"2":{"162":1,"757":1}}],["在回调的微任务异步执行时",{"2":{"162":1,"757":1}}],["在模板处理之后",{"2":{"139":2}}],["在线支付",{"2":{"530":1}}],["在线协同",{"0":{"120":1}}],["在线文档如何缓存数据",{"2":{"126":1}}],["在线文档",{"2":{"110":1}}],["在向输入字段中插入新字符时触发",{"2":{"116":1}}],["在",{"2":{"116":2,"138":1,"252":1,"312":1,"316":2,"320":1,"396":1,"637":1,"804":1}}],["在到达选区起点位置之前跳过的",{"2":{"114":1}}],["在开发+调试模式下",{"2":{"66":1}}],["工厂模式",{"2":{"761":1}}],["工厂函数提供参数",{"2":{"303":1}}],["工作于应用层",{"2":{"465":1}}],["工作于",{"2":{"464":1}}],["工作过程",{"0":{"425":1,"449":1}}],["工作",{"0":{"317":1,"321":1}}],["工作区保持不变",{"2":{"263":1}}],["工作流要求高",{"2":{"65":1}}],["工具",{"2":{"59":1}}],["工具的熟悉程度",{"2":{"59":1}}],["体积小",{"2":{"173":1}}],["体积大",{"2":{"65":1}}],["体积代码量小",{"2":{"65":1}}],["单独使用",{"2":{"844":2}}],["单独使用无效",{"2":{"198":1}}],["单线程",{"0":{"731":1},"2":{"730":1}}],["单线程与多线程",{"2":{"725":1}}],["单后续的请求应仍使用原始的",{"2":{"525":1}}],["单尚未处理",{"2":{"509":1}}],["单个网段最大主机数",{"2":{"440":1}}],["单进程模式",{"2":{"354":1}}],["单精度",{"0":{"274":1}}],["单页应用",{"2":{"269":1}}],["单行",{"2":{"246":2}}],["单击鼠标右键调出上下文菜单",{"2":{"230":1}}],["单击鼠标按钮",{"2":{"226":1}}],["单包管理",{"2":{"65":1}}],["单元测试",{"0":{"26":1}}],["封装了",{"2":{"422":1}}],["封装",{"2":{"65":1,"837":1}}],["封装基础库",{"2":{"24":1}}],["异步任务触发条件达成",{"2":{"733":1}}],["异步",{"2":{"724":1,"730":1,"820":1}}],["异步应用",{"2":{"669":1}}],["异步脚本一定会在",{"2":{"312":1}}],["异步脚本",{"2":{"312":1}}],["异步操作",{"2":{"199":1}}],["异步回调和记录队列",{"0":{"162":1,"757":1}}],["异步加载模块",{"2":{"65":1}}],["异常的递归调用",{"2":{"55":1}}],["异常",{"0":{"769":1},"2":{"42":1,"770":1}}],["拆组件库",{"2":{"65":1}}],["拆公共库",{"2":{"65":1}}],["拆模块",{"2":{"65":1}}],["拆",{"2":{"65":1}}],["协调控制其他子进程",{"2":{"728":1}}],["协调图片解码",{"2":{"352":1}}],["协程",{"2":{"669":4}}],["协议中没有定义任何",{"2":{"501":1}}],["协议定义了扩展",{"2":{"489":1}}],["协议转换器",{"2":{"465":1}}],["协议需要针对不同的网络进行不同的设置",{"2":{"447":1}}],["协议氛围客户端服务器端",{"2":{"423":1}}],["协议",{"0":{"435":1,"478":1},"1":{"479":1,"480":1,"481":1,"482":1,"483":1},"2":{"271":1,"393":1,"475":1,"480":4,"481":3}}],["协商技术细节",{"2":{"64":1}}],["协作效率",{"2":{"61":1}}],["找对应的模块负责人进行风险评估以及代码",{"2":{"64":1}}],["需支持此配置",{"2":{"857":2}}],["需验证弹出网页浏览器界面",{"2":{"511":1}}],["需要iterator对象",{"2":{"664":1}}],["需要人工验证",{"2":{"568":1}}],["需要客户端进一步的操作才能完成请求",{"2":{"517":1}}],["需要很长时间才能完成请求",{"2":{"504":1}}],["需要继续等待服务器处理",{"2":{"501":1}}],["需要请求体",{"2":{"461":1}}],["需要配置",{"2":{"424":1}}],["需要在容器滚动时",{"2":{"188":1}}],["需要垃圾回收的对象",{"2":{"181":1}}],["需要强制引发回流",{"2":{"168":1}}],["需要与webpack源码配合起来",{"2":{"130":1}}],["需要认真的思考",{"2":{"22":1}}],["需求开发",{"2":{"64":1}}],["并集",{"2":{"838":1,"863":2}}],["并继续检查阶段以执行哪些被调度的脚本",{"2":{"824":1}}],["并到",{"2":{"819":1}}],["并有一定的规则来赋予这些标识符的访问权限",{"2":{"766":1}}],["并加上优先权标志",{"2":{"718":1}}],["并不是所有元素都支持innerhtml",{"2":{"717":1}}],["并不指向硬盘驱动器上的某个位置",{"2":{"317":1}}],["并得出信息摘要",{"2":{"565":1}}],["并生成随机数",{"2":{"559":1,"563":1}}],["并生成抽象语法树",{"2":{"170":1}}],["并接受",{"2":{"506":1}}],["并复用",{"2":{"488":1}}],["并把服务器端套接字的描述发送给客户端",{"2":{"487":1}}],["并将通过",{"2":{"503":1}}],["并将",{"2":{"422":1}}],["并将其合成",{"2":{"353":1}}],["并进行合成",{"2":{"367":1}}],["并先于",{"2":{"311":1}}],["并保存起来以供下次使用",{"2":{"174":1}}],["并清空队列本身",{"2":{"163":1,"758":1}}],["并且可以分配给每种类型",{"2":{"859":1}}],["并且可能在处理发生时被禁止",{"2":{"509":1}}],["并且执行一次",{"2":{"713":2}}],["并且溢出",{"2":{"583":2}}],["并且无法支持其对任何资源的请求",{"2":{"540":1}}],["并且应该使用单独的",{"2":{"521":1}}],["并且将来对此资源的引用都应该使用本响应应返回的若干个",{"2":{"519":1}}],["并且客户端应继续发送请求体",{"2":{"502":1}}],["并且生成新的提交记录",{"2":{"260":1}}],["并且支持运行",{"2":{"141":1}}],["并且实时监听编译模板",{"2":{"137":1}}],["并维护文档",{"2":{"64":1}}],["并要求掌握熟悉模块的细节",{"2":{"64":1}}],["并行计算的方式",{"2":{"53":1}}],["事件在这个阶段发出",{"2":{"826":1}}],["事件在某一个元素触发多少次",{"2":{"226":1}}],["事件队列",{"2":{"733":2}}],["事件触发线程管理一个任务队列",{"2":{"733":1}}],["事件触发线程",{"2":{"730":1}}],["事件循环中的单独阶段运行的特殊及时器",{"2":{"825":1}}],["事件循环将检查已达到阈值的计时器",{"2":{"824":1}}],["事件循环将循环访问回调队列并同步执行他们",{"2":{"824":1}}],["事件循环将循环访问回调队列并执行他们",{"2":{"819":1}}],["事件循环图",{"2":{"820":1}}],["事件循环",{"0":{"817":1},"1":{"818":1,"819":1,"820":1,"821":1,"822":1,"823":1,"824":1,"825":1,"826":1,"827":1,"828":1,"829":1,"830":1},"2":{"724":1}}],["事件名",{"2":{"712":1}}],["事件名处理的函数参数必须一致",{"2":{"218":1}}],["事件监听",{"2":{"669":1}}],["事件依然可行",{"2":{"654":1}}],["事件调度",{"2":{"351":1}}],["事件等",{"2":{"349":1,"350":1}}],["事件不一定之前还是之后",{"2":{"312":1}}],["事件之前执行",{"2":{"312":1}}],["事件执行",{"2":{"311":2}}],["事件是冒泡的",{"2":{"230":1}}],["事件是否冒泡",{"2":{"221":1}}],["事件的类型",{"2":{"222":1}}],["事件的目标",{"2":{"222":1}}],["事件处理等",{"2":{"729":1}}],["事件处理函数",{"2":{"712":1}}],["事件处理函数中",{"2":{"222":1}}],["事件处理程序会在全局作用域内执行",{"2":{"219":2}}],["事件处理程序名称和事件处理程序函数",{"2":{"219":1}}],["事件处理程序",{"0":{"215":1,"216":1,"219":1},"1":{"216":1,"217":1,"218":1,"219":1}}],["事件类型",{"2":{"221":1}}],["事件目标元素",{"2":{"221":1}}],["事件函数处理内部",{"2":{"221":1}}],["事件捕获",{"0":{"214":1}}],["事件开始时由最具体的元素",{"2":{"213":1}}],["事件冒泡",{"0":{"213":1}}],["事件流",{"0":{"212":1},"1":{"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1,"225":1,"226":1,"227":1,"228":1,"229":1,"230":1,"231":1,"232":1,"233":1,"234":1},"2":{"212":1}}],["事件流机制",{"2":{"139":1}}],["事件对象中",{"2":{"222":1,"718":1}}],["事件对象",{"0":{"220":1,"221":1,"222":1,"223":1},"1":{"221":1,"222":1,"224":1,"225":1,"226":1,"227":1,"228":1,"229":1,"230":1,"231":1,"232":1,"233":1,"234":1},"2":{"195":2}}],["事件中含有",{"2":{"195":2}}],["事件中有",{"2":{"168":1}}],["事件",{"0":{"231":1},"2":{"168":4,"195":4,"269":2,"270":1,"819":1,"824":1}}],["事件通信",{"2":{"63":1}}],["事件驱动",{"2":{"35":1}}],["明确每个模块负责的工作和提供的功能",{"2":{"63":1}}],["梳理各个模块的职责",{"2":{"63":1}}],["维护的整个过程",{"2":{"61":1}}],["贯穿项目设计",{"2":{"61":1}}],["提前知道元素的尺寸",{"2":{"661":1}}],["提高",{"2":{"546":1}}],["提高执行效率",{"2":{"174":1}}],["提示类",{"0":{"343":1}}],["提交表单",{"2":{"718":1}}],["提交表单或者上传文件",{"2":{"453":1}}],["提交记录",{"2":{"257":1}}],["提交代码过程",{"2":{"60":1}}],["提供插件相应的信息",{"2":{"857":2}}],["提供的大多数函数以及自己创建的函数都能通过",{"2":{"803":1}}],["提供一种优雅的方式来隐式传递一个对象的引用",{"2":{"796":1}}],["提供一个执行js环境",{"2":{"147":2}}],["提供参数",{"2":{"669":1}}],["提供值",{"2":{"668":1}}],["提供键值对集合",{"2":{"668":1}}],["提供为应用软件而设的接口",{"2":{"471":1}}],["提供与文档或者元素加载状态有关的信息",{"2":{"230":1}}],["提供给",{"2":{"198":1}}],["提出问题",{"2":{"168":1}}],["提测",{"2":{"67":1}}],["提升开发效率",{"2":{"61":1}}],["提升系统质量",{"2":{"61":1}}],["提升计算效率",{"2":{"53":1}}],["提升页面交互和渲染的流畅度",{"2":{"52":1}}],["提升浏览器渲染效率",{"2":{"52":1}}],["提升并发请求数量",{"2":{"50":1}}],["提升资源请求速度",{"2":{"50":1}}],["团队成员是否有倾向的框架",{"2":{"59":1}}],["团队成员对现有框架",{"2":{"59":1}}],["团队现有的技术栈",{"2":{"59":1}}],["团队技术栈",{"2":{"59":1}}],["团队规模",{"2":{"59":1}}],["多余属性检查",{"2":{"860":1}}],["多层",{"2":{"738":1}}],["多线程需要加锁",{"2":{"731":1}}],["多用于移动端",{"2":{"712":1}}],["多次加载只加载一次",{"0":{"681":1}}],["多次点击之后事件会重复监听",{"2":{"168":1}}],["多列容器",{"2":{"575":1}}],["多状态",{"2":{"515":1}}],["多播地址的最高位必须为",{"2":{"444":1}}],["多播地址",{"2":{"444":1}}],["多播组号",{"2":{"429":1}}],["多个参数",{"2":{"861":1}}],["多个文件可以使用",{"2":{"853":1}}],["多个exports导出时",{"2":{"672":2}}],["多个",{"2":{"348":1,"876":1}}],["多个异步脚本先后顺序不一致执行",{"2":{"312":1}}],["多个延迟脚本不一定会按照顺序执行",{"2":{"311":1}}],["多个延迟脚本按顺序执行",{"2":{"311":1}}],["多个导出",{"2":{"305":2,"306":2}}],["多个请求合并",{"2":{"50":1}}],["多少位补位规则",{"2":{"208":2}}],["多展示两条数据",{"2":{"191":2}}],["多监听改变",{"0":{"158":1,"753":1}}],["多包管理",{"2":{"65":1}}],["多人协作与团队规范",{"0":{"60":1}}],["多人协作",{"2":{"59":1}}],["功能",{"0":{"547":1},"1":{"548":1,"549":1}}],["功能交互",{"2":{"59":1}}],["功能模块",{"2":{"33":1}}],["搭建一个项目",{"2":{"58":1}}],["代价较大",{"2":{"725":1}}],["代价比较高",{"2":{"653":1}}],["代价有点大",{"2":{"132":1}}],["代表父类的构造函数",{"2":{"864":1}}],["代表请求已成功被服务器接收",{"2":{"506":1}}],["代表页面处于不可交互状态的耗时",{"2":{"56":1}}],["代理来保护连接",{"2":{"459":1}}],["代替",{"2":{"196":1,"592":2,"593":2,"718":1,"857":2,"859":1,"872":1}}],["代际假说",{"2":{"178":1}}],["代码空间",{"0":{"789":1},"2":{"788":1}}],["代码的词法进行静态分析",{"2":{"777":1}}],["代码编译阶段就决定好",{"2":{"771":1}}],["代码生成",{"2":{"766":1}}],["代码获取跨域请求的响应",{"2":{"405":1}}],["代码",{"2":{"147":2,"252":1,"814":1,"815":1}}],["代码示例如下",{"2":{"147":2}}],["代码不能运行",{"2":{"143":2}}],["代码引入到",{"2":{"106":1}}],["代码执行",{"0":{"79":1}}],["代码实现",{"0":{"76":1,"82":1,"86":1,"89":1,"92":1},"2":{"806":1}}],["代码可维护性",{"2":{"65":1}}],["代码复用",{"2":{"65":1}}],["代码复用划分",{"2":{"37":1}}],["代码按需引入",{"2":{"65":1}}],["代码规范调整",{"2":{"64":1}}],["代码量",{"2":{"62":1}}],["代码发布过程",{"2":{"60":1}}],["代码流程规范",{"2":{"60":1}}],["代码构建与编译工具",{"2":{"58":1}}],["代码分割",{"2":{"50":1}}],["总以为能得到满意的结果",{"2":{"324":1}}],["总位数",{"2":{"283":1}}],["总的数据条数",{"2":{"191":2}}],["总的滚动高度",{"2":{"190":2}}],["总数据条数",{"2":{"190":2}}],["总高度",{"2":{"188":2}}],["总结一句话",{"2":{"324":1}}],["总结",{"0":{"567":1,"770":1,"786":1},"2":{"168":1,"326":1,"461":1}}],["总是被优先调用",{"2":{"827":1}}],["总是",{"2":{"156":1,"751":1}}],["总阻塞时间",{"2":{"56":1}}],["总复杂度等于量级最大的那段代码的复杂度",{"2":{"1":1}}],["浏览器有一个单独的线程用于处理",{"2":{"730":1}}],["浏览器界面显示",{"2":{"728":1}}],["浏览器包含了哪些进程",{"0":{"727":1},"1":{"728":1,"729":1}}],["浏览器是多进程的",{"0":{"726":1},"2":{"726":1}}],["浏览器是否应该为当前的命令用户界面提供一个布尔值",{"2":{"112":2}}],["浏览器支持flex布局",{"2":{"651":1}}],["浏览器支持的加密方式有多少种",{"2":{"552":1}}],["浏览器使用相同的",{"2":{"566":1}}],["浏览器使用公钥加密数据",{"2":{"557":1}}],["浏览器获取数字证书中的公钥",{"2":{"563":1}}],["浏览器保存公钥",{"2":{"559":1}}],["浏览器发送加密套件列表",{"2":{"559":1,"563":1}}],["浏览器发送非对称加密套件列表",{"2":{"556":1}}],["浏览器发送对称加密套件列表和",{"2":{"553":1}}],["浏览器和服务器都拥有",{"2":{"560":1}}],["浏览器和服务器都有",{"2":{"554":1}}],["浏览器和服务器使用相同的方法对",{"2":{"554":1}}],["浏览器和服务器返回确认信息",{"2":{"553":1,"556":1}}],["浏览器中用于双向通信的一种",{"2":{"488":1}}],["浏览器中直接运行",{"2":{"301":1}}],["浏览器渲染",{"0":{"370":1},"1":{"371":1,"372":1,"373":1,"374":1,"375":1}}],["浏览器将",{"2":{"369":1}}],["浏览器进程",{"0":{"349":1},"2":{"348":1}}],["浏览器内核",{"0":{"730":1},"2":{"347":1,"729":1}}],["浏览器",{"0":{"673":1},"1":{"674":1,"675":1,"676":1,"677":1,"678":1,"679":1,"680":1,"681":1,"682":1,"683":1,"684":1},"2":{"347":2}}],["浏览器架构",{"0":{"347":1}}],["浏览器后退前进按钮会触发",{"2":{"269":1}}],["浏览器路由需要配合服务端配置",{"2":{"269":1}}],["浏览器路由",{"0":{"269":1}}],["浏览器暂未实现",{"2":{"268":2}}],["浏览器生成的事件",{"2":{"221":1}}],["浏览器用户界面",{"2":{"166":1}}],["浏览器工作原理",{"2":{"166":1}}],["浏览器利用自身的",{"2":{"106":1}}],["浏览器已经创建了",{"2":{"106":1}}],["浏览器端",{"2":{"105":1,"106":2}}],["浏览器开始渲染的时间",{"2":{"56":1}}],["浏览器缓存",{"2":{"50":1,"55":1}}],["性能",{"0":{"777":1}}],["性能指标",{"0":{"378":1},"1":{"379":1,"380":1,"381":1,"382":1,"383":1,"384":1,"385":1,"386":1,"387":1,"388":1,"389":1,"390":1,"391":1,"392":1}}],["性能分析",{"0":{"164":1,"759":1}}],["性能分析指标",{"2":{"48":1}}],["性能优化不是太多",{"2":{"657":1}}],["性能优化",{"2":{"64":1}}],["性能数据",{"0":{"56":1}}],["避免两个块元素之间的外边距合并问题",{"2":{"576":1}}],["避免服务端收到非法的",{"2":{"493":1}}],["避免某些资源重复",{"2":{"359":1}}],["避免耦合",{"2":{"63":1}}],["避免复杂",{"2":{"55":1}}],["避免全局变量的使用",{"2":{"55":1}}],["避免存在内存泄漏",{"2":{"55":1}}],["将下一个字符标记符",{"2":{"833":1}}],["将在适当的时候阻塞",{"2":{"824":1}}],["将变量和块作用域写在哪里决定的",{"2":{"771":1}}],["将这个函数的作用域赋给新对象",{"2":{"761":1}}],["将这些元素的",{"2":{"380":1}}],["将回调事件放到任务队列中",{"2":{"733":1}}],["将事件放入到",{"2":{"730":1}}],["将渲染进程得到的内存中的",{"2":{"728":1}}],["将所有表单域重置为默认值",{"2":{"718":1}}],["将给定属性设置为相应的值",{"2":{"718":1}}],["将凭据发送到同源url",{"2":{"683":1}}],["将最重要的字节放在前面",{"2":{"671":1}}],["将最不重要的字节排在前面",{"2":{"671":1}}],["将子网掩码二进制和",{"2":{"548":1}}],["将一个大的",{"2":{"547":1}}],["将来的可能的需求而预留",{"2":{"530":1}}],["将网络表头",{"2":{"475":1}}],["将要发送到其他",{"2":{"419":1}}],["将光栅化之后的图块生成",{"2":{"366":1}}],["将整个页面按照一定规则",{"2":{"362":1}}],["将绘制的产物数据提交给",{"2":{"361":1}}],["将合成结果上屏",{"2":{"353":1}}],["将框的基线与父框的基线对齐",{"2":{"326":1}}],["将自动编辑",{"2":{"321":1}}],["将上一步生成的",{"2":{"172":1}}],["将源码拆成一个个",{"2":{"172":1}}],["将会生成一个可执行的文件",{"2":{"170":1}}],["将突变回调的执行委托给一个微任务",{"2":{"164":1,"759":1}}],["将选区折叠到起点位置",{"2":{"114":1}}],["将选区折叠到终点位置",{"2":{"114":1}}],["将选区折叠到指定节点中的相应的文本偏移位置",{"2":{"114":1}}],["将指定的",{"2":{"114":1}}],["将各个模块统一交由框架处理",{"2":{"63":1}}],["将项目研发与发布流程进行优化",{"2":{"61":1}}],["将结果缓存",{"2":{"53":1}}],["将计算过程提前",{"2":{"53":1}}],["将",{"2":{"53":1,"326":1,"545":1,"766":1}}],["将页面可见",{"2":{"51":1}}],["将页面尽快展示给用户看",{"2":{"51":1}}],["逻辑操作符类似",{"2":{"737":1}}],["逻辑或操作符",{"2":{"736":1}}],["逻辑链路控制子层",{"2":{"476":1}}],["逻辑提速",{"0":{"53":1}}],["逻辑控制模块",{"2":{"33":1}}],["操作的设计机制",{"0":{"819":1}}],["操作的实例对象",{"2":{"198":1}}],["操作符",{"2":{"837":1}}],["操作符毫无意义",{"2":{"761":1}}],["操作符来确定对象类型",{"2":{"761":1}}],["操作符共用",{"2":{"737":1}}],["操作剪贴板",{"2":{"718":1}}],["操作系统内置根证书",{"2":{"568":1}}],["操作范围",{"0":{"115":1}}],["操作富文本",{"0":{"113":1}}],["操作",{"0":{"716":1},"2":{"52":1,"113":1,"115":1,"312":1,"655":1,"715":1}}],["合成",{"2":{"361":1,"362":1,"363":1,"365":1,"366":1}}],["合成线程",{"0":{"352":1},"2":{"350":1}}],["合入主干过程",{"2":{"60":1}}],["合理使用缓存",{"2":{"55":1}}],["合理地使用",{"2":{"50":1}}],["合并",{"2":{"52":1,"853":1}}],["空类型",{"2":{"859":1}}],["空的非委托的对象",{"2":{"808":1}}],["空的块级元素",{"2":{"583":1}}],["空值合并操作符",{"2":{"735":1}}],["空格",{"0":{"612":1},"2":{"815":1}}],["空闲区域=对象区域",{"2":{"182":1}}],["空闲区域",{"2":{"182":1}}],["空闲时间将用户可能需要用到的资源进行获取并加载",{"2":{"52":1}}],["空间大小随着元素的显隐",{"2":{"655":1}}],["空间大小依然占据",{"2":{"654":1}}],["空间大",{"2":{"183":1}}],["空间角度",{"0":{"54":1},"1":{"55":1}}],["空间复杂度",{"0":{"2":1}}],["通知时间触发线程",{"2":{"730":1}}],["通知事件触发线程",{"2":{"730":1}}],["通知浏览器端",{"2":{"106":2}}],["通知浏览器更新页面",{"2":{"100":1}}],["通常是",{"2":{"718":1}}],["通常与伪元素搭配使用",{"2":{"641":1}}],["通常用于",{"2":{"459":1}}],["通过导入或全局变量访问库",{"2":{"844":1}}],["通过词法作用域可以预测代码在执行过程中如何查找变量",{"2":{"771":1}}],["通过作用域来查找变量的链条称为作用域链",{"2":{"770":1}}],["通过设置这个属性可以改变元素的滚动位置",{"2":{"718":2}}],["通过子网掩码将",{"2":{"546":1}}],["通过",{"2":{"357":1,"876":1}}],["通过实时滚动监听来对开始位置",{"2":{"189":1}}],["通过将",{"2":{"114":1}}],["通过将浏览帧率保持在",{"2":{"52":1}}],["通过自动化的方式",{"2":{"61":1}}],["通过项目设计和架构优化",{"2":{"61":1}}],["通过使用数据结构享元的方式",{"2":{"55":1}}],["通过合理使用浏览器",{"2":{"52":1}}],["通过预览的方式提前给用户观看",{"2":{"51":1}}],["通用组件",{"2":{"23":1}}],["差异化服务",{"2":{"51":1,"65":1}}],["技术之路也还很漫长",{"2":{"324":1}}],["技术优化",{"2":{"64":1}}],["技术选型的影响因素",{"0":{"59":1}}],["技术方案设计与选型",{"0":{"58":1},"1":{"59":1,"60":1}}],["技术",{"2":{"50":1,"53":1,"546":1}}],["技术框架",{"2":{"23":1}}],["后被排列在队列中",{"2":{"825":1}}],["后进先出",{"2":{"785":1}}],["后退",{"2":{"728":1}}],["后退一页",{"2":{"268":2}}],["后行断言",{"2":{"666":3}}],["后续请求应使用指定的代理",{"2":{"524":1}}],["后续遍历",{"2":{"21":1}}],["后",{"2":{"429":1}}],["后面是主机号",{"2":{"429":1}}],["后面的字符串",{"2":{"232":1}}],["后接",{"2":{"271":1}}],["后代选择器",{"2":{"612":1}}],["后代元素不会触发",{"2":{"226":1}}],["后代子元素不会触发",{"2":{"226":1}}],["后台编译器",{"2":{"174":1}}],["后台缓存",{"2":{"50":1}}],["缓存返回的",{"2":{"480":1}}],["缓存优化",{"2":{"147":1}}],["缓存",{"2":{"50":4,"461":1,"480":1}}],["使子元素自动成为flex盒子",{"2":{"651":1}}],["使用回调函数",{"2":{"877":2}}],["使用会出现多种不同的合并",{"2":{"874":1}}],["使用联合类型",{"2":{"872":1}}],["使用类泛型",{"2":{"866":1}}],["使用参数泛型类型的约束条件",{"2":{"866":1}}],["使用最广泛",{"2":{"761":1}}],["使用的时候",{"2":{"729":1}}],["使用双冒号",{"2":{"632":1}}],["使用其自有的私钥对信息摘要进行加密",{"2":{"565":1}}],["使用三组随机数生成对称密钥",{"2":{"560":1}}],["使用公钥加密",{"2":{"559":1,"563":1}}],["使用交换机",{"2":{"463":1}}],["使用分号空格",{"2":{"395":2}}],["使用注释规则",{"0":{"244":1}}],["使用插件配置规则配置如下",{"2":{"242":2}}],["使用location",{"2":{"232":1}}],["使用异步",{"2":{"198":1}}],["使用场景",{"2":{"168":1}}],["使用takerecords",{"2":{"163":1,"758":1}}],["使用到的compiler",{"2":{"136":1}}],["使用到的",{"0":{"136":1},"1":{"137":1,"138":1,"139":1}}],["使用模块解耦的技术方案",{"2":{"63":1}}],["使用开源",{"2":{"59":1}}],["使用更优的算法或数据结构",{"2":{"53":1}}],["使用更高运行效率的方式",{"2":{"53":1}}],["使用离屏渲染",{"2":{"52":1}}],["使用资源预加载",{"2":{"52":1}}],["使用秒看技术",{"2":{"51":1}}],["使用服务端渲染",{"2":{"51":1}}],["使用",{"0":{"188":1,"247":1},"2":{"50":1,"99":1,"329":1,"359":1,"554":1,"565":1,"575":1,"590":1,"592":2,"593":2,"658":1,"770":1,"804":1,"837":1,"842":1,"857":2,"865":1,"872":2,"877":1}}],["使用浏览器",{"2":{"50":1}}],["使系统更具模块化",{"2":{"35":1}}],["脚本仍具有运行完成的能力",{"2":{"828":1}}],["脚本使用",{"2":{"825":1}}],["脚本程序",{"2":{"730":1}}],["脚本执行",{"2":{"729":1}}],["脚本执行需要停顿",{"2":{"184":1}}],["脚本执行耗时",{"2":{"48":1}}],["脚本编写",{"2":{"24":1}}],["渲染完毕后",{"2":{"733":1}}],["渲染线程与",{"0":{"732":1}}],["渲染线程互斥",{"2":{"730":1}}],["渲染阻塞",{"2":{"381":1}}],["渲染进程",{"0":{"350":1,"730":1},"1":{"351":1,"352":1},"2":{"348":1,"356":1,"357":1,"358":1,"359":1,"360":1,"361":1,"362":1,"363":1,"364":1,"365":1,"366":1,"729":1,"730":1}}],["渲染引擎",{"2":{"347":1}}],["渲染流水线",{"0":{"346":1,"355":1},"1":{"347":1,"348":1,"349":1,"350":1,"351":1,"352":1,"353":1,"354":1,"355":1,"356":2,"357":2,"358":2,"359":2,"360":2,"361":2,"362":2,"363":2,"364":2,"365":2,"366":2,"367":2,"368":2}}],["渲染数据必须在可视区域内",{"2":{"191":1}}],["渲染数据",{"2":{"190":2,"191":2}}],["渲染",{"2":{"52":1}}],["渲染过程优化",{"0":{"52":1}}],["渲染耗时",{"2":{"48":1}}],["渲染层",{"2":{"33":1}}],["加至数据包",{"2":{"475":1}}],["加至数据以形成数据包",{"2":{"474":1}}],["加密信道建立",{"2":{"570":1}}],["加密后的密文就是数字签名",{"2":{"565":1}}],["加密方式",{"0":{"563":1}}],["加密数据",{"0":{"557":1,"560":1}}],["加密传输数据",{"2":{"554":1}}],["加密套件列表",{"2":{"552":1}}],["加密层",{"0":{"552":1},"1":{"553":1,"554":1,"555":1,"556":1,"557":1,"558":1,"559":1,"560":1,"561":1,"562":1,"563":1,"564":1,"565":1,"566":1,"567":1,"568":1}}],["加密",{"2":{"466":1}}],["加密服务器的链接",{"2":{"459":1}}],["加进位",{"2":{"294":2}}],["加上",{"2":{"266":1,"326":1}}],["加上总高度",{"2":{"188":2}}],["加速计支持",{"2":{"233":2}}],["加入crossorigin",{"2":{"683":1}}],["加入边框",{"2":{"650":1}}],["加入模板文件入口",{"2":{"143":2}}],["加入",{"2":{"139":1}}],["加入入口文件",{"2":{"137":1}}],["加入到编译当中",{"2":{"137":1}}],["加入缓存处理",{"2":{"132":1}}],["加粗文字",{"2":{"113":1,"342":1}}],["加载顺序默认为",{"0":{"678":1}}],["加载作为根文件系统的",{"2":{"423":1}}],["加载内核",{"2":{"423":1}}],["加载流程优化",{"2":{"65":1}}],["加载耗时",{"2":{"48":1}}],["加法法则",{"2":{"1":1}}],["新对象会绑定到函数调用的",{"2":{"804":1}}],["新对象会被执行",{"2":{"804":1}}],["新增方法",{"2":{"666":1}}],["新文件",{"2":{"321":1}}],["新状态的标题",{"2":{"268":2}}],["新加入的对象会加入对象区域",{"2":{"182":1}}],["新生区区间划分为两个区域",{"2":{"182":1}}],["新生代的空间一般不会设置得太大",{"2":{"182":1}}],["新生代",{"0":{"179":1}}],["新技术的接受程度",{"2":{"59":1}}],["新旧版本的转化率是否一致",{"2":{"47":1}}],["新版本是否所有功都能正常访问",{"2":{"47":1}}],["灰度占比是否正常",{"2":{"47":1}}],["分隔",{"2":{"835":2}}],["分隔四个部分",{"2":{"429":1}}],["分析调用栈",{"2":{"799":1}}],["分析首屏",{"2":{"65":1}}],["分别为一级标题",{"2":{"688":1}}],["分配一个",{"2":{"425":1}}],["分成多个独立的图层",{"2":{"362":1}}],["分支了",{"2":{"257":1}}],["分支",{"2":{"255":1}}],["分支提交过程",{"2":{"60":1}}],["分页媒体访问网页时的表现设置",{"2":{"622":1}}],["分页之后",{"2":{"188":2}}],["分页",{"2":{"187":1}}],["分词",{"2":{"172":1,"766":1}}],["分步骤",{"2":{"65":1}}],["分流程",{"2":{"65":1}}],["分",{"2":{"65":1}}],["分屏加载",{"2":{"51":1}}],["分版本监控观察",{"2":{"47":1}}],["分环境执行",{"2":{"24":1}}],["全面解析",{"0":{"798":1},"1":{"799":1,"800":1,"801":1,"802":1,"803":1,"804":1,"805":1,"806":1,"807":1,"808":1,"809":1,"810":1,"811":1}}],["全体选择器",{"2":{"611":1}}],["全",{"2":{"446":1}}],["全局模板",{"0":{"871":1}}],["全局名称空间污染",{"2":{"853":1}}],["全局引用不能和import一起",{"2":{"844":2}}],["全局引用文件内不能包含",{"2":{"844":1}}],["全局作用域",{"0":{"778":1}}],["全局环境作用域",{"2":{"773":1}}],["全局绑定事件",{"2":{"195":2}}],["全局执行上下文",{"2":{"176":1}}],["全停顿算法",{"2":{"185":1}}],["全停顿",{"0":{"184":1}}],["全版本监控观察",{"2":{"47":1}}],["全方位串联起来",{"2":{"22":1}}],["可加",{"2":{"860":2}}],["可索引属性",{"2":{"860":1}}],["可执行命令",{"2":{"832":1}}],["可行",{"2":{"797":2,"801":2}}],["可见的",{"2":{"718":2}}],["可影响可替换元素的位置",{"2":{"637":1}}],["可替换元素",{"0":{"636":1},"1":{"637":1,"638":1,"639":1,"640":1,"641":1,"642":1}}],["可靠的",{"2":{"481":1}}],["可能要检查整个dom的元素",{"2":{"658":1}}],["可能会在内容的上方和下方重叠",{"2":{"578":1}}],["可能会创建新的资源或者修改资源",{"2":{"453":1}}],["可能后退也可能前进",{"2":{"268":1}}],["可事实终究残酷无情",{"2":{"324":1}}],["可选的全局语法",{"2":{"870":1}}],["可选默认参数",{"2":{"861":1}}],["可选属性",{"2":{"860":1}}],["可选参数或者属性",{"2":{"837":1}}],["可选链式操作符",{"0":{"738":1},"1":{"739":1,"740":1,"741":1,"742":1,"743":1}}],["可选",{"2":{"303":2}}],["可配置值",{"2":{"240":1}}],["可测试性要求高",{"2":{"65":1}}],["可由多个负责人共同维护",{"2":{"64":1}}],["可用于下一次的页面快速渲染",{"2":{"51":1}}],["可交互时间提前",{"2":{"51":1}}],["可通过报错内容找到报错位置修复",{"2":{"47":1}}],["可以嵌套",{"2":{"874":1}}],["可以直接定义获取到值",{"2":{"865":1}}],["可以包含代码和声明",{"2":{"853":1}}],["可以合并",{"2":{"852":1}}],["可以配置别名映射到目录",{"2":{"857":2}}],["可以配置writetodisk",{"2":{"104":1}}],["可以配合使用",{"2":{"853":1}}],["可以配合其他包声明文件扩展",{"2":{"852":1}}],["可以配合映射类型使用",{"2":{"837":1}}],["可以实现和硬绑定相同的效果",{"2":{"810":1}}],["可以实现水平垂直居中",{"2":{"590":1}}],["可以实现水平居中",{"2":{"590":1}}],["可以创建一个",{"2":{"808":1}}],["可以执行字符串代码",{"2":{"775":1}}],["可以通过",{"2":{"763":1}}],["可以传参数",{"2":{"762":1}}],["可以转为",{"2":{"667":1}}],["可以减少检查元素的个数",{"2":{"658":1}}],["可以将其视为段落的上下文",{"2":{"577":1}}],["可以理解",{"2":{"493":1}}],["可以代表本机",{"2":{"446":1}}],["可以发送广播包",{"2":{"433":1}}],["可以接收来自各个地方的包",{"2":{"429":1}}],["可以对子网进行层次化编址",{"2":{"550":1}}],["可以对外",{"2":{"429":1}}],["可以对文档进行操作",{"2":{"195":2}}],["可以连接服务端",{"2":{"423":1}}],["可以访问数据",{"2":{"321":1}}],["可以指向整个目录或链接到远程计算机上的文件",{"2":{"316":1}}],["可以视为快捷方式",{"2":{"316":1}}],["可以精确表示从",{"2":{"282":1}}],["可以简写",{"2":{"242":1}}],["可以操作对象",{"2":{"230":1}}],["可以作为文本或二进制数据读取",{"2":{"206":1}}],["可以使用此类型用作绑定",{"2":{"838":1}}],["可以使用交叉类型实现",{"2":{"837":1}}],["可以使用严格模式",{"2":{"661":1}}],["可以使用伪元素清除容器的浮动",{"2":{"602":1}}],["可以使用",{"2":{"196":1,"268":1,"841":1,"857":2,"877":2}}],["可以确保避免事件的同步性和随事件而来的混乱",{"2":{"164":1,"759":1}}],["可以监听多个元素",{"2":{"158":2,"753":2}}],["可以异步执行回调监听",{"2":{"151":1,"746":1}}],["可以自行参考",{"2":{"147":1}}],["可以自行参考源码",{"2":{"145":2}}],["可以有不同的配置",{"2":{"141":1}}],["可以根据系统架构将应用进行模块和层级的划分",{"2":{"33":1}}],["可以结合业务进行细分和组件拆分",{"2":{"33":1}}],["可以采用类似mvc结构进行拆分",{"2":{"33":1}}],["定时器",{"0":{"821":1}}],["定时器运行",{"2":{"819":1}}],["定时任务并不是由",{"2":{"730":1}}],["定时触发器线程",{"2":{"730":1}}],["定义枚举值",{"2":{"865":1}}],["定义一个函数",{"2":{"863":2}}],["定义文件引用",{"2":{"857":2}}],["定义文件目录",{"2":{"857":2}}],["定义的控制字符集",{"2":{"812":1}}],["定义内容策略",{"2":{"701":1}}],["定义字体",{"2":{"625":1}}],["定义动画帧",{"2":{"624":1}}],["定义列表项的表现",{"2":{"623":1}}],["定义请求数据格式",{"2":{"482":1}}],["定义数据格式并按照对应的格式解读数据",{"2":{"482":1}}],["定义了端口",{"2":{"481":1}}],["定义端口",{"2":{"481":1}}],["定义网络地址",{"2":{"480":1}}],["定义",{"0":{"316":1,"320":1,"637":1,"813":1},"2":{"405":1,"545":1,"696":1,"857":2}}],["定义全局变量指定变量选项",{"2":{"241":1}}],["定量上报",{"2":{"46":1}}],["定期",{"2":{"46":1}}],["类泛型只能作用实例化对象",{"2":{"866":3}}],["类泛型",{"2":{"866":1}}],["类名以及子类访问",{"2":{"864":1}}],["类可以作为接口",{"2":{"864":1}}],["类可以",{"2":{"860":1}}],["类类型",{"2":{"860":1}}],["类选择器",{"0":{"607":1}}],["类为特殊地址",{"2":{"439":1}}],["类地址",{"0":{"441":1,"442":1,"443":1,"444":1,"445":1},"2":{"429":1}}],["类别",{"2":{"429":2,"440":1,"548":1}}],["类",{"2":{"429":6,"439":3,"446":1,"864":1}}],["类的时候",{"2":{"168":2}}],["类似这种形式",{"2":{"429":1}}],["类似",{"2":{"110":1,"626":1,"837":1}}],["类似实现用法",{"0":{"77":1,"80":1,"83":1,"87":1,"90":1,"93":1}}],["类型文件",{"2":{"867":1}}],["类型是每种类型的子类型",{"2":{"859":1}}],["类型中的",{"2":{"838":1}}],["类型中存在",{"2":{"838":1}}],["类型中存在的",{"2":{"838":1}}],["类型中需要存在的",{"2":{"838":1}}],["类型存在",{"2":{"838":1}}],["类型别名",{"2":{"837":1}}],["类型断言",{"2":{"837":1,"859":1}}],["类型的文本数据",{"2":{"206":1}}],["类型的数据",{"2":{"200":1}}],["类型",{"0":{"69":1,"714":1},"1":{"70":1,"71":1,"72":1,"715":1,"716":1,"717":1,"718":1},"2":{"201":1,"203":1,"206":1,"221":1,"222":1,"283":1,"433":1,"568":3,"837":1,"872":1}}],["类方法劫持",{"2":{"45":1}}],["类装饰器",{"2":{"45":1}}],["框架带有自身的生命周期",{"2":{"43":1}}],["框架选择",{"2":{"24":1}}],["监视当前分配给该多宿主设备上的接口的所有",{"2":{"497":1}}],["监听路由",{"2":{"270":1}}],["监听目标节点的子节点的变化",{"2":{"160":1,"755":1}}],["监听节点的字符数据改变",{"2":{"160":1,"755":1}}],["监听",{"2":{"158":2,"168":2,"753":2}}],["监听范围",{"2":{"151":1,"746":1}}],["监听文件编译",{"2":{"858":1}}],["监听文件编译完成",{"2":{"106":1}}],["监听文件变化以及编译",{"2":{"103":1}}],["监听入口文件的变化",{"2":{"104":1}}],["监听编译代码",{"2":{"100":1}}],["监听事件",{"2":{"43":1}}],["监控内容",{"0":{"41":1}}],["监控源码变更",{"2":{"24":1}}],["系统内部使用",{"2":{"823":1}}],["系统会读取",{"2":{"733":1}}],["系统",{"2":{"423":1}}],["系统中",{"2":{"316":2,"320":1}}],["系统生命周期",{"0":{"43":1}}],["系统稳定性",{"2":{"42":1}}],["系统异常",{"0":{"44":1},"2":{"42":2}}],["系统的生命周期数据",{"2":{"42":1}}],["用在静态方法中",{"2":{"670":1}}],["用在构造函数之中",{"2":{"670":1}}],["用在对预请求的响应中",{"2":{"409":1}}],["用来控制事件循环",{"2":{"730":1}}],["用来设置文字行之间的间距",{"2":{"629":1}}],["用来处理在视觉媒体上显示文档时使用的计算规则",{"2":{"587":1}}],["用来在最终的",{"2":{"505":1}}],["用",{"2":{"446":1}}],["用于控制视频文本终端上的的光标位置",{"2":{"813":1}}],["用于确定在何处以及如何查找变量",{"2":{"770":1}}],["用于确认网络设备位置的地址",{"2":{"467":1}}],["用于发送请求和接收响应的窗口名称",{"2":{"718":1}}],["用于发起一个预请求",{"2":{"413":1,"414":1}}],["用于引入一个",{"2":{"620":1}}],["用于屏蔽",{"2":{"547":1}}],["用于与最终用户使用的同一台机器或计算机建立",{"2":{"499":1}}],["用于指定无效",{"2":{"496":1}}],["用于电",{"2":{"464":1}}],["用于测试或诊断",{"2":{"457":1}}],["用于回路测试",{"2":{"446":1}}],["用于",{"2":{"354":1,"401":1,"729":1,"838":1}}],["用于处理ime的输入序列",{"2":{"228":1}}],["用法类似",{"2":{"339":1}}],["用法",{"0":{"153":1,"748":1}}],["用户指定类型",{"2":{"837":1}}],["用户交互",{"2":{"728":1}}],["用户没有必要的凭据",{"2":{"529":1}}],["用户或浏览器自行选择一个首选的地址进行重定向",{"2":{"518":1}}],["用户按下任意键触发",{"2":{"227":1}}],["用户选择input或者textarea字符时触发",{"2":{"224":1}}],["用户停止下载过程时",{"2":{"224":1}}],["用户的体验累积",{"2":{"129":1}}],["用户主动提交",{"2":{"46":1}}],["用户日志",{"0":{"45":1},"2":{"42":1}}],["用户行为数据",{"2":{"42":1}}],["用户操作行为",{"2":{"41":1}}],["用例维护",{"2":{"23":1}}],["视口",{"2":{"701":1}}],["视口中x",{"2":{"226":1}}],["视图",{"2":{"671":2}}],["视图模块",{"2":{"33":1}}],["视觉格式化模型",{"0":{"587":1}}],["视觉和交互划分",{"2":{"37":1}}],["etc",{"2":{"820":1}}],["eth0",{"2":{"429":1}}],["eth1sudo",{"2":{"421":1}}],["eth1",{"2":{"421":5}}],["equiv",{"2":{"701":2}}],["eqeqeq",{"2":{"244":2,"245":2}}],["e914",{"2":{"494":1}}],["early",{"0":{"505":1}}],["ea9d",{"2":{"428":2}}],["ease",{"2":{"167":4,"862":8}}],["effects",{"0":{"840":1},"2":{"660":1}}],["effect",{"2":{"359":1}}],["efdd",{"2":{"208":2}}],["efd",{"2":{"208":4}}],["email",{"2":{"832":2}}],["embed",{"2":{"638":1}}],["empty",{"2":{"635":1}}],["em",{"2":{"630":1}}],["emoji",{"2":{"345":6}}],["emit",{"0":{"139":1},"2":{"131":2,"132":1,"139":1,"145":4}}],["emitter",{"2":{"35":1,"63":1}}],["econnrefused",{"2":{"822":1}}],["ecs公网ip",{"2":{"333":2}}],["ecmascript",{"2":{"763":1,"806":2}}],["ecmafeatures",{"2":{"237":1}}],["ecmaversion",{"2":{"237":1}}],["e2big",{"0":{"328":1},"1":{"329":1,"330":1},"2":{"328":2,"329":1}}],["either",{"2":{"326":2}}],["e7",{"2":{"289":1,"428":4}}],["edgehtml",{"2":{"347":1}}],["edge",{"2":{"326":4,"347":2,"674":1}}],["edge12+",{"2":{"196":1}}],["edit",{"2":{"256":2,"259":2}}],["es5",{"2":{"857":2}}],["es3",{"2":{"857":2}}],["es",{"2":{"853":1}}],["esnext",{"2":{"839":1}}],["esc",{"2":{"814":2,"815":2}}],["escape",{"0":{"705":1,"812":1},"1":{"813":1,"814":1,"815":1},"2":{"703":1}}],["esmoduleinterop",{"2":{"870":2,"871":1}}],["esm",{"0":{"306":1},"2":{"300":1}}],["es2015",{"2":{"839":1,"857":4}}],["es2017",{"2":{"240":1}}],["es2020",{"2":{"240":1}}],["es6",{"0":{"662":1,"672":1,"811":1},"1":{"663":1,"664":1,"665":1,"666":1,"667":1,"668":1,"669":1,"670":1,"671":1,"672":1},"2":{"240":1,"672":5,"857":4,"868":1}}],["esprima",{"2":{"238":1}}],["eslintcache",{"2":{"253":2}}],["eslintignore",{"2":{"252":1,"253":2}}],["eslintrc",{"2":{"236":1,"250":1,"253":6}}],["eslint优化完善项目代码",{"2":{"235":1}}],["eslint",{"0":{"235":1,"248":1},"1":{"236":1,"237":1,"238":1,"239":1,"240":1,"241":1,"242":1,"243":1,"244":1,"245":1,"246":1,"247":1,"248":1,"249":1,"250":1,"251":1,"252":1,"253":1},"2":{"60":1,"238":2,"242":6,"244":2,"246":14,"251":2,"252":1,"253":2}}],["eeffdd",{"2":{"208":2}}],["elastic",{"0":{"332":1},"1":{"333":1}}],["else",{"2":{"168":4,"210":2,"211":2,"718":2}}],["elements",{"2":{"188":4,"718":1}}],["element",{"2":{"151":1,"221":2,"222":1,"636":2,"715":4,"717":1,"718":4,"746":1}}],["e",{"0":{"445":1},"2":{"168":4,"195":10,"294":1,"429":1,"439":1,"446":1,"659":1,"815":1}}],["ev",{"2":{"568":2}}],["eval",{"0":{"775":1},"2":{"147":4,"774":1,"775":3,"777":3}}],["eventutil",{"2":{"718":2}}],["eventtarget",{"2":{"715":6}}],["event包含两个属性",{"2":{"232":1}}],["event对象上有个persist属性",{"2":{"231":1}}],["eventphase",{"2":{"221":1}}],["events",{"2":{"106":4}}],["event",{"0":{"724":1,"733":1},"1":{"725":1,"726":1,"727":1,"728":1,"729":1,"730":1,"731":1,"732":1,"733":1},"2":{"35":1,"63":1,"195":2,"221":2,"222":4,"226":1,"227":3,"230":4,"234":1,"351":1,"419":12,"712":1,"718":10}}],["enums",{"2":{"865":1}}],["enum",{"0":{"865":1},"2":{"859":3,"865":4}}],["enumerable",{"2":{"762":1}}],["enctype",{"2":{"718":2}}],["encodeuricomponent",{"0":{"708":1}}],["encodeuri",{"0":{"706":1}}],["enable",{"2":{"857":2}}],["enabled",{"2":{"635":1}}],["enabling",{"2":{"253":2}}],["en2",{"2":{"428":4}}],["en1",{"2":{"428":4}}],["en0",{"2":{"428":4}}],["engine",{"2":{"347":2}}],["env",{"0":{"240":1},"2":{"253":4,"330":1,"832":1}}],["environments",{"2":{"253":2}}],["environment",{"2":{"236":1,"253":2,"423":1}}],["enterraf",{"2":{"168":2}}],["enter",{"2":{"168":19}}],["entries",{"2":{"143":6,"668":2}}],["entrylist",{"2":{"380":4}}],["entry",{"2":{"106":1,"144":2,"380":6}}],["en",{"2":{"131":2,"146":2,"147":4}}],["endian",{"0":{"281":1},"2":{"671":2}}],["end",{"0":{"594":1},"2":{"129":1,"167":1,"168":4,"188":2,"190":2,"191":2,"192":1,"271":1,"598":1,"651":1}}],["excludedunion",{"2":{"838":2}}],["exclude",{"2":{"832":1,"838":1,"857":4}}],["excess",{"2":{"860":1}}],["excecommand",{"2":{"194":1}}],["excel",{"2":{"110":1}}],["execute",{"2":{"682":2}}],["execution",{"2":{"253":2,"423":1}}],["exec",{"0":{"666":1},"2":{"256":4,"666":13}}],["execcommand",{"0":{"194":1},"1":{"195":1},"2":{"112":2,"113":1,"114":1,"195":2,"196":1}}],["exit",{"2":{"253":2}}],["extract",{"2":{"838":1}}],["extensions",{"2":{"253":2}}],["extending",{"2":{"860":1}}],["extends",{"0":{"251":1},"2":{"837":1,"857":2,"860":1,"864":3,"866":4,"876":4}}],["extend",{"2":{"114":1}}],["ext",{"2":{"253":2}}],["ex",{"2":{"147":4}}],["expose",{"0":{"411":1}}],["export",{"2":{"306":6,"672":6,"675":2,"839":1,"843":4,"844":5,"852":10,"854":2,"870":6,"874":4}}],["exports",{"2":{"134":2,"144":6,"147":2,"303":5,"305":2,"672":30,"840":1,"854":6}}],["expires=",{"2":{"399":2}}],["expires",{"0":{"399":1}}],["expired",{"2":{"98":2}}],["explorer",{"2":{"347":1}}],["express",{"2":{"99":1,"101":1,"102":2,"104":5,"107":1,"871":2}}],["err",{"2":{"102":2,"104":2,"143":4}}],["errors",{"2":{"253":6}}],["error",{"0":{"539":1},"2":{"44":1,"104":2,"143":2,"224":1,"243":1,"244":2,"245":2,"253":2,"328":3,"633":2,"844":2}}],["的共有属性",{"2":{"863":2}}],["的指向",{"2":{"861":1}}],["的集合当中",{"2":{"838":1}}],["的调度回调函数",{"2":{"821":1}}],["的调用位置无关",{"2":{"801":1}}],["的最大调用堆栈大小",{"2":{"820":1}}],["的最优分层",{"2":{"352":1}}],["的回调将在事件循环继续之前解析",{"2":{"820":1}}],["的错误处理延迟到这里执行",{"2":{"819":1}}],["的能力",{"2":{"810":1}}],["的引用",{"2":{"802":2}}],["的绑定",{"2":{"838":1}}],["的绑定对象",{"2":{"800":1}}],["的绑定和函数声明的位置没有任何关系",{"2":{"796":1}}],["的存储结构",{"0":{"781":1},"1":{"782":1,"783":1,"784":1,"785":1,"786":1,"787":1,"788":1,"789":1,"790":1,"791":1,"792":1,"793":1,"794":1,"795":1}}],["的存储空间",{"2":{"179":1}}],["的一系列查询",{"2":{"766":1}}],["的实现",{"2":{"764":1}}],["的属性为",{"2":{"738":1}}],["的元素版",{"2":{"717":4}}],["的元素不产生外边距重叠问题",{"2":{"582":1}}],["的个数",{"2":{"717":1}}],["的视图实例",{"2":{"671":1}}],["的返回值",{"2":{"669":2}}],["的任何地方",{"2":{"641":1}}],["的行为与最外层的文档非常相似",{"2":{"575":1}}],["的信息",{"2":{"564":1}}],["的信息被捕获到一个mutationrecord中",{"2":{"161":1,"756":1}}],["的握手通道",{"2":{"488":1}}],["的四层架构模型",{"2":{"478":1}}],["的第一个",{"2":{"446":1}}],["的第一个参数状态对象",{"2":{"268":1}}],["的地址",{"2":{"446":1}}],["的头",{"2":{"433":3}}],["的增强版",{"2":{"422":1}}],["的数据",{"2":{"419":1}}],["的数据已经准备好",{"2":{"365":1}}],["的时间",{"2":{"819":1,"824":1}}],["的时间格式",{"2":{"399":1}}],["的时间点",{"2":{"67":1}}],["的匹配下才可携带",{"2":{"396":1}}],["的使用",{"2":{"376":1}}],["的过程",{"2":{"366":1}}],["的话",{"2":{"354":1}}],["的渲染",{"2":{"350":1}}],["的情况",{"2":{"350":1}}],["的全部能力",{"2":{"349":1}}],["的基线是正常流中最后一个线框的基线",{"2":{"326":1}}],["的名称",{"2":{"317":1}}],["的二进制",{"0":{"296":1,"297":1}}],["的二进制格式",{"2":{"274":1,"275":1,"277":1}}],["的补码形式",{"2":{"294":1}}],["的倍数",{"2":{"282":2}}],["的整数",{"2":{"282":1}}],["的精度",{"2":{"274":1,"275":1,"276":1,"277":1}}],["的查询字符串",{"2":{"271":1}}],["的提交可以使得提交记录不存在",{"2":{"266":1}}],["的提交记录直接提交到",{"2":{"257":1}}],["的值",{"2":{"221":1,"494":2}}],["的比例",{"2":{"210":2}}],["的计算",{"2":{"189":1}}],["的垃圾回收",{"2":{"175":1}}],["的mutaion",{"2":{"163":1,"758":1}}],["的变化",{"2":{"151":1,"746":1}}],["的灵活性",{"2":{"139":1}}],["的文本复合系统关闭时触发",{"2":{"116":1}}],["的文本复合系统打开时触发",{"2":{"116":1}}],["的中间件",{"2":{"104":1}}],["的参数列表",{"2":{"232":1}}],["的参数",{"0":{"95":1}}],["的防抖节流",{"2":{"73":1}}],["的",{"2":{"35":1,"106":1,"167":1,"168":2,"271":1,"349":1,"403":1,"416":1,"422":1,"446":1,"459":1,"718":3}}],["而变量提升是通过变量环境来实现",{"2":{"780":1}}],["而传统的引入会执行多次",{"2":{"681":1}}],["而不是子类的实例对象",{"2":{"864":1}}],["而不是子类实例",{"2":{"670":1}}],["而不是用户希望其执行的确切时间",{"2":{"821":1}}],["而不是跨域访问",{"2":{"683":1}}],["而不是父类的原型对象",{"2":{"670":1}}],["而不必完全传输",{"2":{"460":1}}],["而清除浮动只能清除同一",{"2":{"575":1}}],["而且有一个新的资源已经依据请求的需要而创建",{"2":{"508":1}}],["而新页面和当前页面属于同一站点",{"2":{"354":1}}],["而",{"2":{"221":1,"489":1,"777":1}}],["而应该对开始位置",{"2":{"191":2}}],["而中间恰好利用这段时间来进行动画过渡的操作",{"2":{"168":1}}],["而是利用compilation",{"2":{"140":1}}],["而是代码执行时间随着数据增长的变化趋势",{"2":{"1":1}}],["而具体实现则依赖于抽象接口",{"2":{"35":1}}],["高阶组件中转发一次",{"2":{"877":2}}],["高阶组件也是如此",{"2":{"877":2}}],["高级组合",{"0":{"874":1}}],["高级",{"0":{"836":1},"1":{"837":1,"838":1,"839":1,"840":1,"841":1,"842":1,"843":1,"844":1,"845":1,"846":1,"847":1,"848":1,"849":1,"850":1,"851":1,"852":1,"853":1,"854":1}}],["高级程序设计第三版",{"2":{"112":1}}],["高速率",{"2":{"463":1}}],["高度不超出可视区域时",{"2":{"595":2}}],["高度塌陷问题",{"2":{"576":1}}],["高度随机",{"2":{"191":1}}],["高度改变",{"0":{"191":1}}],["高度固定",{"0":{"190":1},"2":{"188":1,"190":1}}],["高度计算有误",{"2":{"188":2}}],["高度",{"2":{"188":2,"583":2}}],["高层次的模块不应该依赖低层次的模块",{"2":{"35":1}}],["高内聚则意味着对象专注于单一职责",{"2":{"35":1}}],["高内聚",{"2":{"35":1}}],["不使用负载",{"2":{"872":1}}],["不要直接赋值",{"2":{"876":1}}],["不要使用可选参数",{"2":{"872":1}}],["不要害怕经历",{"2":{"324":1}}],["不让事件循环继续的优点",{"2":{"828":1}}],["不允许超过",{"2":{"820":1}}],["不允许跨域就访问不到",{"2":{"682":1}}],["不允许跨域引入",{"2":{"682":2}}],["不允许跨域",{"2":{"682":2}}],["不适用负载",{"2":{"872":1}}],["不适用以上绑定方式",{"2":{"811":1}}],["不适用与",{"2":{"483":1}}],["不具备很高的实时性",{"2":{"795":1}}],["不成功的",{"2":{"770":1}}],["不固定实现",{"2":{"762":2}}],["不携带凭证",{"2":{"683":2}}],["不提供参数",{"2":{"669":1}}],["不计入垃圾回收机制",{"2":{"668":1}}],["不支持遍历",{"2":{"668":1}}],["不匹配换行符",{"2":{"666":1}}],["不包括文本节点和注释",{"2":{"717":1}}],["不包括位置信息",{"2":{"666":1}}],["不包含",{"2":{"349":1}}],["不包含滚动距离",{"2":{"226":1}}],["不渲染以达到首次加载渲染速度",{"2":{"655":1}}],["不占空间大小",{"2":{"653":1}}],["不产生任何内容",{"2":{"640":1}}],["不产生伪类元素",{"2":{"640":1}}],["不清除浮动会使得容器的高度为",{"2":{"602":1}}],["不设置宽度的情况",{"2":{"599":1}}],["不设置宽度",{"2":{"599":2}}],["不为",{"2":{"575":1}}],["不可行",{"2":{"797":2}}],["不可路由的源地址",{"2":{"496":1}}],["不可逆",{"2":{"95":2,"859":1}}],["不通用",{"2":{"483":1}}],["不必分割",{"2":{"481":1}}],["不返回",{"2":{"461":1}}],["不被允许",{"2":{"404":1}}],["不发送",{"2":{"402":4}}],["不考虑垃圾回收机制",{"2":{"668":1}}],["不考虑",{"2":{"380":1}}],["不同实例的同名函数是不相等的",{"2":{"761":1}}],["不同进程之间也可以通信",{"2":{"725":1}}],["不同",{"2":{"669":1}}],["不同浏览器可能间距不一",{"2":{"647":1}}],["不同的是",{"2":{"512":1}}],["不同的大小拆分成多个图块给到",{"2":{"363":1}}],["不同场景只加载所需要的模块内容",{"2":{"65":1}}],["不知道出去该往哪个方向发展",{"2":{"324":1}}],["不仅仅是技术",{"2":{"324":1}}],["不仅仅是设备方向改变",{"2":{"233":1}}],["不是事件循环的一部分",{"2":{"828":1}}],["不是提前编译的",{"2":{"765":1}}],["不是一个构造函数",{"2":{"671":1}}],["不是",{"2":{"669":1}}],["不是重复连接",{"2":{"316":1}}],["不是正确的答案",{"2":{"294":2}}],["不是结束生命的事件",{"2":{"159":1,"754":1}}],["不依赖",{"2":{"257":1}}],["不用等图像",{"2":{"230":1}}],["不冒泡",{"2":{"225":2,"226":2}}],["不会对有表达式进行求值",{"2":{"737":1}}],["不会对本身属于",{"2":{"706":1}}],["不会执行",{"2":{"669":1}}],["不会影响到可替换元素自身的内容",{"2":{"637":1}}],["不会被删除",{"2":{"395":1}}],["不会报告",{"2":{"380":1}}],["不会在历史记录中生成新的记录",{"2":{"271":1}}],["不会计入历史状态",{"2":{"268":1}}],["不会触发load事件",{"2":{"231":1}}],["不会再支持了",{"2":{"194":1}}],["不会改变布局",{"2":{"166":1}}],["不能直接使用参数类型相应的方法或者属性",{"2":{"866":1}}],["不能继承私有属性方法",{"2":{"860":1}}],["不能编译=",{"2":{"857":2}}],["不能添加新的属性定义",{"2":{"837":1}}],["不能重复定义会报错",{"2":{"837":1}}],["不能为",{"2":{"837":1}}],["不能使用推断类型的原型方法",{"2":{"866":1}}],["不能使用",{"2":{"797":2}}],["不能依赖",{"2":{"761":1}}],["不能传参数",{"2":{"761":1}}],["不能用于赋值",{"0":{"742":1}}],["不能执行",{"2":{"682":4}}],["不能与",{"2":{"669":1,"737":1}}],["不能与其它类型进行运算",{"2":{"667":1}}],["不能单独存在",{"2":{"545":1}}],["不能被实例化",{"2":{"864":1}}],["不能被",{"2":{"403":1}}],["不能被读取",{"2":{"394":1}}],["不能超过",{"2":{"393":1}}],["不能出现空白",{"2":{"190":2}}],["不能访问到的元素为垃圾数据",{"2":{"183":1}}],["不连续的内存空间",{"2":{"181":1}}],["不死的对象活的更久",{"2":{"178":1}}],["不过它会再基于抽象语法树生成字节码",{"2":{"170":1}}],["不再继续又生成一遍",{"2":{"132":1}}],["不合适进行及时的设计调整与优化",{"2":{"63":1}}],["不滥用用户的缓存资源",{"2":{"55":1}}],["不相关的事物不应相互依赖",{"2":{"35":1}}],["不存在左右节点",{"2":{"21":1}}],["低耦合基于抽象",{"2":{"35":1}}],["低耦合",{"2":{"35":1}}],["从样式中删除给定属性",{"2":{"718":1}}],["从匹配的第一个位置再进行匹配",{"2":{"666":1}}],["从最外层到最内层",{"2":{"641":1}}],["从上游服务器接收到无效的响应",{"2":{"541":1}}],["从浏览器渲染的过程进行理解以及渲染的优化步骤",{"2":{"370":1}}],["从近到远的提交记录",{"2":{"257":1}}],["从文档中移除之后触发",{"2":{"229":1}}],["从文档中删除选区中的文本",{"2":{"114":1}}],["从而导致事件循环无法到达轮询阶段",{"2":{"820":1}}],["从而导致性能降低",{"2":{"777":1}}],["从而复制文字到剪切板中",{"2":{"195":2}}],["从而减少内存占用",{"2":{"55":1}}],["从一组根元素开始",{"2":{"183":1}}],["从以下一个例子中来讲",{"2":{"168":1}}],["从选区中移除指定的",{"2":{"114":1}}],["从选区中移除所有",{"2":{"114":1}}],["从工程学角度来看",{"2":{"61":1}}],["从",{"2":{"58":1}}],["从用户首次交互",{"2":{"56":1}}],["从系统内部的角度来进行职责划分",{"2":{"34":1}}],["从业务领域的角度来对系统进行领域划分和建模",{"2":{"34":1}}],["从该节点到可达节点的路径上的黑色节点数量相等",{"2":{"7":1}}],["领域驱动设计",{"2":{"34":1}}],["核心模块",{"2":{"33":1}}],["核心接口",{"2":{"23":1}}],["对一个已定义的类型遍历操作",{"2":{"837":1}}],["对元素产生了影响",{"2":{"660":1}}],["对称加密",{"0":{"553":1,"559":1},"1":{"554":1,"555":1,"560":1,"561":1}}],["对实体请求的一个或多个实体操作的结果表示",{"2":{"516":1}}],["对网络中不同主机的应用进程之间进行双向通信的端点的抽象",{"2":{"485":1}}],["对电信号进行分组形成具有特定意义的数据帧",{"2":{"479":1}}],["对数据包下一传输目的地进行选择",{"2":{"466":1}}],["对数据进行处理",{"2":{"466":1}}],["对比",{"0":{"461":1},"2":{"736":1}}],["对应当前请求的响应可以在另一个",{"2":{"521":1}}],["对应于当前主机",{"2":{"446":1}}],["对应的证书称为根证书",{"2":{"567":1}}],["对应的规则",{"2":{"242":2}}],["对应的父节点为",{"2":{"12":2}}],["对已经提交到工作区的文件进行操作",{"2":{"263":1}}],["对已有节点进行替换操作",{"2":{"188":1}}],["对指定文件进行规则覆盖",{"0":{"247":1}}],["对对象区域中的垃圾进行标记",{"2":{"182":1}}],["对象键指定为",{"2":{"837":1}}],["对象了",{"2":{"803":2}}],["对象时",{"2":{"761":1}}],["对象格式",{"2":{"672":2}}],["对象形式",{"2":{"672":2}}],["对象结构赋值",{"2":{"664":1}}],["对象和数组结构赋值",{"2":{"664":1}}],["对象每切换不同的页面长度",{"2":{"268":1}}],["对象已经加载完毕",{"2":{"230":1}}],["对象加载数据完毕",{"2":{"230":1}}],["对象正在加载数据",{"2":{"230":1}}],["对象就会被销毁",{"2":{"221":1}}],["对象才会存在",{"2":{"221":1}}],["对象包含指定的范围的字节调用",{"2":{"206":1}}],["对象是一个不可变的原始数据的类文件对象",{"2":{"206":1}}],["对象类型",{"2":{"198":1,"202":1}}],["对象存在单尚未初始化",{"2":{"230":1}}],["对象存活时间长",{"2":{"183":1}}],["对象存放的时间较长",{"2":{"180":1}}],["对象存放的时间较短",{"2":{"179":1}}],["对象晋升策略",{"2":{"182":1}}],["对象区域=空闲区域",{"2":{"182":1}}],["对象区域和空闲区域角色反转",{"2":{"182":1}}],["对象区域存满之后",{"2":{"182":1}}],["对象区域",{"2":{"182":1}}],["对象一般不会存储太久",{"2":{"178":1}}],["对象",{"2":{"143":2,"202":2,"221":2,"232":1,"234":1,"271":1,"419":2,"669":1,"718":1,"761":1,"795":1,"803":2,"808":1,"859":1}}],["对象中没有",{"2":{"776":2}}],["对象中",{"2":{"139":1}}],["对象的属性",{"2":{"718":1}}],["对象的",{"2":{"132":1,"271":1}}],["对象方法",{"2":{"114":1}}],["对象属性不会变动",{"2":{"672":2}}],["对象属性",{"2":{"114":1}}],["对象进行刷新",{"2":{"106":1}}],["对现有架构设计进行分析",{"2":{"63":1}}],["对页面进行分片",{"2":{"51":1}}],["对请求进行优化",{"2":{"50":1}}],["对请求资源进行合理的拆分",{"2":{"50":1}}],["对请求资源进行缓存",{"2":{"50":1}}],["对资源进行压缩",{"2":{"50":1}}],["对外提供查询接口",{"2":{"38":1}}],["对外提供配置接口",{"2":{"38":1}}],["对于运行在混杂模式下的",{"2":{"718":1}}],["对于当前请求的方法和所请求的资源",{"2":{"537":1}}],["对于反向代理服务器来说",{"2":{"493":1}}],["对于不同子网的数据包进行路由",{"2":{"480":1}}],["对于",{"2":{"159":1,"754":1}}],["对于浏览器来说是一笔巨大的开销",{"2":{"125":1}}],["对于核心复杂模块",{"2":{"64":1}}],["对于交互和逻辑复杂的应用",{"2":{"33":1}}],["对于页面内容丰富的应用",{"2":{"33":1}}],["对于简单的管理端应用",{"2":{"33":1}}],["邮件发送变更",{"2":{"27":1}}],["j",{"2":{"815":1}}],["just",{"0":{"702":1}}],["justify",{"0":{"591":1}}],["justifyleft",{"2":{"113":1}}],["justifycenter",{"2":{"113":1}}],["jquery",{"2":{"240":1,"242":14,"850":6}}],["jit",{"2":{"174":1}}],["javascript中的相等性检查",{"2":{"719":1}}],["javascriptcore",{"2":{"347":1}}],["javascript文件",{"2":{"230":1}}],["javascript",{"0":{"284":1,"731":1},"2":{"53":1,"112":1,"184":1,"185":1,"253":2,"284":1,"347":2,"351":1,"369":1,"381":2,"382":1,"403":1,"405":1,"677":2,"684":1,"730":1,"765":1,"777":1,"786":2,"797":1,"803":1,"804":1}}],["jest",{"2":{"26":1,"240":1}}],["jenkins",{"2":{"25":1}}],["jsimport",{"2":{"876":1}}],["jsif",{"2":{"806":1,"810":1}}],["js中",{"2":{"672":2}}],["jsvar",{"2":{"668":1,"717":1,"718":1,"723":1,"835":1}}],["jstypeof",{"2":{"663":1}}],["jsobject",{"2":{"763":1}}],["jsotherwindow",{"2":{"419":1}}],["json配置的文件编译",{"2":{"858":2}}],["json文件编译",{"2":{"858":2}}],["jsonday1",{"2":{"850":1}}],["json中配置eslintconfig",{"2":{"236":1}}],["json",{"0":{"831":1,"832":1,"856":2},"1":{"832":1,"857":2,"858":2},"2":{"205":1,"239":1,"241":1,"242":1,"245":1,"247":1,"249":1,"250":1,"339":1,"454":1,"831":1,"846":1,"848":4,"849":4,"850":7,"857":8,"858":2,"870":2}}],["jsdiv",{"2":{"717":1}}],["jsdocument",{"2":{"395":1,"715":3}}],["jsdefine",{"2":{"304":3,"854":1}}],["jsalert",{"2":{"394":1}}],["jsnew",{"2":{"380":1}}],["jsnavigator",{"2":{"202":1,"203":1}}],["js$",{"2":{"309":2}}],["jswindow",{"2":{"269":1,"270":1}}],["jsx",{"2":{"237":1,"877":2}}],["js文件",{"2":{"224":1}}],["jsmodule",{"2":{"134":1}}],["jscript",{"2":{"347":1}}],["jsconfig",{"0":{"856":1},"1":{"857":1,"858":1},"2":{"857":2}}],["jsconst",{"2":{"139":1,"147":1,"309":1,"494":1,"666":1,"671":2,"876":1}}],["jscompiler",{"2":{"106":1}}],["jsclass",{"2":{"13":1,"135":1}}],["jsfunction",{"2":{"76":1,"79":1,"82":1,"86":1,"89":1,"92":1,"98":1,"211":1,"669":1,"718":1,"761":7,"762":5,"775":1,"776":1,"797":1,"802":1,"803":1,"809":1}}],["jslet",{"2":{"19":1,"104":1,"153":1,"155":1,"156":1,"157":1,"159":1,"160":1,"201":1,"666":1,"667":1,"740":1,"741":1,"742":1,"743":1,"748":1,"750":1,"751":1,"752":1,"754":1,"755":1}}],["js",{"0":{"145":1,"148":1,"168":1,"193":1,"719":1,"732":1,"734":1,"765":1,"781":1,"792":1,"848":1},"1":{"149":1,"194":1,"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1,"206":1,"720":1,"721":1,"722":1,"723":1,"735":1,"736":1,"737":1,"738":1,"739":1,"740":1,"741":1,"742":1,"743":1,"744":1,"766":1,"767":1,"768":1,"769":1,"770":1,"771":1,"772":1,"773":1,"774":1,"775":1,"776":1,"777":1,"778":1,"779":1,"780":1,"782":1,"783":1,"784":1,"785":1,"786":1,"787":1,"788":1,"789":1,"790":1,"791":1,"792":1,"793":2,"794":2,"795":2},"2":{"12":1,"77":1,"83":1,"87":1,"93":1,"96":1,"97":1,"102":3,"104":7,"106":9,"112":1,"114":1,"131":1,"143":5,"144":7,"145":3,"147":4,"149":1,"158":1,"168":4,"188":1,"190":1,"191":1,"195":1,"200":1,"208":2,"209":1,"210":1,"217":1,"218":1,"219":1,"223":1,"232":1,"244":1,"246":1,"250":2,"252":2,"253":6,"299":3,"301":1,"303":1,"305":1,"306":1,"339":1,"396":1,"399":1,"400":1,"419":1,"664":2,"666":5,"668":1,"669":1,"672":16,"675":1,"677":2,"678":6,"679":6,"681":4,"683":2,"684":1,"715":3,"718":1,"730":5,"733":3,"736":1,"737":2,"739":1,"753":1,"762":1,"764":1,"797":1,"801":1,"806":1,"821":1,"832":2,"840":2,"842":6,"848":10,"850":6,"853":1,"854":1,"857":8,"870":1,"876":1}}],["w",{"2":{"858":1}}],["wewr",{"2":{"865":2}}],["weakmap",{"2":{"668":2}}],["weakset",{"2":{"668":2}}],["webrtc",{"0":{"569":1},"1":{"570":1,"571":1,"572":1},"2":{"569":1}}],["webtrust",{"2":{"568":1}}],["webdav",{"0":{"504":1},"2":{"504":1}}],["webcontent",{"2":{"349":1}}],["webkit",{"2":{"347":4}}],["webkittransition",{"2":{"168":2}}],["webpagetest",{"2":{"382":1}}],["webpack允许创建一个webpack",{"2":{"141":1}}],["webpack=",{"2":{"104":1}}],["webpackdevmiddleware",{"2":{"104":2}}],["webpack",{"0":{"134":1,"135":1,"136":1},"1":{"137":1,"138":1,"139":1},"2":{"99":1,"100":1,"103":1,"104":8,"106":4,"107":2,"130":2,"134":3,"135":1,"137":1,"139":2,"141":1,"143":2,"144":3,"147":10}}],["webpck",{"2":{"142":1}}],["websocket",{"0":{"488":1,"493":2},"1":{"489":1,"490":1,"491":1,"492":1,"493":1,"494":1},"2":{"105":1,"106":3,"490":10,"493":3,"494":6,"503":1}}],["webassembly",{"2":{"53":1}}],["web",{"2":{"51":1,"53":1,"194":1,"196":1,"268":1,"352":2,"382":1,"406":1,"446":1,"689":2}}],["webhook",{"2":{"24":1}}],["w4v7o6xfti36lq3rncgctw==",{"2":{"490":1}}],["w4v7o6xfti36lq3rncgctw==get",{"2":{"490":1}}],["ws",{"2":{"489":1}}],["wrapper",{"2":{"602":2}}],["wrench",{"2":{"345":1}}],["writing",{"0":{"580":1},"1":{"581":1},"2":{"580":1,"861":1}}],["writable",{"2":{"241":2,"762":1}}],["writetext",{"0":{"201":1},"2":{"201":2}}],["write",{"0":{"200":1},"2":{"200":2,"253":2,"635":1}}],["www",{"2":{"341":2,"454":1,"618":4,"689":2,"843":2}}],["w3",{"2":{"326":1,"618":4}}],["w3c",{"2":{"194":1}}],["what",{"2":{"693":9,"806":2}}],["whatwg",{"2":{"194":1}}],["when",{"2":{"253":2,"876":1}}],["where",{"2":{"253":2,"635":1}}],["which",{"2":{"326":2}}],["while",{"2":{"19":2,"188":2,"191":4}}],["white",{"2":{"16":1,"326":2}}],["wide",{"2":{"689":2}}],["width",{"2":{"131":2,"146":2,"147":4,"168":2,"188":6,"575":1,"586":3,"599":4,"618":2,"644":2,"647":2,"718":4,"860":2}}],["width=device",{"2":{"131":2,"146":2,"147":4}}],["will",{"2":{"682":2}}],["wi",{"2":{"511":1}}],["wifi",{"2":{"476":1,"544":1}}],["wiki",{"2":{"450":1,"500":1}}],["wizard",{"2":{"253":2}}],["windwo",{"2":{"232":2}}],["windows",{"2":{"316":1}}],["window对象触发",{"2":{"233":1}}],["window",{"0":{"189":1,"268":1,"271":1,"419":1},"1":{"190":1,"191":1},"2":{"44":1,"106":2,"114":1,"149":2,"168":4,"189":1,"191":2,"195":2,"196":1,"198":2,"200":2,"219":2,"221":1,"222":1,"224":3,"230":1,"232":1,"233":1,"268":1,"269":1,"270":1,"271":1,"301":2,"419":9,"718":7,"801":2,"803":2,"808":1,"810":2}}],["within",{"2":{"635":2}}],["without",{"2":{"253":2}}],["with",{"0":{"776":1},"2":{"147":2,"326":4,"764":2,"774":1,"776":4,"777":2}}],["wps",{"2":{"110":1}}],["worth",{"2":{"666":2}}],["worried",{"2":{"345":1}}],["worktree",{"2":{"262":6}}],["worker",{"2":{"50":1,"53":1,"240":1,"350":1}}],["worldfunction",{"2":{"802":1}}],["world`",{"2":{"342":1}}],["world``hello",{"2":{"342":1}}],["worldhello",{"2":{"342":1}}],["world",{"2":{"147":4,"157":2,"159":4,"184":1,"339":2,"342":3,"419":2,"689":2,"698":9,"752":2,"754":4,"761":6,"764":2,"802":11,"859":2}}],["word",{"2":{"110":1,"666":10}}],["wave",{"2":{"345":1}}],["walking",{"2":{"345":1}}],["warning",{"2":{"343":2,"345":1,"380":1}}],["warnings",{"2":{"253":6}}],["warn",{"2":{"200":4,"201":2,"202":2,"203":2,"243":1,"422":1}}],["was",{"2":{"153":2,"748":2}}],["watch",{"2":{"104":3,"345":1,"858":2}}],["wait",{"2":{"77":2,"83":2,"87":4,"93":4,"95":2,"96":2,"97":4,"98":20}}],["业务用例",{"2":{"24":1}}],["业务报警",{"0":{"29":1},"2":{"23":1}}],["业务层",{"2":{"23":1}}],["ua",{"2":{"701":1}}],["u",{"2":{"666":11,"866":6}}],["uri",{"0":{"703":1},"1":{"704":1,"705":1,"706":1,"707":1,"708":1,"709":1},"2":{"456":1,"508":1,"519":1,"521":1,"525":2,"526":1,"703":2,"706":2}}],["urlstr",{"2":{"843":2}}],["url=xxx",{"2":{"701":1}}],["urlencoded",{"2":{"454":1}}],["url",{"2":{"106":4,"113":2,"232":2,"268":2,"271":8,"396":1,"416":2,"618":4,"640":1,"718":2,"832":4,"843":12}}],["udp",{"0":{"570":1},"2":{"422":4,"427":1,"466":1,"478":1,"481":2,"569":2}}],["upper",{"2":{"641":1}}],["upgrade",{"2":{"490":8,"503":1}}],["updates",{"2":{"424":2}}],["update",{"2":{"424":2,"494":2}}],["up",{"2":{"421":3,"428":20,"433":3}}],["upsudo",{"2":{"421":1}}],["upstream",{"2":{"256":2}}],["umd",{"0":{"301":1,"844":1},"2":{"300":1,"839":1,"857":2,"868":1}}],["usr",{"2":{"832":1}}],["us",{"2":{"666":2,"675":2}}],["using",{"2":{"253":2}}],["used",{"0":{"516":1},"2":{"253":2}}],["use",{"0":{"523":1},"2":{"104":2,"253":12,"683":2,"775":2,"801":4,"876":1}}],["userwithproto",{"2":{"764":2}}],["user=name",{"2":{"395":2,"396":2,"399":2,"400":2}}],["user",{"2":{"41":1,"635":1,"764":10,"837":2}}],["utun1",{"2":{"428":4}}],["utun0",{"2":{"428":4}}],["utility",{"0":{"838":1},"2":{"348":1}}],["utils",{"2":{"143":4,"147":2,"675":4,"680":2}}],["utf",{"2":{"131":2,"146":2,"147":4,"206":1}}],["ul",{"0":{"697":1},"2":{"113":1,"644":9,"646":24,"647":1,"648":4,"649":3,"650":1,"651":1}}],["uncaught",{"2":{"742":2}}],["uncle",{"2":{"20":1}}],["unescape",{"0":{"704":1},"2":{"703":1}}],["unexpected",{"2":{"328":2}}],["unsafe",{"2":{"777":1}}],["unsupported",{"0":{"537":1}}],["unspecified",{"2":{"198":1}}],["unavailable",{"0":{"542":1}}],["unauthorized",{"0":{"529":1}}],["unamused",{"2":{"345":1}}],["union",{"0":{"863":1},"2":{"838":1,"863":1}}],["unicode",{"2":{"666":8,"703":1}}],["unique",{"2":{"494":1}}],["uninitialized",{"2":{"230":1}}],["unknown",{"2":{"428":2,"872":1}}],["unmatched",{"2":{"253":4}}],["unused",{"2":{"253":4}}],["unless",{"2":{"326":2}}],["unload",{"2":{"224":1}}],["unloadeventend",{"2":{"43":1}}],["unloadeventstart",{"2":{"43":1}}],["unlink",{"2":{"113":1}}],["undefine",{"2":{"808":1}}],["undefined",{"2":{"98":12,"232":2,"664":3,"669":6,"735":1,"736":2,"737":9,"738":2,"769":1,"788":1,"810":1,"837":4,"838":1,"859":3,"865":1}}],["undefind",{"2":{"776":2}}],["underline",{"2":{"113":1}}],["uv",{"2":{"41":1}}],["uint8array",{"2":{"671":2}}],["ui事件",{"0":{"224":1}}],["uievents",{"2":{"223":4}}],["ui",{"0":{"24":1},"2":{"23":1,"349":2}}],["架构",{"0":{"22":1},"2":{"427":1}}],["根目录下创建",{"2":{"870":2}}],["根目录下存在以",{"2":{"330":1}}],["根据指定的tsconfig",{"2":{"858":2}}],["根据typescript默认配置编译src目录中所有ts文件",{"2":{"858":2}}],["根据typescript默认配置编译文件",{"2":{"858":2}}],["根据自己目录下配置的tsconfig",{"2":{"858":2}}],["根据",{"2":{"480":1}}],["根据图层不同的范围级别",{"2":{"363":1}}],["根据语法规则转成抽象语法树",{"2":{"172":1}}],["根域名与协议相同",{"2":{"354":1}}],["根",{"2":{"21":3}}],["根节点必须是黑色的",{"2":{"7":1}}],["前行断言",{"2":{"666":2}}],["前",{"2":{"429":1}}],["前面是网络号",{"2":{"429":1}}],["前几位",{"2":{"429":1}}],["前进",{"2":{"728":1}}],["前进后退",{"2":{"268":1}}],["前进两页",{"2":{"268":1}}],["前进一页",{"2":{"268":1}}],["前期准备",{"2":{"67":1}}],["前端模块的演变",{"0":{"300":1},"1":{"301":1,"302":1,"303":1,"304":1,"305":1,"306":1,"307":1,"308":1,"309":1}}],["前端文档是一个深耕并且值得投入的领域",{"2":{"129":1}}],["前端文档的复杂度很高",{"2":{"128":1}}],["前端文档的技术该如何选择以及采坑",{"2":{"117":1}}],["前端文档展望",{"0":{"127":1},"1":{"128":1,"129":1}}],["前端文档性能",{"0":{"124":1},"1":{"125":1,"126":1}}],["前端文档应用",{"0":{"121":1},"1":{"122":1,"123":1}}],["前端文档深思考",{"0":{"117":1},"1":{"118":1,"119":1,"120":1}}],["前端文档浅思考",{"0":{"111":1},"1":{"112":1,"113":1,"114":1,"115":1,"116":1}}],["前端文档",{"0":{"110":1},"1":{"111":1,"112":1,"113":1,"114":1,"115":1,"116":1,"117":1,"118":1,"119":1,"120":1,"121":1,"122":1,"123":1,"124":1,"125":1,"126":1,"127":1,"128":1,"129":1}}],["前端团队人数",{"2":{"62":1}}],["前端工程化致力于提升工程的开发效率",{"2":{"61":1}}],["前端工程化",{"0":{"61":1},"2":{"61":1}}],["前端框架和工具选型",{"2":{"59":1}}],["前端框架与脚手架",{"2":{"58":1}}],["前端性能优化",{"0":{"48":1},"1":{"49":1,"50":1,"51":1,"52":1,"53":1,"54":1,"55":1,"56":1}}],["前端监控体系",{"0":{"39":1},"1":{"40":1,"41":1,"42":1,"43":1,"44":1,"45":1,"46":1,"47":1}}],["前端不止于技术",{"2":{"22":1}}],["前序遍历",{"2":{"21":1}}],["前后变量法",{"2":{"19":1}}],["遍历方法",{"2":{"668":2}}],["遍历",{"2":{"21":1,"357":1,"669":1}}],["树形结构",{"2":{"837":1}}],["树",{"0":{"20":1},"1":{"21":1}}],["pick",{"2":{"838":1}}],["ping",{"2":{"491":1}}],["physical",{"2":{"477":1}}],["phase",{"2":{"188":6}}],["pfifo",{"2":{"433":2}}],["p2p0",{"2":{"428":2}}],["p2p",{"2":{"427":1}}],["p|",{"2":{"262":2}}],["png",{"2":{"205":1}}],["pxelinus",{"2":{"425":1}}],["pxelinux",{"2":{"424":2,"425":1}}],["pxe",{"0":{"423":1,"425":1},"1":{"424":1,"425":1},"2":{"423":3,"424":3,"425":6}}],["px",{"2":{"188":2,"630":1}}],["polygons",{"2":{"852":8}}],["polyfill",{"2":{"806":1}}],["poll",{"0":{"824":1},"2":{"819":1,"820":1}}],["policy",{"2":{"701":1}}],["pong",{"2":{"491":1}}],["pointopoint",{"2":{"428":6}}],["pop3",{"2":{"471":1}}],["popup",{"2":{"419":4}}],["popstate",{"2":{"269":4}}],["postmessage",{"0":{"419":1},"2":{"419":6}}],["post",{"0":{"453":1},"1":{"454":1},"2":{"402":2,"461":5,"521":1,"718":1}}],["position",{"2":{"188":6,"575":1,"582":1,"718":2}}],["port",{"2":{"102":2,"271":2,"416":1,"428":6}}],["pc虚拟列表如何处理",{"0":{"186":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1}}],["please",{"2":{"876":1}}],["placeholder",{"2":{"633":2,"635":1}}],["plain",{"2":{"195":2,"200":4,"205":1,"718":2}}],["play",{"2":{"167":1}}],["plugina",{"2":{"246":2}}],["pluginargs",{"2":{"139":12}}],["plugins",{"0":{"242":1},"2":{"134":2,"141":1,"147":2,"239":4,"242":2,"253":8,"857":2}}],["plugin使用在webpack配置中",{"2":{"134":1}}],["plugin插件实现代码还是挺复杂的",{"2":{"130":1}}],["plugin",{"2":{"104":1,"107":1,"130":1,"134":2,"139":1,"142":1,"147":10,"239":8,"242":6,"251":1,"253":2,"869":1}}],["p",{"0":{"691":1},"2":{"113":1,"147":6,"210":20,"265":2,"599":6,"666":3}}],["ppt",{"2":{"110":1}}],["push",{"2":{"761":2}}],["pushstate",{"2":{"268":3}}],["put",{"0":{"455":1},"2":{"461":3,"521":1}}],["publicpath",{"2":{"143":4}}],["public",{"2":{"104":1,"108":1,"143":4,"147":4,"864":1}}],["puppeteer",{"2":{"24":1}}],["private",{"2":{"864":1}}],["priority",{"2":{"428":8,"718":1}}],["print",{"2":{"253":4}}],["prpl",{"2":{"381":1}}],["provider",{"2":{"876":14}}],["provided",{"2":{"253":2}}],["protected",{"2":{"864":1}}],["proto",{"0":{"763":1},"2":{"428":2,"715":28,"763":9,"764":6}}],["protocols",{"0":{"503":1},"2":{"490":2}}],["protocol",{"2":{"271":1,"416":1,"420":1,"434":1,"450":1,"469":1,"478":2,"571":2,"572":1,"843":2}}],["prototype",{"2":{"98":2,"666":5,"667":1,"669":2,"671":1,"715":6,"760":1,"761":14,"762":22,"763":5,"764":4,"804":1,"806":16,"810":8}}],["props",{"2":{"876":8,"877":8}}],["prop",{"2":{"876":3}}],["proptypes",{"2":{"876":6}}],["propname",{"2":{"860":2}}],["properties",{"2":{"860":2}}],["propertyname",{"2":{"718":4}}],["property",{"2":{"167":1,"326":2,"359":1,"848":3,"849":4,"860":1}}],["proxy",{"0":{"523":1,"524":1,"535":1}}],["promisc",{"2":{"428":6,"433":1}}],["promise",{"2":{"143":2,"198":1,"206":1,"669":1}}],["processing",{"0":{"504":1}}],["process",{"0":{"820":1,"828":1,"829":1,"830":1},"1":{"829":1,"830":1},"2":{"253":2,"330":1,"348":1,"353":2,"354":7,"820":4,"826":1,"828":1,"829":1}}],["processor",{"0":{"239":1},"2":{"239":6}}],["problem",{"2":{"253":2}}],["problems",{"2":{"253":6}}],["project",{"2":{"250":1,"857":2,"858":2}}],["pretty",{"2":{"858":1}}],["prettier",{"2":{"60":1}}],["prepare",{"0":{"823":1},"2":{"819":1,"820":1}}],["prepend",{"2":{"18":1}}],["prerender",{"2":{"402":1}}],["pre",{"0":{"359":1,"698":1},"2":{"423":1,"559":2,"560":1,"561":1,"563":2,"698":8}}],["preservewatchoutput",{"2":{"858":1}}],["presentation",{"2":{"472":1}}],["presentationstyle",{"2":{"198":1}}],["present",{"2":{"253":2}}],["presidents",{"2":{"666":2}}],["presto",{"2":{"347":1}}],["prefers",{"2":{"149":2}}],["prefixlen",{"2":{"428":14}}],["prefix",{"2":{"106":2}}],["previouselementsibling",{"2":{"717":1}}],["previoussibling",{"2":{"156":5,"717":1,"751":5}}],["prevent",{"2":{"253":4}}],["preventdefault",{"2":{"195":2,"221":2,"230":1}}],["prev",{"2":{"19":2}}],["prevnode",{"2":{"19":6}}],["people",{"2":{"832":1}}],["per2",{"2":{"761":12}}],["per1",{"2":{"761":14}}],["person",{"2":{"761":36}}],["percentage",{"2":{"630":1}}],["permanent",{"0":{"526":1}}],["permanently",{"0":{"519":1}}],["permissions",{"2":{"198":2}}],["performnud",{"2":{"428":14}}],["performanceentry",{"2":{"378":1}}],["performanceobserver",{"2":{"378":1,"380":2}}],["performancetiming",{"2":{"43":1}}],["per",{"2":{"354":3}}],["pending状态",{"2":{"163":1,"758":1}}],["pending",{"0":{"822":1},"2":{"95":1,"98":6,"819":1,"820":1}}],["pwa",{"2":{"50":1}}],["passive",{"2":{"712":1}}],["past",{"2":{"635":1}}],["paste",{"2":{"113":1,"718":1}}],["payment",{"0":{"530":1}}],["paint",{"0":{"359":1,"360":1,"375":1,"660":1},"2":{"379":1,"380":6,"383":1,"384":1,"386":1,"661":2}}],["patch",{"0":{"460":1},"2":{"256":2,"262":2,"265":2,"461":4}}],["pattern",{"2":{"253":8}}],["patterns",{"2":{"253":2}}],["paths",{"2":{"850":4,"857":4}}],["pathspec",{"2":{"262":8,"265":8}}],["path=",{"2":{"396":4,"843":2,"852":2,"854":2}}],["pathname",{"2":{"271":2}}],["path",{"0":{"396":1},"2":{"253":24,"369":1,"396":1,"428":4,"857":2}}],["package",{"0":{"831":1},"1":{"832":1},"2":{"250":1,"330":2,"831":1,"848":4,"849":4,"850":4}}],["padding",{"2":{"168":2,"586":5}}],["paused",{"2":{"167":1}}],["parsing",{"0":{"356":1}}],["parser",{"2":{"238":2,"253":8}}],["parseint",{"2":{"208":12}}],["parse",{"2":{"172":1,"843":4}}],["parent",{"2":{"259":2,"326":4,"713":18,"876":6}}],["parents",{"2":{"16":1,"876":2}}],["partial",{"0":{"513":1},"2":{"838":2}}],["part",{"2":{"156":6,"751":6}}],["parameters",{"2":{"838":1,"861":2}}],["param",{"2":{"143":6,"188":2}}],["pagespeed",{"2":{"382":2}}],["pageshow",{"0":{"231":1}}],["pagehide",{"0":{"231":1}}],["pagey",{"2":{"226":1}}],["pagex",{"2":{"226":1}}],["page",{"0":{"622":1},"2":{"41":1}}],["pv",{"2":{"41":1}}],["存放全局变量",{"2":{"793":1}}],["存放的是引用地址",{"2":{"791":1}}],["存放可执行代码",{"2":{"789":1}}],["存放安全数据",{"2":{"788":1}}],["存在默认default导出时",{"2":{"672":2}}],["存在文字特性",{"2":{"647":1}}],["存在两个编码问题",{"2":{"293":1}}],["存在语法错误",{"2":{"172":1}}],["存在其中一个节点",{"2":{"21":1}}],["存在左右节点",{"2":{"21":1}}],["存在",{"2":{"16":1,"848":1}}],["存储在客户端",{"2":{"393":1}}],["存储在服务器",{"2":{"71":1}}],["存储型",{"0":{"71":1}}],["存储",{"2":{"15":1}}],["存储方式",{"2":{"13":1}}],["判断",{"0":{"722":1}}],["判断服务器是否支持该请求方法以及响应",{"2":{"458":1}}],["判断兼容性",{"2":{"232":1}}],["判断是否支持dom2或者dom3事件",{"2":{"223":1}}],["判断是否支持",{"2":{"168":2}}],["判断是否继续遍历的条件",{"2":{"16":1}}],["判断奇偶",{"2":{"4":1}}],["记录一组",{"2":{"838":1}}],["记录一些定义文件的细节",{"2":{"867":1}}],["记录一些特殊的操作运算符",{"2":{"734":1}}],["记录一些之前没有注意的地方",{"2":{"662":1}}],["记录一些面试题以及面试经历",{"2":{"377":1}}],["记录原生的",{"2":{"715":1}}],["记录前端的点点滴滴",{"2":{"702":1}}],["记录访问的当前节点以及对应的父亲节点",{"2":{"16":1}}],["记录访问过的顶点",{"2":{"16":1}}],["记录离开时访问的节点",{"2":{"16":1}}],["记录进入时访问的节点",{"2":{"16":1}}],["探测环",{"0":{"16":1}}],["开关",{"2":{"464":1}}],["开启写作之旅",{"0":{"324":1}}],["开启之路",{"0":{"9":1}}],["开头^自带",{"2":{"666":1}}],["开头的",{"2":{"446":1}}],["开头",{"2":{"271":1,"676":3,"814":1}}],["开发中正确使用seo优化",{"2":{"685":1}}],["开发者工具",{"2":{"382":1}}],["开发的成本很大",{"2":{"128":1}}],["开发",{"2":{"61":1,"67":1}}],["开始下一个宏任务",{"2":{"733":1}}],["开始检查渲染",{"2":{"733":1}}],["开始",{"0":{"878":1},"2":{"715":1,"815":1}}],["开始执行",{"2":{"669":1}}],["开始绘制",{"2":{"360":1}}],["开始输入",{"2":{"228":1}}],["开始偏移高度",{"2":{"190":2}}],["开始位置偏移信息",{"2":{"191":2}}],["开始位置",{"2":{"190":2}}],["开始滚动计算",{"2":{"188":2}}],["开始注入",{"0":{"145":1}}],["开始写一个loader",{"2":{"144":2}}],["开始编译添加的入口文件",{"2":{"143":2}}],["开始编译",{"2":{"138":1}}],["开始对前端架构的思考",{"2":{"22":1}}],["开始顶点",{"2":{"15":1}}],["边框边界",{"2":{"585":1}}],["边",{"2":{"15":1}}],["顶点",{"2":{"15":1}}],["有些模块使用了其他模块设置了一些全局状态",{"2":{"840":1}}],["有些情况会得到",{"2":{"589":1}}],["有",{"2":{"761":1}}],["有的转换会感觉很奇怪",{"2":{"719":1}}],["有两个方法",{"2":{"716":1}}],["有助于跨站点脚本共计",{"2":{"701":1}}],["有设定",{"2":{"582":1}}],["有了混合加密方式的传输数据仍然不是安全的",{"2":{"562":1}}],["有效如下",{"2":{"717":2}}],["有效时间",{"2":{"564":1}}],["有效数字",{"2":{"284":1}}],["有效域",{"2":{"283":1}}],["有效的降低整体计算耗时",{"2":{"53":1}}],["有效的减少网络请求耗时",{"2":{"50":1}}],["有热点代码",{"2":{"174":1}}],["有可能",{"2":{"162":1,"757":1}}],["有兴趣可以看看",{"2":{"191":1}}],["有兴趣可以查看webpack源码",{"2":{"130":1}}],["有兴趣打开原文阅读",{"2":{"110":1}}],["有向图探测",{"2":{"16":1}}],["有向图",{"2":{"15":1}}],["有左节点且",{"2":{"12":1}}],["图像不会改变方向",{"2":{"581":1}}],["图像",{"2":{"381":1}}],["图像下载完毕触发",{"2":{"224":1}}],["图片",{"2":{"51":1}}],["图",{"0":{"15":1},"1":{"16":1}}],["d3",{"2":{"852":4}}],["dmz",{"2":{"808":1}}],["dfn",{"0":{"696":1}}],["d+",{"2":{"666":8}}],["dtls",{"0":{"570":1},"2":{"569":2}}],["dv",{"2":{"568":2}}],["dlt",{"2":{"476":1}}],["dlh",{"2":{"476":1}}],["duplex",{"2":{"428":4}}],["duration",{"2":{"167":2,"168":2}}],["d2d",{"2":{"428":2}}],["ddns",{"2":{"424":1}}],["ddd",{"2":{"34":1}}],["dynamic",{"2":{"420":1,"424":2}}],["dhcp",{"0":{"420":1,"422":1},"1":{"421":1,"422":1,"423":1,"424":1,"425":1},"2":{"420":1,"422":10,"424":3,"425":1,"427":1}}],["dcl",{"0":{"385":1}}],["drop",{"2":{"635":1}}],["draw",{"0":{"366":1},"2":{"365":1,"366":1,"368":1}}],["dry",{"2":{"253":2}}],["driven",{"2":{"34":2}}],["db9a",{"2":{"428":2}}],["dblclick",{"2":{"226":1}}],["dbclick",{"2":{"226":1}}],["d",{"0":{"444":1,"870":1},"2":{"208":2,"211":12,"429":2,"439":1,"666":10,"815":1,"835":2,"843":4,"844":2,"847":4,"849":11,"852":2,"860":2,"869":4,"870":3,"871":1,"874":4}}],["day",{"2":{"666":4}}],["dad",{"2":{"428":14}}],["danger",{"2":{"343":2}}],["dark",{"2":{"149":2}}],["dataset",{"2":{"716":1,"717":8}}],["dataview",{"2":{"671":7}}],["datatransfer",{"2":{"195":2,"197":1}}],["data",{"2":{"147":2,"190":2,"191":8,"195":6,"200":4,"454":1,"476":1,"820":1}}],["datetime=",{"2":{"694":2}}],["date",{"2":{"82":6,"86":2,"92":4,"98":4,"195":2,"399":9}}],["digicert",{"2":{"568":1}}],["digest",{"2":{"494":4}}],["direct",{"2":{"876":1}}],["directives",{"0":{"854":1},"2":{"253":4}}],["direction",{"2":{"167":1,"594":4,"595":2}}],["directory",{"2":{"253":4}}],["dir",{"2":{"253":2,"309":1,"635":1}}],["dist",{"2":{"850":2,"857":2}}],["dispatchevent",{"2":{"715":2}}],["display",{"0":{"368":1,"653":1},"2":{"168":24,"326":2,"353":2,"367":1,"575":5,"591":2,"592":2,"593":2,"594":4,"595":2,"602":2,"643":4,"644":2,"647":3,"650":2,"651":2}}],["discipline",{"2":{"433":1}}],["discover",{"2":{"428":4}}],["disconnect",{"0":{"157":1,"752":1},"2":{"157":4,"158":2,"159":3,"752":4,"753":2,"754":3}}],["disabling",{"2":{"253":2}}],["disabled",{"2":{"428":2,"635":1}}],["disable",{"0":{"248":1},"2":{"246":14,"253":8}}],["disjoin",{"0":{"17":1}}],["dive",{"0":{"873":1},"1":{"874":1}}],["div",{"2":{"104":4,"111":1,"114":2,"131":4,"146":4,"147":8,"158":12,"168":10,"188":16,"216":8,"217":4,"218":4,"219":4,"339":4,"591":8,"592":16,"593":16,"594":36,"595":12,"599":6,"605":1,"606":1,"607":1,"675":8,"713":12,"715":7,"717":21,"718":2,"753":12,"877":12}}],["diff",{"2":{"92":10}}],["dns",{"2":{"50":4,"427":1,"562":1}}],["deep",{"0":{"873":1},"1":{"874":1}}],["demilitarized",{"2":{"808":1}}],["declare",{"2":{"842":6,"843":2,"852":2,"863":2,"870":4}}],["decodeuricomponent",{"0":{"709":1}}],["decodeuri",{"0":{"707":1}}],["decimal128",{"0":{"278":1}}],["decimal64",{"0":{"278":1}}],["decimal",{"2":{"208":2,"299":1,"641":1}}],["destroy",{"2":{"826":1}}],["description",{"2":{"667":1,"701":1,"832":1}}],["design",{"2":{"34":2}}],["dependency",{"2":{"854":1}}],["dependencies",{"2":{"303":2}}],["deprecated",{"2":{"253":2}}],["debugging",{"2":{"253":2}}],["debug",{"2":{"253":2,"354":1}}],["debounced",{"2":{"98":10}}],["debounceii",{"2":{"82":2}}],["debouncei",{"2":{"79":2}}],["debounce",{"0":{"96":1},"2":{"76":2,"77":2,"83":2,"94":1,"96":2,"98":2}}],["definitelytyped",{"2":{"870":2}}],["defineproperty",{"2":{"762":1,"763":2}}],["definedfunction",{"2":{"797":1}}],["defined",{"2":{"635":1,"775":2,"797":1,"801":2,"837":1}}],["define",{"0":{"303":1},"2":{"253":2,"301":2,"303":5,"304":3,"854":1}}],["defer",{"0":{"311":1,"678":1,"679":1},"2":{"310":1,"376":1,"678":2,"679":4,"717":8}}],["default",{"2":{"253":22,"306":2,"339":2,"635":1,"672":5,"701":1,"854":2,"857":4,"858":2,"861":1,"870":2}}],["defaultprevented",{"2":{"221":1}}],["detail信息",{"2":{"226":1}}],["detail",{"2":{"221":1,"226":1}}],["detachevent",{"2":{"219":1}}],["device",{"2":{"433":1}}],["devicemotion",{"2":{"233":1}}],["deviceorientation",{"2":{"233":1}}],["dev",{"2":{"104":4,"106":2}}],["delay",{"2":{"56":1,"76":4,"79":4,"82":6,"86":4,"89":4,"92":8,"167":2,"390":1}}],["deletefromdocument",{"2":{"114":1}}],["deletehead",{"2":{"18":1}}],["deletetail",{"2":{"18":1}}],["deleteword",{"2":{"14":1}}],["delete",{"0":{"456":1},"2":{"12":1,"13":1,"18":1,"113":1,"114":1,"461":1,"521":1,"668":4}}],["don",{"0":{"872":1}}],["done",{"2":{"106":2,"669":15}}],["dorey",{"2":{"719":1}}],["do",{"0":{"702":1,"872":1},"2":{"675":2}}],["dotall",{"2":{"666":1}}],["does",{"2":{"326":2}}],["doeswordexist",{"2":{"14":1}}],["double",{"2":{"245":2}}],["doubly",{"2":{"19":2}}],["doctype",{"2":{"131":2,"146":2,"147":2}}],["documentmode",{"2":{"232":4}}],["documentelement",{"2":{"224":1,"715":2,"718":3}}],["document",{"0":{"194":1,"417":1},"1":{"195":1},"2":{"43":1,"44":1,"72":1,"112":2,"113":3,"114":6,"115":1,"131":2,"134":2,"151":1,"155":8,"156":12,"157":6,"158":8,"159":12,"168":6,"194":1,"195":8,"196":1,"213":1,"214":1,"217":2,"218":2,"219":2,"223":4,"224":3,"230":1,"232":4,"351":1,"394":2,"396":2,"399":2,"400":2,"675":4,"713":4,"715":20,"717":3,"718":10,"746":1,"750":8,"751":12,"752":6,"753":8,"754":12}}],["domcharacterdatamodified",{"2":{"229":1}}],["domcontentloaded",{"2":{"43":1,"230":1,"311":2,"312":1,"385":1}}],["domcontentloadedeventend",{"2":{"43":1}}],["domcontentloadedeventstart",{"2":{"43":1}}],["domnoderemoved之后触发",{"2":{"229":1}}],["domnoderemovedfromdocument",{"2":{"229":1}}],["domnoderemoved",{"2":{"229":1}}],["domnodeinserted之后触发",{"2":{"229":1}}],["domnodeinsertedintodocument",{"2":{"229":1}}],["domnodeinserted",{"2":{"229":1}}],["dom结构发生任何变化",{"2":{"229":1}}],["domsubtreemodified",{"2":{"229":1}}],["dom发生变化时给出提示",{"2":{"229":1}}],["dommousescroll",{"2":{"226":1}}],["domfocusout",{"2":{"225":2}}],["domfocusin",{"2":{"225":2}}],["domattrmodified",{"2":{"229":1}}],["domactivate",{"2":{"224":1}}],["domain",{"0":{"397":1,"417":1},"2":{"34":1,"551":1}}],["dom3级",{"2":{"227":1,"228":1}}],["dom3级事件中已经移除",{"2":{"224":1}}],["dom3遗弃",{"2":{"225":2}}],["dom3",{"0":{"718":1},"2":{"223":2}}],["dom0",{"0":{"217":1}}],["dom2",{"0":{"115":1,"218":1,"710":1,"718":1},"1":{"711":1,"712":1,"713":1},"2":{"223":2}}],["dom",{"0":{"72":1,"212":1,"221":1,"371":1,"714":1,"715":1,"716":1,"717":1},"1":{"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1,"225":1,"226":1,"227":1,"228":1,"229":1,"230":1,"231":1,"232":1,"233":1,"234":1,"715":1,"716":1,"717":1,"718":1},"2":{"52":2,"56":1,"72":1,"114":5,"115":6,"151":3,"153":2,"158":2,"168":2,"212":1,"312":1,"356":2,"357":1,"654":1,"655":1,"715":1,"716":1,"717":1,"746":3,"748":2,"753":2,"857":2,"877":7}}],["dominteractive",{"2":{"43":1}}],["domloading",{"2":{"43":1}}],["lf",{"2":{"814":1}}],["lhs",{"0":{"768":1},"2":{"768":1,"770":1}}],["lr",{"2":{"580":1}}],["llc",{"2":{"476":1}}],["llw0",{"2":{"428":4}}],["l1",{"2":{"433":1}}],["lcp",{"0":{"379":1},"1":{"380":1,"381":1,"382":1},"2":{"380":6,"381":1}}],["lsls",{"2":{"322":1}}],["ls",{"2":{"318":2,"322":3}}],["ln",{"2":{"318":2,"322":2}}],["l",{"0":{"387":1},"2":{"210":15,"211":6,"318":2,"322":2}}],["later",{"2":{"876":1}}],["label",{"2":{"718":1}}],["lang",{"2":{"635":1}}],["lang=",{"2":{"131":2,"146":2,"147":4}}],["layer",{"2":{"471":1,"472":1,"473":1,"474":1,"475":1,"476":1,"477":1}}],["layout",{"0":{"358":1,"374":1,"579":1,"658":1},"2":{"253":2,"391":1,"575":1,"658":1,"661":2}}],["lax",{"2":{"402":2}}],["largest",{"2":{"379":1,"380":6}}],["lastchild",{"2":{"717":1}}],["lastcalltime",{"2":{"98":14}}],["lastelementchild",{"2":{"717":1}}],["lastthis",{"2":{"98":10}}],["lastargs",{"2":{"98":14}}],["lastinvoketime",{"2":{"98":10}}],["last",{"2":{"92":2,"326":2,"635":5}}],["literal",{"0":{"862":1}}],["litte",{"2":{"671":1}}],["license",{"2":{"832":1}}],["li",{"2":{"643":1,"644":14,"646":48,"647":2,"648":12,"649":2,"650":3}}],["list",{"0":{"642":1},"2":{"575":1}}],["listen",{"2":{"102":2}}],["lighthouse",{"2":{"382":1}}],["lightless",{"2":{"210":1}}],["linux",{"0":{"314":1},"1":{"315":1,"316":1,"317":1,"318":1,"319":1,"320":1,"321":1,"322":1,"323":1},"2":{"314":1,"316":1,"320":1,"425":1}}],["lint",{"2":{"253":2}}],["line",{"0":{"629":1},"1":{"630":1},"2":{"246":4,"326":4,"627":1,"633":1}}],["links",{"0":{"315":1,"319":1},"1":{"316":1,"317":1,"318":1,"320":1,"321":1,"322":1},"2":{"314":1}}],["link",{"0":{"310":1},"1":{"311":1,"312":1,"313":1},"2":{"134":2,"224":2,"402":1,"421":2,"476":2,"635":3}}],["linked",{"2":{"19":2}}],["linkedlist",{"2":{"13":2}}],["libname",{"2":{"870":4}}],["lib=",{"2":{"854":4}}],["libuv",{"2":{"825":1}}],["library",{"2":{"303":2}}],["lib",{"2":{"143":2,"147":2,"250":1,"672":4,"844":4,"854":1,"857":4}}],["lt",{"0":{"723":1},"2":{"92":2,"98":2,"104":12,"113":4,"131":28,"134":6,"146":28,"147":50,"168":36,"188":20,"191":10,"195":8,"210":10,"211":2,"216":8,"217":4,"218":4,"219":4,"253":2,"256":18,"257":1,"259":4,"262":18,"265":14,"326":18,"339":16,"402":11,"422":1,"428":66,"433":1,"591":14,"592":22,"593":22,"594":48,"595":18,"599":16,"644":20,"646":76,"648":16,"666":32,"675":4,"677":12,"678":12,"679":16,"680":8,"681":24,"682":18,"683":30,"684":8,"689":4,"693":12,"694":4,"698":22,"713":18,"715":4,"717":22,"723":2,"815":1,"820":1,"838":16,"843":2,"852":2,"854":10,"859":4,"860":2,"865":9,"866":28,"871":2,"876":14,"877":14}}],["lock",{"2":{"850":2}}],["local",{"2":{"635":1}}],["localhost",{"2":{"104":1,"106":2,"196":1,"490":2,"499":1}}],["location",{"0":{"271":1},"2":{"106":1,"227":1,"253":4,"269":1,"271":11,"508":1,"517":1}}],["lower",{"2":{"433":1,"641":2}}],["lo",{"2":{"429":1}}],["lo0",{"2":{"428":3}}],["loading",{"0":{"842":1},"2":{"230":1}}],["load",{"2":{"224":1,"312":1}}],["loaded",{"2":{"230":1}}],["loader绝对地址为",{"2":{"143":2}}],["loader",{"0":{"144":1},"2":{"137":3,"143":10,"144":11,"147":6}}],["loadeventend",{"2":{"43":1}}],["loadeventstart",{"2":{"43":1}}],["loopback",{"2":{"428":2,"429":1}}],["loop",{"0":{"724":1,"733":1},"1":{"725":1,"726":1,"727":1,"728":1,"729":1,"730":1,"731":1,"732":1,"733":1},"2":{"98":2,"351":1}}],["login",{"2":{"476":1}}],["loglevel",{"2":{"104":2}}],["log",{"2":{"98":14,"104":2,"153":2,"155":4,"156":2,"157":2,"158":2,"159":2,"200":2,"201":2,"202":2,"203":2,"246":4,"339":2,"380":2,"668":4,"684":2,"713":8,"748":2,"750":4,"751":2,"752":2,"753":2,"754":2,"761":18,"762":6,"763":2,"775":2,"776":2,"797":2,"801":2,"802":4,"803":2,"866":2,"874":2}}],["lodash",{"0":{"77":1,"80":1,"83":1,"87":1,"90":1,"93":1,"94":1,"95":1,"96":1,"97":1},"1":{"95":1,"96":1,"97":1,"98":1},"2":{"73":1,"94":1}}],["lex",{"2":{"874":2}}],["len",{"2":{"859":4}}],["length",{"2":{"131":2,"268":1,"271":1,"550":1,"630":1,"718":2,"837":1,"859":4,"865":2,"866":8}}],["learning",{"2":{"428":4}}],["lease",{"2":{"424":4}}],["leaveraf",{"2":{"168":2}}],["leave",{"2":{"168":19}}],["leadingedge",{"2":{"98":4}}],["leading",{"2":{"77":2,"83":2,"87":2,"93":2,"95":1,"96":2,"97":2,"98":10,"641":1}}],["lerna",{"2":{"65":1}}],["lettersonlyvalidator",{"2":{"852":2}}],["lettersregexp",{"2":{"852":4}}],["letter",{"2":{"633":1}}],["let",{"0":{"663":1},"2":{"19":3,"76":2,"79":2,"82":4,"86":4,"89":2,"92":4,"98":22,"102":4,"104":5,"106":4,"131":2,"143":4,"147":2,"149":2,"153":1,"155":1,"156":1,"157":1,"158":6,"159":1,"160":1,"168":2,"188":14,"190":16,"191":26,"195":4,"200":4,"201":1,"208":16,"419":2,"663":2,"664":2,"666":1,"667":3,"672":10,"675":2,"739":6,"740":1,"741":1,"743":1,"748":1,"750":1,"751":1,"752":1,"753":6,"754":1,"755":1,"843":2,"852":2,"859":14,"860":12,"861":1,"862":1,"864":2,"866":16,"874":6}}],["leftheight",{"2":{"20":1}}],["left",{"2":{"8":6,"586":2,"590":2,"592":2,"594":2,"598":1,"599":2,"603":1,"635":1,"718":6,"742":2}}],["gc",{"2":{"795":1,"866":4}}],["gulpfile",{"2":{"850":2}}],["gulp1",{"2":{"850":2}}],["gui更新则会被保存在一个队列中等待js引擎线程空闲时立即被执行",{"2":{"732":1}}],["gui渲染线程会被挂起",{"2":{"732":1}}],["gui",{"0":{"732":1},"2":{"730":2,"733":1}}],["guid",{"2":{"494":3}}],["gup",{"2":{"368":1}}],["gprs",{"2":{"476":1}}],["gpu",{"2":{"52":1,"353":2,"729":1}}],["gateway",{"0":{"541":1,"543":1},"2":{"465":1}}],["gmt",{"2":{"399":1}}],["gl",{"2":{"368":1}}],["globally",{"2":{"494":1}}],["global",{"2":{"253":4,"429":1,"810":2,"871":1}}],["globalreturn",{"2":{"237":1}}],["globals",{"0":{"241":1},"2":{"236":1,"241":2}}],["go",{"0":{"733":1},"2":{"268":4}}],["google",{"2":{"110":1,"268":1,"271":3,"347":1}}],["gird",{"2":{"575":1}}],["gif0",{"2":{"428":2}}],["given",{"2":{"253":2}}],["gitignore",{"2":{"832":1}}],["github",{"2":{"719":1}}],["git",{"0":{"254":1,"255":1,"258":1,"261":1,"264":1},"1":{"255":1,"256":2,"257":2,"258":1,"259":2,"260":2,"261":1,"262":2,"263":2,"264":2,"265":2,"266":2},"2":{"60":1,"65":1,"254":2,"256":5,"257":2,"259":3,"262":5,"263":3,"265":7}}],["gitlab",{"2":{"24":1}}],["genericclass",{"2":{"866":6}}],["generic",{"2":{"866":5}}],["genericidentityfn",{"2":{"866":8}}],["generics",{"0":{"866":1}}],["generator",{"2":{"701":1}}],["generated",{"2":{"850":4}}],["generate",{"0":{"669":1},"2":{"669":1}}],["gen",{"2":{"669":10}}],["genstureend",{"2":{"234":1}}],["gensturechange",{"2":{"234":1}}],["gensturestart",{"2":{"234":1}}],["geotrust",{"2":{"568":1}}],["gecko",{"2":{"347":1}}],["getkey",{"2":{"866":2}}],["getkeys",{"2":{"13":1}}],["getobject",{"2":{"763":1}}],["getownpropertysymbols",{"2":{"667":1}}],["getprototypeof",{"2":{"762":1}}],["getpropertyvalue",{"2":{"718":1}}],["getpropertycssvalue",{"2":{"718":1}}],["getchildcontext",{"2":{"876":2}}],["getcounter",{"2":{"860":4}}],["getcomputedstyle",{"2":{"718":2}}],["getclipboardtext",{"2":{"718":2}}],["getboundingclientrect",{"2":{"718":7}}],["getuint8",{"2":{"671":2}}],["getentries",{"2":{"380":2}}],["getelementsbytagname",{"2":{"168":2}}],["getelementbyid",{"2":{"168":2,"195":2,"217":2,"218":2,"219":2,"713":4,"715":2,"717":2}}],["gettype",{"2":{"198":1}}],["getdata",{"2":{"197":1,"718":3}}],["getattribute",{"2":{"195":2,"716":1}}],["getitemmeta",{"2":{"191":8}}],["getstopindexforoffset",{"2":{"190":2,"191":2}}],["getstartindexforoffset",{"2":{"190":4,"191":4}}],["getselection",{"2":{"114":3}}],["getrangeat",{"2":{"114":3}}],["getvalues",{"2":{"13":1}}],["get",{"0":{"451":1},"2":{"13":1,"20":5,"402":3,"452":1,"461":2,"513":1,"521":1,"668":2,"718":1,"763":6,"866":4}}],["g",{"2":{"210":8,"211":16,"659":1,"666":1,"669":4,"815":1,"835":2}}],["grid",{"2":{"575":1}}],["gre",{"2":{"427":1}}],["green",{"2":{"208":18,"209":8,"718":2,"859":2}}],["grub",{"2":{"423":2}}],["grammar",{"2":{"633":1}}],["gray",{"2":{"16":2}}],["graph",{"2":{"15":1}}],["gtp",{"2":{"427":1}}],["gt",{"0":{"614":1,"723":1},"2":{"13":2,"76":2,"79":2,"82":4,"86":2,"89":2,"92":6,"98":4,"102":2,"104":17,"112":2,"113":4,"131":30,"132":3,"134":6,"143":6,"145":4,"146":28,"147":50,"153":2,"155":2,"156":3,"157":4,"158":4,"159":6,"160":1,"162":1,"168":36,"176":1,"182":1,"188":22,"191":2,"195":8,"200":4,"201":4,"202":4,"203":4,"210":2,"211":2,"216":8,"217":4,"218":4,"219":4,"226":1,"227":3,"229":3,"230":1,"231":2,"232":2,"233":1,"234":2,"237":3,"250":1,"252":3,"253":2,"256":18,"257":1,"259":4,"262":18,"265":14,"289":1,"290":1,"326":18,"339":16,"380":2,"402":10,"422":2,"423":2,"428":66,"429":3,"433":1,"491":2,"580":1,"591":14,"592":22,"593":22,"594":48,"595":18,"599":16,"644":20,"646":76,"648":16,"666":24,"669":3,"672":6,"675":4,"677":12,"678":12,"679":16,"680":8,"681":24,"682":18,"683":30,"684":8,"689":4,"693":13,"694":5,"698":23,"713":22,"715":38,"716":2,"717":22,"718":1,"723":2,"733":2,"748":2,"750":2,"751":3,"752":4,"753":4,"754":6,"755":1,"757":1,"770":1,"805":3,"815":1,"820":1,"838":16,"842":2,"843":2,"848":2,"849":2,"852":2,"854":10,"857":18,"859":7,"860":8,"861":4,"863":1,"865":11,"866":33,"870":2,"871":2,"876":16,"877":24}}],["ms",{"2":{"827":1}}],["mshtml",{"2":{"347":1}}],["myidentityiii",{"2":{"866":4}}],["myidentityii",{"2":{"866":2}}],["myidentityu",{"2":{"866":2}}],["myidentityt",{"2":{"866":2}}],["myurl",{"2":{"843":2}}],["my",{"2":{"840":2}}],["myapp",{"2":{"832":2}}],["mybind",{"2":{"806":4}}],["myname",{"2":{"717":6}}],["mydiv",{"2":{"717":2,"718":14}}],["mjs",{"2":{"675":4,"677":2,"678":3,"680":4,"681":8,"683":8,"684":4}}],["mtu",{"2":{"428":26,"433":4}}],["mbr",{"2":{"423":1}}],["m",{"2":{"259":2,"815":3}}],["method",{"0":{"414":1,"533":1},"2":{"718":2}}],["methods",{"0":{"410":1}}],["method=",{"2":{"402":2}}],["metakey",{"2":{"226":1}}],["meta",{"0":{"701":1},"2":{"131":4,"146":4,"147":8}}],["meaningful",{"2":{"386":1}}],["merge",{"2":{"265":2}}],["message",{"2":{"230":1,"419":7}}],["me",{"2":{"195":2,"200":2,"201":2}}],["media",{"0":{"537":1,"621":1},"2":{"149":2,"467":1,"626":1}}],["mediaquerylist",{"2":{"149":4}}],["memory",{"2":{"104":1}}],["michael",{"2":{"717":2}}],["microsoft",{"2":{"347":3}}],["mixed",{"2":{"265":2,"266":1}}],["miscellaneous",{"2":{"253":2}}],["mime",{"0":{"205":1,"684":1},"2":{"195":2,"198":1,"205":1,"206":1}}],["middle",{"2":{"167":1}}],["middleware",{"2":{"104":5}}],["middware",{"2":{"104":3}}],["minorphase",{"2":{"188":8}}],["min",{"2":{"98":2,"190":6,"191":2,"211":14,"583":2,"586":2}}],["man",{"2":{"832":1}}],["manual",{"2":{"268":1}}],["may",{"2":{"694":3}}],["male",{"2":{"666":2}}],["masks",{"2":{"550":1}}],["mask",{"2":{"424":2,"545":1}}],["master",{"2":{"257":4,"554":2,"559":3,"560":1,"561":1,"563":3}}],["mac连接到linux环境",{"2":{"333":1}}],["mac",{"0":{"333":1,"432":1,"467":1},"2":{"422":6,"428":1,"432":3,"433":2,"464":2,"476":1,"479":1,"480":6}}],["majorphase",{"2":{"188":6}}],["marin",{"2":{"600":1}}],["marign",{"2":{"586":1}}],["marker",{"2":{"633":1}}],["markdown",{"2":{"239":2,"336":1}}],["marking",{"2":{"185":1}}],["mark",{"2":{"183":2}}],["margin",{"0":{"589":1,"590":1,"600":1,"647":1},"1":{"590":1,"591":1,"592":1,"593":1,"594":1,"595":1},"2":{"168":2,"326":4,"583":6,"586":5,"589":1,"590":10,"591":2,"592":8,"593":4,"594":6,"595":2,"600":2,"647":2}}],["matchall",{"0":{"666":1},"2":{"666":1}}],["match",{"0":{"666":1},"2":{"522":1,"666":1}}],["matchesselector",{"2":{"717":1}}],["matches",{"2":{"149":2}}],["matchmedia",{"0":{"149":1},"2":{"149":2}}],["mathlib",{"2":{"844":6}}],["math",{"2":{"98":4,"188":6,"190":18,"191":6,"208":6,"211":4,"299":1,"844":4}}],["make",{"0":{"138":1},"2":{"138":1}}],["main",{"2":{"104":4,"353":1,"832":1,"848":4,"850":4}}],["maxaddr",{"2":{"428":2}}],["maxoffset",{"2":{"191":2}}],["max",{"0":{"400":1,"412":1},"2":{"98":2,"188":2,"190":8,"191":4,"211":16,"253":2,"400":2,"583":2,"586":2}}],["maxing",{"2":{"95":1,"98":14}}],["maxwait",{"2":{"87":2,"93":2,"95":2,"97":2,"98":12}}],["maproots",{"2":{"857":2}}],["mapping",{"2":{"850":2}}],["mapped",{"2":{"837":1}}],["map",{"0":{"668":1},"2":{"13":2,"158":2,"668":5,"753":2,"857":2}}],["moudle",{"0":{"840":1}}],["mousewheel",{"2":{"226":1}}],["mouseup",{"2":{"226":3,"234":1}}],["mouseover",{"2":{"226":1,"234":1}}],["mouseout",{"2":{"226":1}}],["mousemove",{"2":{"226":1,"234":1}}],["mouseleave",{"2":{"226":1}}],["mouseenter",{"2":{"226":1}}],["mouseevent",{"2":{"223":2}}],["mousedown",{"2":{"226":3,"234":1}}],["month",{"2":{"666":4}}],["monorepo",{"2":{"65":1}}],["moved",{"0":{"519":1,"520":1}}],["mozorientation",{"2":{"233":1}}],["moduelb",{"2":{"848":1}}],["modulea",{"2":{"848":2,"849":2}}],["moduleb",{"2":{"847":10,"848":13,"849":33}}],["modulename",{"2":{"842":4}}],["modules",{"0":{"839":1,"843":1,"844":1,"853":1},"1":{"840":1,"841":1,"842":1,"843":1,"844":1},"2":{"672":2,"832":1,"846":1,"848":9,"849":24,"850":2,"853":1,"857":4}}],["module",{"0":{"673":1,"679":1,"680":1,"842":1,"845":1,"870":1},"1":{"674":1,"675":1,"676":1,"677":1,"678":1,"679":1,"680":1,"681":1,"682":1,"683":1,"684":1,"846":1,"847":1,"848":1,"849":1,"850":1,"851":1},"2":{"134":1,"144":6,"147":2,"237":1,"301":2,"303":3,"305":6,"309":2,"672":17,"675":2,"677":4,"678":2,"679":5,"680":6,"681":7,"682":6,"683":8,"684":2,"840":2,"843":2,"854":2,"857":2,"869":4,"870":2}}],["modified",{"0":{"522":1},"2":{"522":1}}],["mode",{"0":{"580":1},"1":{"581":1},"2":{"167":1,"309":1,"580":1}}],["model",{"2":{"72":1,"356":1,"584":1}}],["mochawesome",{"2":{"24":1}}],["mocha",{"2":{"24":1}}],["must",{"2":{"850":2}}],["mutaintionobserver",{"0":{"158":1,"753":1}}],["mutationrecords",{"2":{"156":14,"158":4,"751":14,"753":4}}],["mutation",{"0":{"156":1,"751":1},"2":{"156":1,"229":1,"751":1}}],["mutationobserver规范的记录队列实现确保即使是大量的突变事件也不会阻塞浏览器",{"2":{"164":1,"759":1}}],["mutationobserverinit",{"2":{"156":1,"751":1}}],["mutationobserver",{"0":{"150":1,"159":1,"161":1,"745":1,"754":1,"756":1},"1":{"151":1,"152":1,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":2,"163":2,"164":2,"746":1,"747":1,"748":1,"749":1,"750":1,"751":1,"752":1,"753":1,"754":1,"755":1,"756":1,"757":2,"758":2,"759":2},"2":{"43":1,"153":2,"155":2,"156":2,"157":2,"158":4,"159":4,"160":2,"748":2,"750":2,"751":2,"752":2,"753":4,"754":4,"755":2}}],["mutated",{"2":{"153":2,"748":2}}],["multicol",{"2":{"575":1}}],["multicast",{"2":{"428":22,"433":2}}],["multiple",{"0":{"518":1},"2":{"718":1}}],["multipart",{"2":{"454":1}}],["multi",{"0":{"158":1,"514":1,"753":1},"2":{"876":1}}],["multirepo",{"2":{"65":1}}],["mdia",{"2":{"476":1}}],["mdn",{"2":{"194":1}}],["md",{"2":{"8":2,"239":2,"338":1,"339":3,"850":2,"857":1,"870":1}}],["md1",{"2":{"8":2}}],["bs",{"2":{"814":1}}],["bfc",{"0":{"574":1,"575":1},"1":{"575":1,"576":1},"2":{"574":2,"575":4,"576":1,"583":1}}],["bfcache",{"2":{"231":1}}],["b24c",{"2":{"428":2}}],["b93a",{"2":{"428":2}}],["b57b",{"2":{"428":2}}],["bgp",{"2":{"427":1}}],["bird",{"2":{"863":2}}],["bitmap",{"2":{"728":1}}],["bill",{"2":{"666":2}}],["bios",{"2":{"423":2}}],["bigint",{"2":{"788":1}}],["big",{"2":{"299":1,"671":1}}],["bin",{"2":{"832":3}}],["bind",{"0":{"806":1},"2":{"168":2,"806":7}}],["binary16",{"2":{"279":1}}],["binarytreenode",{"2":{"20":1}}],["binarysearchtreenode",{"2":{"20":1}}],["binarysearchtree",{"2":{"20":1}}],["bytelength",{"2":{"671":1}}],["byte",{"2":{"432":1}}],["bytes",{"2":{"356":1}}],["by",{"2":{"253":2}}],["brid",{"2":{"863":2}}],["bridge0",{"2":{"428":2}}],["broswers",{"2":{"677":2}}],["broadcast",{"2":{"428":16,"433":2}}],["browser",{"0":{"269":1},"2":{"240":1,"347":2,"349":1,"353":1,"832":1}}],["branch",{"2":{"256":4}}],["break",{"2":{"211":6}}],["btn",{"2":{"195":10}}],["bel",{"2":{"814":1}}],["benjamin",{"2":{"666":2}}],["been",{"2":{"666":2}}],["between",{"0":{"592":1},"2":{"592":2}}],["be",{"2":{"253":4,"806":2,"850":2}}],["bezier",{"2":{"167":1}}],["beforepaste",{"2":{"718":1}}],["beforecut",{"2":{"718":1}}],["beforecopy",{"2":{"718":1}}],["before",{"2":{"633":1,"639":1,"739":2,"841":2}}],["beforeunload",{"2":{"230":1}}],["beforeemit",{"2":{"139":2}}],["beforeassettaggeneration",{"2":{"139":2}}],["b",{"0":{"442":1},"2":{"143":8,"147":2,"156":12,"158":4,"210":8,"211":16,"257":4,"304":4,"305":8,"306":6,"429":3,"439":1,"440":1,"546":1,"548":1,"566":2,"669":10,"672":20,"723":10,"737":10,"751":12,"753":4,"761":10,"776":2,"815":1,"835":2,"847":2,"848":2,"849":2,"859":2,"860":10,"864":4,"865":2,"866":2}}],["bound",{"2":{"806":8,"810":6}}],["border",{"2":{"644":2,"647":2,"718":2}}],["booting",{"2":{"424":2}}],["boot",{"2":{"422":2,"423":1}}],["bootp",{"2":{"422":5,"424":4}}],["bool",{"2":{"218":1,"667":1,"712":1,"716":1}}],["boolean",{"2":{"149":2,"221":4,"222":2,"237":1,"248":2,"309":1,"712":1,"788":1,"844":2,"857":2,"859":1,"860":2,"862":1,"865":1,"872":1}}],["bottom",{"2":{"326":8,"583":3,"586":2,"590":2,"594":2,"718":4}}],["both",{"2":{"167":1,"602":2,"603":1}}],["boxes",{"2":{"326":2}}],["box",{"2":{"326":8,"584":1,"627":2,"628":1}}],["bom",{"0":{"212":1},"1":{"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1,"225":1,"226":1,"227":1,"228":1,"229":1,"230":1,"231":1,"232":1,"233":1,"234":1}}],["bold",{"2":{"113":1}}],["body",{"0":{"454":1},"2":{"104":4,"131":4,"134":2,"146":4,"147":8,"155":6,"156":14,"157":6,"158":4,"159":12,"339":4,"675":2,"715":6,"718":5,"750":6,"751":14,"752":6,"753":4,"754":12}}],["bar",{"2":{"666":4,"739":4,"741":2,"797":4}}],["bad",{"0":{"528":1,"541":1}}],["baidu",{"2":{"341":2}}],["basketball",{"2":{"345":1}}],["basevalue",{"2":{"861":2}}],["baseurl",{"0":{"850":1},"2":{"846":1,"850":4,"857":4}}],["base64",{"2":{"494":3}}],["baseline",{"2":{"326":15}}],["base",{"2":{"256":2,"857":2,"862":2}}],["basic",{"0":{"859":1},"2":{"253":2}}],["bashtsc",{"2":{"851":1}}],["bashlo0",{"2":{"428":1}}],["bashls",{"2":{"318":1,"322":1}}],["bashddns",{"2":{"424":1}}],["bashsudo",{"2":{"421":2}}],["bashssh",{"2":{"333":1}}],["bash",{"2":{"339":1,"858":4}}],["basherror",{"2":{"328":1}}],["basheslint",{"2":{"253":1}}],["bashgit",{"2":{"256":1,"259":1,"262":1,"265":1}}],["bashnpm",{"2":{"109":1}}],["babel",{"2":{"238":1,"841":1}}],["backdrop",{"2":{"633":1}}],["back",{"2":{"231":1,"268":1}}],["background",{"2":{"168":2,"616":2,"718":2}}],["backgroundcolor",{"2":{"114":2,"718":2}}],["backwards",{"2":{"167":1}}],["backcolor",{"2":{"113":1}}],["balancefactor",{"2":{"20":1}}],["buf",{"2":{"671":4}}],["buffered",{"2":{"380":2}}],["buffer",{"2":{"206":1,"671":6}}],["bubbles",{"2":{"221":1}}],["button",{"2":{"168":12,"195":8,"226":1}}],["bugs",{"2":{"832":1}}],["bug",{"2":{"64":1,"832":1}}],["bucket",{"2":{"13":2}}],["buckets",{"2":{"13":2}}],["blank",{"2":{"635":1}}],["black",{"2":{"6":1,"16":2,"718":2}}],["blink",{"2":{"347":4}}],["blur",{"2":{"225":2}}],["blue",{"2":{"208":18,"209":8,"618":2}}],["blob",{"0":{"206":1},"2":{"198":1,"200":3,"202":1,"206":3}}],["blockquote",{"0":{"693":1},"2":{"693":4}}],["block",{"2":{"168":1,"326":9,"574":1,"575":1,"602":2,"628":1,"643":3,"644":2,"647":3,"653":1}}],["blocking",{"2":{"56":1,"389":1}}],["sq",{"2":{"852":2}}],["square",{"2":{"852":4}}],["sgr",{"2":{"815":2}}],["s2",{"2":{"667":4}}],["s1",{"2":{"667":6}}],["slash",{"0":{"854":1}}],["slotted",{"2":{"633":1}}],["slice",{"2":{"190":2,"191":2,"206":1,"208":16,"671":1,"806":4,"810":2}}],["svg|a",{"2":{"618":2}}],["svg",{"2":{"618":6}}],["srtp",{"0":{"571":1}}],["srtcp",{"0":{"571":1},"2":{"569":1}}],["srcelement",{"2":{"222":2}}],["src",{"2":{"106":1,"108":1,"252":1,"847":6,"848":8,"849":17,"850":5,"857":10,"858":2}}],["src=",{"2":{"104":2,"402":2,"677":4,"678":6,"679":4,"680":2,"681":8,"682":4,"683":10,"684":2}}],["smtp",{"2":{"471":1,"478":1,"482":1}}],["smart",{"2":{"428":10,"433":1}}],["ssl",{"2":{"459":1,"552":1}}],["ssh",{"2":{"333":1,"471":1}}],["sysmbol",{"2":{"872":1}}],["systemjs",{"0":{"308":1},"2":{"868":1}}],["system",{"2":{"253":2,"470":1,"839":1,"842":4}}],["syntaxerror",{"2":{"737":4,"742":2}}],["sync",{"2":{"309":1}}],["symbol",{"0":{"667":1},"2":{"667":10,"788":1}}],["symbols",{"2":{"642":1}}],["symantec",{"2":{"568":1}}],["skipdefaultlibcheck",{"2":{"854":1}}],["skip",{"2":{"256":2,"259":2}}],["spread",{"2":{"668":2}}],["spec",{"2":{"857":2}}],["specified",{"2":{"850":2}}],["specifies",{"2":{"848":3,"849":4}}],["specific",{"2":{"253":2}}],["specifying",{"2":{"253":2}}],["specify",{"2":{"253":20}}],["spelling",{"2":{"633":1}}],["speed",{"2":{"392":1}}],["spidermonkey",{"2":{"347":1}}],["spawn",{"0":{"328":1},"1":{"329":1,"330":1},"2":{"328":2,"329":1}}],["space",{"0":{"592":1,"593":1},"2":{"326":2,"592":2,"593":2}}],["span2",{"2":{"326":6}}],["span1",{"2":{"326":4}}],["span",{"2":{"114":6,"158":12,"326":18,"575":1,"643":1,"698":6,"753":12}}],["sw",{"2":{"428":2}}],["switching",{"0":{"503":1},"2":{"490":2}}],["switch",{"0":{"524":1},"2":{"211":2,"464":1}}],["sweep",{"2":{"183":1}}],["sayhi",{"2":{"762":2}}],["sayhello",{"2":{"675":6,"679":4,"680":4,"682":2,"684":4}}],["sayage",{"2":{"762":2}}],["sayname",{"2":{"761":24,"762":2}}],["samp",{"0":{"698":1},"2":{"698":4}}],["same",{"2":{"416":1}}],["samesite",{"0":{"402":1},"1":{"403":1},"2":{"402":1}}],["safe",{"2":{"461":1}}],["safari",{"2":{"212":1,"218":1,"225":2,"311":1,"312":1,"347":2,"404":1,"674":1}}],["safari10",{"2":{"196":1}}],["saving",{"2":{"253":2}}],["saturation",{"2":{"210":1}}],["s",{"0":{"872":1},"2":{"210":11,"211":8,"259":4,"263":1,"318":2,"326":2,"666":6,"815":1,"852":4}}],["somelib",{"2":{"871":2}}],["somevalue",{"2":{"859":6}}],["so",{"2":{"814":1}}],["solid",{"2":{"644":2,"647":2,"718":2}}],["sob",{"2":{"345":1}}],["softbind",{"2":{"810":4}}],["softlink",{"2":{"318":6}}],["soft",{"0":{"315":1},"1":{"316":1,"317":1,"318":1},"2":{"265":2,"266":1}}],["soruce",{"2":{"263":1}}],["sourceroots",{"2":{"857":2}}],["source=",{"2":{"262":6}}],["sourcetype",{"2":{"237":1}}],["sourceurl=webpack",{"2":{"147":2}}],["source",{"2":{"131":2,"144":8,"147":4,"250":1,"263":1,"419":2,"716":2,"857":2}}],["socekt",{"2":{"106":1}}],["socketserver",{"2":{"106":6}}],["socket",{"0":{"484":1,"485":1},"1":{"485":1,"486":2,"487":2,"488":1,"489":1,"490":1,"491":1,"492":1,"493":1,"494":1},"2":{"106":5,"485":1,"487":2,"819":1,"826":2}}],["sockjsclient",{"2":{"106":2}}],["sockjs",{"2":{"106":6,"107":2}}],["schema",{"2":{"857":2}}],["scheme",{"2":{"149":2}}],["scope",{"2":{"635":1}}],["scopeid",{"2":{"428":12}}],["sctp",{"0":{"572":1},"2":{"569":1,"572":1}}],["scale",{"2":{"234":1}}],["scale=1",{"2":{"131":2,"146":2,"147":4}}],["scanvenge",{"2":{"182":1}}],["scream",{"2":{"345":1}}],["screeny",{"2":{"226":1}}],["screenx",{"2":{"226":1}}],["scrollleft",{"2":{"718":1}}],["scrollwidth",{"2":{"718":1}}],["scrollby",{"2":{"717":1}}],["scrolltop",{"2":{"718":7}}],["scrollto",{"2":{"717":1}}],["scrollintoview",{"2":{"717":2}}],["scrollrestoration",{"2":{"268":1}}],["scroll",{"2":{"188":2,"224":1,"359":1}}],["scrollheight",{"2":{"168":1,"718":1}}],["script=greek",{"2":{"666":2}}],["script｜link｜x",{"2":{"139":2}}],["scripts",{"2":{"108":1}}],["script",{"0":{"310":1},"1":{"311":1,"312":1,"313":1},"2":{"104":4,"131":2,"134":2,"147":2,"168":16,"224":2,"237":1,"675":4,"677":8,"678":12,"679":19,"680":8,"681":20,"682":12,"683":20,"684":8,"713":4,"717":16}}],["scripting",{"2":{"68":1}}],["sum",{"2":{"683":1}}],["supertype",{"2":{"762":25}}],["super",{"2":{"670":6,"864":2,"876":4,"877":2}}],["support",{"0":{"626":1},"2":{"677":2}}],["sudo",{"2":{"421":4}}],["subtype",{"2":{"762":28}}],["subtree",{"2":{"151":1,"160":3,"746":1,"755":3}}],["submit",{"2":{"718":1}}],["subnet",{"2":{"424":4,"545":1,"550":1}}],["subdir",{"2":{"309":1}}],["suggestion",{"2":{"253":2}}],["suggestnextcharacters",{"2":{"14":1}}],["surroundcontents",{"2":{"114":2}}],["sticky",{"2":{"575":1,"666":5}}],["stf0",{"2":{"428":2}}],["stp",{"2":{"427":1,"428":2}}],["stylish",{"2":{"253":2}}],["style1",{"2":{"850":2}}],["style=",{"2":{"188":8}}],["style",{"0":{"357":1,"623":1,"642":1,"659":1},"2":{"114":2,"168":28,"188":2,"224":1,"326":4,"424":2,"591":4,"592":4,"593":4,"594":8,"595":4,"599":4,"641":2,"701":1,"718":15,"850":2}}],["stdin",{"2":{"253":10}}],["str",{"2":{"775":4}}],["strong",{"0":{"692":1}}],["stroke",{"2":{"618":4}}],["strictnullcheckslet",{"2":{"859":1}}],["strictnullchecks",{"2":{"837":1,"859":1}}],["strict",{"2":{"402":1,"575":1,"661":1,"775":2,"801":4}}],["stringvalidator",{"2":{"852":2}}],["string",{"2":{"160":2,"167":2,"201":1,"203":3,"221":1,"222":1,"227":1,"237":1,"253":32,"268":1,"271":1,"304":2,"309":1,"640":1,"641":3,"755":2,"788":1,"832":2,"837":2,"842":4,"843":4,"852":2,"859":7,"860":14,"862":1,"865":2,"866":4,"870":2,"872":1,"876":4}}],["stream",{"2":{"206":1,"572":1}}],["stoppropagation",{"2":{"221":1}}],["stopimmediatepropagation",{"2":{"221":1}}],["stopindex++",{"2":{"191":2}}],["stopindex",{"2":{"190":2,"191":8}}],["stop",{"2":{"184":1,"189":1,"191":1}}],["step",{"2":{"167":3}}],["steps",{"2":{"167":1}}],["staged",{"2":{"262":6,"263":1}}],["starttime",{"2":{"380":2}}],["starttimer",{"2":{"98":10}}],["startmeta",{"2":{"191":6}}],["startindex",{"2":{"190":12,"191":8}}],["startnpm",{"2":{"109":1}}],["start",{"0":{"594":1},"2":{"56":1,"82":8,"86":10,"92":8,"98":2,"109":3,"167":1,"188":2,"189":1,"190":2,"191":3,"598":1,"860":4}}],["state",{"2":{"167":1,"268":3,"876":2}}],["stats",{"2":{"104":2}}],["status",{"0":{"514":1},"2":{"44":1,"500":1}}],["static",{"2":{"20":1}}],["shift",{"2":{"391":1,"764":2}}],["shiftkey",{"2":{"226":1}}],["shown",{"2":{"635":1}}],["show",{"2":{"253":2,"256":2}}],["should",{"2":{"98":2,"253":2}}],["shouldinvoke",{"2":{"98":8}}],["shapes",{"2":{"852":4}}],["sha1",{"2":{"494":2}}],["sha",{"2":{"494":1}}],["sharing",{"2":{"405":1}}],["shareddata",{"2":{"249":2}}],["shaking",{"2":{"50":1,"65":1}}],["shelljs",{"2":{"240":1}}],["side",{"0":{"840":1},"2":{"742":2}}],["since",{"2":{"522":1}}],["single",{"2":{"151":1,"354":1,"746":1}}],["singleentryplugin",{"2":{"143":2}}],["simplex",{"2":{"428":14,"433":1}}],["si",{"0":{"392":1},"2":{"814":1}}],["site",{"2":{"68":1,"354":2,"402":1}}],["size",{"0":{"649":1,"657":1},"2":{"13":4,"131":2,"191":10,"206":1,"618":2,"630":2,"649":5,"655":3,"661":1,"668":2,"718":1}}],["sequences",{"0":{"812":1},"1":{"813":1,"814":1,"815":1}}],["seo语义化",{"0":{"685":1},"1":{"686":1,"687":1,"688":1,"689":1,"690":1,"691":1,"692":1,"693":1,"694":1,"695":1,"696":1,"697":1,"698":1,"699":1}}],["self",{"0":{"594":1},"2":{"806":6}}],["selector",{"2":{"852":2}}],["selected",{"2":{"718":1}}],["selectedindex",{"2":{"718":1}}],["selected||td",{"2":{"616":2}}],["select",{"2":{"224":1}}],["selection",{"2":{"114":6,"195":2,"633":1}}],["selectallchildren",{"2":{"114":1}}],["selectall",{"2":{"113":1}}],["see",{"0":{"521":1}}],["security",{"2":{"701":1}}],["secured",{"2":{"428":2}}],["secure",{"0":{"401":1}}],["secret",{"2":{"554":2,"559":1,"563":1}}],["sec",{"0":{"493":2},"2":{"490":6,"494":6}}],["session",{"2":{"473":1}}],["search",{"2":{"271":2,"382":1}}],["send",{"2":{"106":2}}],["sentry",{"0":{"28":1},"2":{"23":1}}],["servre",{"2":{"487":1}}],["service",{"0":{"332":1,"542":1},"1":{"333":1},"2":{"50":1,"553":1,"554":2,"555":1,"559":1,"560":1,"563":1}}],["servers",{"2":{"102":2,"104":2,"106":2,"108":1}}],["server",{"0":{"539":1},"2":{"23":1,"102":6,"104":2,"106":7,"422":2,"424":6,"425":1}}],["setimmeidate",{"2":{"819":1,"829":1}}],["setimmediate",{"0":{"827":1,"829":1},"2":{"819":3,"824":3,"825":3,"827":2}}],["setimmediated",{"2":{"819":1}}],["setinterval",{"2":{"730":1,"819":1,"821":1}}],["setprototypeof",{"2":{"762":1}}],["setproperty",{"2":{"718":1}}],["setclipboardtext",{"2":{"718":2}}],["settings",{"0":{"249":1},"2":{"249":2}}],["settimeout",{"0":{"827":1},"2":{"76":2,"79":2,"82":2,"89":2,"92":4,"98":2,"157":2,"159":4,"168":1,"730":2,"752":2,"754":4,"797":2,"819":1,"821":3,"827":1}}],["setdata",{"2":{"195":2,"197":1,"718":5}}],["setattribute",{"2":{"158":4,"716":1,"753":4}}],["setattributens",{"2":{"156":4,"751":4}}],["setattrbute",{"2":{"156":2,"751":2}}],["setright",{"2":{"20":1}}],["setleft",{"2":{"20":1}}],["setvalue",{"2":{"20":1}}],["set",{"0":{"17":1,"668":1},"2":{"13":1,"16":4,"421":2,"668":12}}],["csi",{"0":{"815":1},"2":{"815":16}}],["cssvaluetype",{"2":{"718":1}}],["cssvalue",{"2":{"718":1}}],["csstext",{"2":{"718":8}}],["cssul",{"2":{"644":1,"647":1,"649":1,"650":1,"651":1}}],["csscol",{"2":{"616":1}}],["css2",{"2":{"579":1}}],["cssom",{"0":{"372":1},"2":{"357":1}}],["css文件下载完毕",{"2":{"230":1}}],["css文件等外部资源",{"2":{"224":1}}],["cssjs",{"0":{"165":1},"1":{"166":1,"167":1,"168":1}}],["css自由处理",{"2":{"145":2}}],["css",{"0":{"145":1,"167":1,"325":1,"575":1,"604":1,"627":1},"1":{"326":1,"605":1,"606":1,"607":1,"608":1,"609":1,"610":1,"611":1,"612":1,"613":1,"614":1,"615":1,"616":1,"617":1,"618":1,"619":1,"620":1,"621":1,"622":1,"623":1,"624":1,"625":1,"626":1,"628":1,"629":1,"630":1},"2":{"167":1,"168":3,"208":2,"326":1,"351":1,"369":1,"381":2,"580":1,"590":1,"599":2,"602":1,"618":1,"620":1,"637":4,"652":1,"655":1,"659":1,"850":6}}],["cc",{"2":{"672":2}}],["center",{"0":{"594":1}}],["cell",{"2":{"575":1,"628":1}}],["ceil",{"2":{"190":2}}],["c5ab0dc85b11",{"2":{"494":1}}],["c1",{"2":{"428":2,"812":3}}],["c0",{"2":{"428":4,"812":3,"814":1}}],["cfg",{"2":{"425":1}}],["cmd",{"2":{"254":1,"256":4}}],["cwd",{"2":{"253":2}}],["ctrlkey",{"2":{"226":1}}],["ctx",{"2":{"98":4,"301":4}}],["c",{"0":{"443":1},"2":{"143":4,"147":2,"156":2,"253":2,"429":3,"439":1,"440":1,"546":1,"548":1,"669":8,"672":16,"723":2,"737":4,"751":2,"761":4,"815":1,"854":12,"860":16,"866":4,"874":8}}],["cue",{"2":{"633":1}}],["cumulative",{"2":{"391":1}}],["curly",{"2":{"244":2}}],["currnt",{"2":{"877":2}}],["currnode",{"2":{"19":12}}],["curried",{"2":{"810":8}}],["current",{"2":{"256":2,"635":1}}],["currenttarget",{"2":{"221":2}}],["curoffset",{"2":{"191":6}}],["cubic",{"2":{"167":1}}],["cut",{"2":{"113":1,"718":1}}],["cr",{"2":{"814":1}}],["crypto",{"2":{"494":2}}],["credentials",{"0":{"408":1},"2":{"683":2}}],["createref",{"2":{"877":2}}],["createrange",{"2":{"115":1}}],["createinstancewithproto",{"2":{"764":4}}],["createinstance",{"2":{"764":4}}],["createanother",{"2":{"762":2}}],["create",{"2":{"762":3,"810":2,"866":4}}],["createobject",{"2":{"761":2}}],["createtextnode",{"2":{"716":1}}],["createdocumentfragment",{"2":{"716":1}}],["created",{"0":{"508":1}}],["createhash",{"2":{"494":4}}],["createhtmlwebpackpluginhooks",{"2":{"139":2}}],["createcomment",{"2":{"716":1}}],["createcontext",{"2":{"147":2,"876":3}}],["createchildcompiler",{"0":{"141":1},"2":{"132":1,"143":2}}],["createelement",{"2":{"114":2,"158":4,"168":2,"675":2,"716":1,"718":2,"753":4}}],["createlinkt",{"2":{"113":1}}],["createsocketserver",{"2":{"106":2}}],["createserver",{"2":{"102":2,"106":2}}],["crp",{"2":{"369":1}}],["critial",{"2":{"369":1}}],["crossorigin=",{"2":{"683":2}}],["crossorigin",{"0":{"313":1,"683":1},"2":{"683":4}}],["cross",{"2":{"68":1,"402":1,"405":1}}],["capture",{"2":{"712":1,"713":2}}],["cas",{"2":{"568":2}}],["case",{"2":{"211":6,"326":2}}],["ca",{"0":{"562":1,"565":1},"1":{"563":1,"564":1,"565":1,"566":1,"567":1},"2":{"564":4,"565":2,"566":2,"567":1,"568":4}}],["carakan",{"2":{"347":1}}],["cat",{"2":{"318":2,"322":2}}],["catch",{"2":{"200":2,"201":2,"202":2,"203":2,"669":2}}],["cachcable",{"2":{"461":1}}],["caching",{"2":{"253":2}}],["cache",{"2":{"231":1,"253":12}}],["candidate",{"2":{"380":2}}],["cancelbubble",{"2":{"222":1}}],["cancelable",{"2":{"221":2}}],["cancel",{"2":{"95":1,"98":6}}],["canvas",{"2":{"52":1,"638":1}}],["callable",{"2":{"806":2}}],["callee",{"2":{"718":6,"797":2}}],["callbacks",{"0":{"822":1,"826":1},"2":{"820":2}}],["callback",{"0":{"156":1,"751":1},"2":{"131":4,"138":1,"139":1,"143":2,"145":2,"819":2}}],["call",{"2":{"76":2,"98":2,"190":2,"191":2,"669":4,"762":4,"764":2,"803":6,"806":4,"810":2}}],["cd",{"2":{"60":1}}],["cdn",{"2":{"50":1}}],["cite",{"0":{"693":1},"2":{"693":4}}],["cidr",{"2":{"421":1,"429":2,"551":1}}],["ci",{"2":{"60":1}}],["cpu",{"0":{"725":1},"2":{"48":1,"725":2}}],["clone",{"2":{"762":6}}],["clonenode",{"2":{"716":1}}],["close",{"0":{"826":1},"2":{"640":2,"819":2,"820":1,"826":2}}],["clock1",{"2":{"345":1}}],["cleardata",{"2":{"718":1}}],["clearfix",{"0":{"602":1},"2":{"583":3}}],["clear",{"0":{"596":1,"601":1,"603":1},"1":{"597":1,"598":1,"599":1,"600":1,"601":1,"602":2,"603":2},"2":{"575":2,"602":2,"651":1,"668":2}}],["cleartimeout",{"2":{"76":2,"79":2,"82":2,"89":2,"92":4}}],["cls",{"0":{"391":1}}],["clap",{"2":{"345":1}}],["classes",{"0":{"864":1},"2":{"860":1}}],["classic",{"0":{"847":1}}],["classless",{"2":{"551":1}}],["classlist",{"2":{"168":16,"717":1}}],["class=",{"2":{"188":6,"326":6,"591":4,"592":8,"593":8,"594":18,"595":6,"646":32}}],["classname",{"2":{"155":2,"156":6,"157":4,"159":6,"750":2,"751":6,"752":4,"754":6}}],["class",{"0":{"670":1},"2":{"12":2,"13":1,"131":2,"135":1,"143":2,"155":2,"750":2,"852":6,"854":2,"860":1,"864":1,"866":3,"869":1,"874":5,"876":4,"877":1}}],["clip",{"2":{"359":1}}],["clipboarditem",{"0":{"198":1},"2":{"196":1,"200":3,"202":3}}],["clipboard",{"0":{"196":1,"199":1},"1":{"197":1,"198":1,"199":1,"200":2,"201":2,"202":2,"203":2},"2":{"196":2,"198":2,"200":4,"201":2,"202":2,"203":2}}],["clipboarddata",{"2":{"195":2,"718":17}}],["clipboardevent",{"0":{"197":1},"2":{"195":2}}],["cli",{"0":{"253":1,"858":1},"2":{"832":2}}],["cli时是会忽略配置的文件",{"2":{"252":1}}],["click",{"2":{"168":4,"218":2,"219":2,"226":3,"234":1,"713":8}}],["clienty",{"2":{"226":1}}],["clientx",{"2":{"226":1}}],["clients",{"2":{"106":5,"108":1}}],["client",{"2":{"23":1,"106":2,"107":1,"424":2,"487":1,"553":1,"554":2,"555":1,"559":1,"560":1,"563":1}}],["core",{"2":{"857":6}}],["cors",{"0":{"405":1,"406":1},"1":{"406":1,"407":2,"408":2,"409":2,"410":2,"411":2,"412":2,"413":2,"414":2,"415":2,"416":1,"417":1,"418":1,"419":1},"2":{"406":1,"682":6}}],["co",{"2":{"669":1}}],["cost",{"2":{"428":4}}],["cookie",{"0":{"404":1},"2":{"394":3,"395":5,"396":3,"399":2,"400":2,"403":1,"404":2}}],["cookies",{"0":{"393":1},"1":{"394":1,"395":1,"396":1,"397":1,"398":1,"399":1,"400":1,"401":1,"402":1,"403":1,"404":1},"2":{"683":2}}],["coffee",{"2":{"345":1}}],["code",{"0":{"698":1},"2":{"253":4,"500":1,"698":4,"715":6}}],["count++",{"2":{"797":4}}],["counters",{"0":{"641":1},"2":{"640":1,"641":2,"659":1}}],["counter",{"0":{"623":1,"641":1},"2":{"640":1,"860":14}}],["count",{"2":{"167":1,"575":1,"797":4}}],["col",{"2":{"616":1,"635":2}}],["column",{"2":{"575":3,"594":2,"595":2}}],["color",{"2":{"149":2,"168":2,"208":16,"253":6,"616":2,"718":2,"859":2,"876":10}}],["collapsetostart",{"2":{"114":1}}],["collapsetoend",{"2":{"114":1}}],["collapse",{"2":{"114":1}}],["copybind",{"2":{"195":6}}],["copy",{"2":{"113":1,"195":14,"200":2,"201":2,"718":1}}],["copynode",{"2":{"20":1}}],["comodo",{"2":{"568":1}}],["com",{"2":{"268":1,"271":3,"341":2,"419":12}}],["common",{"2":{"672":2}}],["commonjs",{"0":{"305":1,"672":1},"2":{"240":1,"300":1,"672":5,"839":1,"853":1,"857":4}}],["communications",{"2":{"469":1}}],["comments",{"2":{"253":4}}],["commit",{"0":{"361":1},"2":{"60":1,"255":1,"259":2,"265":2}}],["comnent",{"2":{"160":1,"755":1}}],["component",{"2":{"876":8,"877":2}}],["composite",{"2":{"857":2}}],["compositorframe",{"2":{"353":1,"367":1,"368":1}}],["compositor",{"2":{"350":1,"353":1,"359":1,"361":2,"362":1,"363":1,"365":1,"366":1,"367":1}}],["compositing",{"0":{"362":1},"2":{"349":2}}],["compositionend",{"2":{"116":1,"228":1}}],["compositionupdate",{"2":{"116":1,"228":1}}],["compositionstart",{"2":{"116":1,"228":1}}],["computestyle",{"2":{"357":1}}],["compute",{"0":{"332":1},"1":{"333":1}}],["computed",{"2":{"326":2,"865":1}}],["complete",{"2":{"230":1}}],["compatible",{"2":{"701":1}}],["compatmode",{"2":{"224":1}}],["compact",{"2":{"183":1}}],["compileonsave",{"2":{"857":2}}],["compiledtemplate",{"2":{"143":4}}],["compiletmplatepromise",{"2":{"143":2,"145":4}}],["compileroptions",{"2":{"850":4,"857":2}}],["compilername",{"2":{"143":2}}],["compiler子实例",{"2":{"141":1}}],["compiler",{"0":{"136":1,"137":1,"138":1,"139":1},"1":{"137":1,"138":1,"139":1},"2":{"104":7,"106":1,"131":4,"132":5,"135":2,"137":1,"143":6}}],["compilatoin",{"2":{"132":1}}],["compilation",{"2":{"131":4,"137":2,"138":2,"139":2,"141":1,"143":10,"145":6}}],["conditional",{"2":{"837":1}}],["concat",{"2":{"806":2,"810":2}}],["conncet",{"2":{"461":1}}],["connections",{"2":{"820":1}}],["connection",{"2":{"490":4}}],["connect",{"0":{"459":1},"2":{"461":1}}],["contributors",{"2":{"832":1}}],["control",{"0":{"407":1,"408":1,"409":1,"410":1,"411":1,"412":1,"413":1,"414":1},"2":{"467":1,"476":2,"478":1,"571":1,"572":1}}],["continue",{"0":{"502":1},"2":{"256":2,"259":2}}],["contain",{"0":{"656":1},"1":{"657":1,"658":1,"659":1,"660":1,"661":1},"2":{"575":1,"655":3,"658":1,"661":4}}],["containers",{"2":{"575":1}}],["container",{"2":{"168":24,"188":4,"591":4,"592":4,"593":4,"594":8,"595":4,"655":2}}],["containsnode",{"2":{"114":1}}],["contains",{"2":{"20":2,"717":2}}],["contexttype",{"2":{"876":2}}],["contexttypes",{"2":{"876":2}}],["context2",{"2":{"876":4}}],["context1",{"2":{"876":4}}],["contextmenu",{"2":{"230":1}}],["context",{"0":{"309":1,"876":1},"2":{"143":2,"309":3,"574":1,"577":1,"635":1,"876":18}}],["contentwindow",{"2":{"419":1}}],["contentful",{"2":{"379":1,"380":6,"384":1}}],["content",{"0":{"511":1,"512":1,"513":1,"591":1,"639":1,"655":1},"1":{"640":1,"641":1},"2":{"143":2,"352":2,"482":1,"575":1,"595":4,"602":2,"639":1,"641":1,"655":2,"661":2,"701":5}}],["content=",{"2":{"131":2,"146":2,"147":4,"701":1}}],["contenteditable",{"2":{"111":1}}],["configurable",{"2":{"762":1}}],["configuration",{"2":{"253":10,"420":1}}],["config",{"2":{"104":2,"106":1,"144":2,"253":12}}],["consumer",{"2":{"876":6}}],["console",{"2":{"98":14,"153":2,"155":4,"156":2,"157":2,"158":2,"159":6,"200":6,"201":4,"202":4,"203":4,"246":6,"339":2,"380":2,"382":1,"668":4,"684":2,"713":8,"748":2,"750":4,"751":2,"752":2,"753":2,"754":6,"761":18,"762":6,"763":2,"775":2,"776":2,"797":2,"801":2,"802":4,"803":2,"866":2,"874":2}}],["const",{"0":{"663":1},"2":{"98":16,"139":1,"143":4,"147":11,"168":2,"217":2,"218":2,"219":2,"223":4,"380":2,"399":2,"494":5,"666":10,"669":2,"671":6,"675":2,"713":4,"842":2,"852":2,"862":1,"865":2,"876":1,"877":2}}],["constructorparameters",{"2":{"838":1}}],["constructor",{"0":{"764":1},"2":{"13":2,"761":4,"762":2,"764":13,"876":4,"877":2}}],["choices",{"0":{"518":1}}],["chromium",{"0":{"346":1,"348":1},"1":{"347":1,"348":1,"349":2,"350":2,"351":2,"352":2,"353":2,"354":1,"355":1,"356":1,"357":1,"358":1,"359":1,"360":1,"361":1,"362":1,"363":1,"364":1,"365":1,"366":1,"367":1,"368":1},"2":{"347":6}}],["chrome85+",{"2":{"655":1}}],["chrome",{"2":{"208":2,"212":1,"218":1,"225":2,"311":1,"312":1,"347":2,"382":1,"656":1,"674":1}}],["chrome58+",{"2":{"196":1}}],["checks",{"2":{"860":1}}],["checked",{"2":{"635":1}}],["check",{"0":{"825":1},"2":{"253":2,"819":2,"820":1}}],["channel",{"2":{"428":12}}],["changing",{"2":{"253":2}}],["changes",{"2":{"253":2}}],["changed",{"2":{"155":4,"157":4,"159":6,"253":2,"750":4,"752":4,"754":6}}],["chakra",{"2":{"347":2}}],["charset",{"0":{"619":1},"2":{"701":1,"718":1}}],["charset=",{"2":{"131":2,"146":2,"147":4}}],["charcode",{"2":{"227":1}}],["characters",{"2":{"356":1}}],["characterdataoldvalue",{"2":{"160":3,"755":3}}],["characterdata",{"2":{"156":2,"160":3,"751":2,"755":3}}],["character",{"2":{"14":1}}],["childcontexttypes",{"2":{"876":2}}],["childcompilaton",{"2":{"143":4}}],["childcompiler",{"0":{"140":1,"143":1},"1":{"141":1},"2":{"137":2,"143":8}}],["childelementcount",{"2":{"717":1}}],["child2",{"2":{"713":2}}],["child1",{"2":{"713":18}}],["child",{"2":{"635":5,"876":10}}],["childlist",{"2":{"156":6,"160":3,"751":6,"755":3}}],["childnodes",{"2":{"151":1,"717":1,"746":1}}],["children",{"2":{"14":1,"717":1}}],["表达式",{"0":{"741":1}}],["表达层",{"0":{"472":1}}],["表格单元格",{"2":{"575":1}}],["表格类",{"0":{"344":1}}],["表明已经接受客户机的选择",{"2":{"422":1}}],["表单的名称",{"2":{"718":1}}],["表单中控件的数量",{"2":{"718":1}}],["表单中所有控件的集合",{"2":{"718":1}}],["表单脚本",{"2":{"718":1}}],["表单",{"2":{"402":2}}],["表情类",{"0":{"345":1}}],["表示捕获阶段",{"2":{"712":1}}],["表示冒泡阶段",{"2":{"712":1}}],["表示上一个",{"2":{"669":1}}],["表示服务器无法完成明显有效的请求",{"2":{"538":1}}],["表示协议切换",{"2":{"490":1}}],["表示方法",{"0":{"486":1}}],["表示本地网络",{"2":{"446":1}}],["表示",{"2":{"432":1}}],["表示元素已经被用户操作",{"2":{"224":1}}],["表示人为因素",{"2":{"221":1}}],["表示已经调用了",{"2":{"221":1}}],["表示在冒泡阶段调用事件处理程序",{"2":{"218":1}}],["表示在捕获阶段调用事件处理程序",{"2":{"218":1}}],["表示返回正常键盘输入状态",{"2":{"116":1}}],["表示要开始输入了",{"2":{"116":1}}],["表示选区的起点和终点是否重合",{"2":{"114":1}}],["表示法",{"0":{"0":1},"1":{"1":1,"2":1}}],["表",{"0":{"13":1}}],["hybrid",{"2":{"860":1}}],["hypertext",{"2":{"450":1}}],["h6",{"2":{"688":1}}],["hgroup",{"0":{"688":1},"2":{"688":1}}],["hi",{"2":{"717":8,"762":2}}],["hints",{"0":{"505":1}}],["hit",{"2":{"351":1,"352":1}}],["hidden",{"2":{"326":7,"654":1,"655":1,"717":2}}],["history对象中长度length属性保持不变",{"2":{"271":1}}],["history",{"0":{"267":1,"268":1},"1":{"268":1,"269":1,"270":1,"271":1},"2":{"268":6,"271":1}}],["hue2rgb",{"2":{"210":8}}],["hue",{"2":{"210":1}}],["h",{"2":{"210":15,"211":14,"253":2,"815":1}}],["hsl2rgb",{"2":{"210":2}}],["hsl",{"0":{"210":1,"211":1},"2":{"210":1}}],["hwp",{"0":{"131":1,"133":1,"140":1,"142":1},"1":{"132":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":2,"143":1,"144":1,"145":1,"146":1,"147":1},"2":{"130":1,"131":2,"132":3,"136":1,"137":1,"140":1,"143":6}}],["href=",{"2":{"402":2}}],["href",{"2":{"271":2}}],["hr",{"0":{"690":1},"2":{"113":1}}],["h2",{"0":{"688":1},"2":{"113":1}}],["h1",{"0":{"688":1},"2":{"113":1,"688":1}}],["htmloptionelement",{"2":{"718":1}}],["htmlselectelement",{"2":{"718":1}}],["htmlformelement",{"2":{"718":1}}],["htmlcollection",{"2":{"716":1,"718":1}}],["htmldivelement",{"2":{"715":2}}],["htmldocument",{"2":{"715":4}}],["htmlbodyelement",{"2":{"715":4}}],["htmlheadelement",{"2":{"715":2}}],["htmlhtmlelement",{"2":{"715":1}}],["htmlelement",{"2":{"715":9}}],["htmlevents",{"2":{"223":4}}],["html语义化标签你知道多少",{"2":{"685":1}}],["html语义",{"2":{"685":1}}],["html|a",{"2":{"618":2}}],["html5事件",{"0":{"230":1}}],["html模板中",{"2":{"145":2}}],["html$",{"2":{"144":2}}],["htmlwebpackplugin",{"2":{"134":4,"135":2,"146":2,"147":4}}],["htmlwepbackplugin",{"0":{"130":1},"1":{"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1}}],["html",{"0":{"144":1,"146":1,"216":1,"573":1,"700":1},"1":{"147":1,"574":1,"575":1,"576":1,"577":1,"578":1,"579":1,"580":1,"581":1,"582":1,"583":1,"701":1},"2":{"104":3,"106":1,"107":1,"113":1,"130":2,"131":14,"132":1,"134":5,"137":5,"139":1,"142":1,"143":6,"144":2,"145":2,"146":7,"147":26,"168":4,"188":1,"195":1,"216":1,"269":2,"304":2,"326":1,"339":5,"351":1,"369":1,"591":1,"592":1,"593":1,"594":1,"595":1,"599":3,"618":4,"643":2,"644":1,"646":1,"648":1,"675":1,"677":2,"678":1,"679":1,"680":1,"681":1,"682":1,"683":1,"684":1,"689":1,"693":1,"694":1,"698":1,"701":1,"713":1,"715":3,"718":6,"850":2}}],["http1",{"2":{"459":1,"501":1}}],["httponly",{"0":{"403":1},"2":{"402":1,"403":1}}],["https",{"0":{"552":1},"1":{"553":1,"554":1,"555":1,"556":1,"557":1,"558":1,"559":1,"560":1,"561":1,"562":1,"563":1,"564":1,"565":1,"566":1,"567":1,"568":1},"2":{"271":1,"341":2,"401":1,"427":1,"471":1,"559":1,"682":6,"683":4}}],["http3",{"2":{"50":1}}],["http2",{"2":{"50":1}}],["http",{"0":{"450":1,"495":1,"500":1,"510":1},"1":{"451":1,"452":1,"453":1,"454":1,"455":1,"456":1,"457":1,"458":1,"459":1,"460":1,"461":1,"496":1,"497":1,"498":1,"499":1,"501":1,"502":1,"503":1,"504":1,"505":1,"506":1,"507":1,"508":1,"509":1,"510":1,"511":1,"512":1,"513":1,"514":1,"515":1,"516":1,"517":1,"518":1,"519":1,"520":1,"521":1,"522":1,"523":1,"524":1,"525":1,"526":1,"527":1,"528":1,"529":1,"530":1,"531":1,"532":1,"533":1,"534":1,"535":1,"536":1,"537":1,"538":1,"539":1,"540":1,"541":1,"542":1,"543":1,"544":1},"2":{"42":1,"50":1,"101":1,"102":2,"104":1,"106":2,"196":1,"271":1,"393":1,"394":1,"405":2,"409":1,"410":1,"411":1,"413":1,"414":1,"419":12,"427":1,"433":1,"459":1,"471":1,"482":1,"488":1,"489":1,"490":4,"500":1,"505":1,"552":2,"618":4,"701":3,"718":1,"730":1,"843":2}}],["homepage",{"2":{"832":1}}],["hodor",{"2":{"666":4}}],["hover",{"2":{"635":1}}],["horizontal",{"2":{"580":1}}],["holdcnt",{"2":{"428":2}}],["host",{"2":{"271":1,"416":1,"420":1,"429":1,"490":2,"635":3}}],["hostname",{"2":{"102":2,"271":2}}],["hook",{"2":{"137":2,"138":1,"139":1}}],["hooks以及它使用在插件中的作用",{"2":{"136":1}}],["hooks",{"0":{"137":1,"138":1,"139":1},"2":{"60":1,"106":3,"131":2,"137":1,"139":1,"143":2,"145":4}}],["hand",{"2":{"742":2}}],["handling",{"2":{"253":2}}],["handler",{"2":{"352":1,"712":1}}],["handleentries",{"2":{"143":4}}],["handle",{"2":{"98":4,"135":2,"876":2}}],["have",{"2":{"326":2,"666":2}}],["hardlink",{"2":{"318":6,"322":4}}],["hard",{"0":{"319":1},"1":{"320":1,"321":1,"322":1},"2":{"265":2,"266":2}}],["hasfeature",{"2":{"223":4}}],["has",{"2":{"13":1,"155":2,"271":1,"326":4,"635":1,"668":4,"750":2,"876":2}}],["hash字符串",{"2":{"232":1}}],["hash获取url",{"2":{"232":1}}],["hashchange",{"0":{"232":1},"2":{"270":3}}],["hashtable",{"2":{"13":2,"14":1}}],["hash",{"0":{"13":1,"270":1},"2":{"13":1,"270":1,"271":3,"565":1,"566":1}}],["hell",{"2":{"762":2,"803":2}}],["hellotime",{"2":{"428":2}}],["hello",{"2":{"147":4,"155":2,"157":2,"159":2,"216":2,"217":2,"249":2,"338":2,"339":8,"342":3,"419":2,"666":6,"669":2,"672":2,"684":8,"698":9,"750":2,"752":2,"754":2,"761":10,"762":1,"764":4,"802":10,"803":6,"859":2,"863":2}}],["helpers",{"2":{"349":1,"352":1}}],["help",{"2":{"253":4}}],["hex80",{"2":{"812":1}}],["hex00",{"2":{"812":1}}],["hex2rgba",{"2":{"208":2}}],["hex2rgb",{"2":{"208":2}}],["hex",{"2":{"208":19,"209":3}}],["here",{"2":{"131":2,"135":2,"736":6,"737":6,"876":2}}],["header",{"2":{"482":1,"493":1,"701":1}}],["headers",{"0":{"406":1,"409":1,"411":1,"413":1},"1":{"407":1,"408":1,"409":1,"410":1,"411":1,"412":1,"413":1,"414":1,"415":1},"2":{"405":1,"406":1,"494":2}}],["head~1",{"2":{"263":1}}],["head",{"0":{"452":1},"2":{"131":4,"134":2,"146":4,"147":8,"257":1,"264":1,"339":4,"461":3,"715":5}}],["heapifydown",{"2":{"12":2}}],["heapifyup",{"2":{"12":2}}],["heap",{"2":{"12":2}}],["height",{"0":{"629":1},"1":{"630":1},"2":{"20":1,"168":2,"188":4,"190":4,"191":12,"583":6,"586":3,"595":2,"718":4}}],["void",{"2":{"842":4,"859":5,"860":2,"861":1,"872":2}}],["vt",{"2":{"814":1}}],["vlsm",{"2":{"550":1,"551":1}}],["vlan",{"2":{"427":1}}],["vuepress",{"0":{"336":1},"1":{"337":1,"338":1,"339":1,"340":1,"341":1,"342":1,"343":1,"344":1,"345":1},"2":{"338":2}}],["verticla",{"2":{"580":1}}],["vertical无效",{"2":{"651":1}}],["vertical",{"0":{"628":1},"2":{"326":4,"580":1}}],["version",{"2":{"253":4,"490":2,"832":1}}],["validation",{"2":{"852":4}}],["valid",{"2":{"635":1}}],["value=",{"2":{"876":6}}],["values",{"2":{"668":2}}],["value",{"2":{"326":2,"668":1,"669":15,"718":8,"736":6,"737":6,"762":1,"865":1,"876":7}}],["variable",{"2":{"550":1}}],["variables",{"2":{"253":2}}],["var2",{"2":{"241":2}}],["var1",{"2":{"241":2}}],["var",{"2":{"114":6,"210":6,"211":6,"232":2,"303":2,"304":4,"305":4,"666":2,"668":1,"669":6,"715":2,"717":5,"718":11,"723":2,"736":6,"761":14,"762":8,"764":14,"766":1,"775":2,"776":4,"797":2,"801":2,"802":8,"803":4,"806":8,"809":6,"810":6,"835":3,"848":2,"854":2,"859":1}}],["vars",{"2":{"98":2}}],["vscode",{"2":{"252":1}}],["vs",{"0":{"827":1,"829":1},"2":{"227":1,"345":1,"668":1,"837":1}}],["v8",{"0":{"169":1,"171":1},"1":{"170":1,"171":1,"172":2,"173":2,"174":2,"175":1,"176":1,"177":1,"178":1,"179":1,"180":1,"181":1,"182":1,"183":1,"184":1,"185":1},"2":{"175":1,"347":4,"820":1}}],["vmscript",{"2":{"147":6}}],["vmcontext",{"2":{"147":2}}],["vm模块",{"2":{"147":2}}],["vm",{"0":{"147":1},"2":{"147":13}}],["video",{"2":{"638":1}}],["vitals",{"2":{"382":1}}],["vitepress",{"0":{"336":1},"1":{"337":1,"338":1,"339":1,"340":1,"341":1,"342":1,"343":1,"344":1,"345":1},"2":{"336":1}}],["visuals",{"2":{"348":1}}],["visibility",{"0":{"652":1,"654":1,"655":1},"1":{"653":1,"654":1,"655":1,"656":1,"657":1,"658":1,"659":1,"660":1,"661":1},"2":{"586":1,"655":2}}],["visible",{"2":{"326":3,"575":1,"635":1,"654":1,"655":1}}],["visibleitem",{"2":{"190":4}}],["visited",{"2":{"16":1,"635":1}}],["viz",{"0":{"353":1},"2":{"348":1,"353":1,"367":1,"368":1}}],["view2",{"2":{"850":4}}],["view1",{"2":{"850":2}}],["views",{"2":{"850":8}}],["viewport",{"2":{"131":2,"146":2,"147":4,"701":1}}],["view",{"2":{"41":2,"221":1}}],["v",{"2":{"12":2,"253":2}}],["aargs",{"2":{"806":10}}],["audio",{"2":{"638":1}}],["author",{"2":{"701":1,"832":1}}],["authentication",{"0":{"535":1,"544":1}}],["authroritative",{"0":{"510":1}}],["autoselect",{"2":{"428":12}}],["automatically",{"2":{"253":4}}],["auto",{"0":{"590":1},"2":{"188":2,"268":2,"575":1,"590":4,"591":2,"592":2,"593":2,"594":6,"595":2,"655":3}}],["awdl0",{"2":{"428":4}}],["a5",{"2":{"428":4}}],["a7",{"2":{"428":4}}],["ajax",{"2":{"402":1,"730":2}}],["age=300",{"2":{"400":2}}],["age",{"0":{"400":1,"412":1},"2":{"762":8}}],["aggregate",{"0":{"367":1},"2":{"353":1}}],["advanced",{"0":{"837":1}}],["admin",{"2":{"396":6}}],["address",{"2":{"434":1,"467":1}}],["addr",{"2":{"421":2}}],["addrange",{"2":{"114":1}}],["adds",{"2":{"253":2}}],["addition",{"2":{"253":2}}],["additional",{"2":{"253":2}}],["additionalchunkassets",{"2":{"137":1}}],["addednodes",{"2":{"156":5,"751":5}}],["addeventlistener",{"0":{"711":1},"1":{"712":1,"713":1},"2":{"44":1,"168":14,"195":2,"218":3,"269":2,"270":2,"419":4,"711":1,"713":8,"715":2}}],["addlistener",{"2":{"149":2}}],["addword",{"2":{"14":1}}],["add",{"2":{"12":2,"168":16,"421":2,"668":2,"717":1,"718":1,"861":2}}],["ambient",{"0":{"843":1},"2":{"846":1,"865":1}}],["am",{"2":{"802":4}}],["amd",{"0":{"302":1},"1":{"303":1,"304":1},"2":{"240":1,"300":1,"839":1,"854":4,"857":2,"868":1}}],["amp",{"0":{"336":1,"589":1,"596":1,"663":1,"666":4,"668":2,"677":2,"680":2,"846":1,"853":1,"872":1},"1":{"337":1,"338":1,"339":1,"340":1,"341":1,"342":1,"343":1,"344":1,"345":1,"590":1,"591":1,"592":1,"593":1,"594":1,"595":1,"597":1,"598":1,"599":1,"600":1,"601":1,"602":1,"603":1},"2":{"4":3,"48":1,"92":4,"98":12,"191":8,"219":1,"232":4,"253":4,"349":2,"352":1,"378":1,"575":1,"667":1,"669":1,"672":2,"698":8,"703":1,"715":1,"717":6,"739":8,"744":2,"806":4,"815":1,"837":2,"863":1,"865":2,"870":1,"874":3}}],["abbr",{"0":{"689":1},"2":{"689":4}}],["ab",{"2":{"666":6}}],["about",{"2":{"666":2,"859":1}}],["abort",{"2":{"224":1,"256":2,"259":2}}],["abc",{"2":{"242":4,"666":22}}],["abstractview",{"2":{"221":1}}],["absolute",{"2":{"188":6,"575":1,"582":1,"718":2}}],["acceptcharset",{"2":{"718":1}}],["acceptable",{"0":{"534":1}}],["accepted",{"0":{"509":1}}],["accept",{"0":{"493":1},"2":{"482":1,"490":2,"494":3,"718":1}}],["access",{"0":{"407":1,"408":1,"409":1,"410":1,"411":1,"412":1,"413":1,"414":1},"2":{"467":1,"476":1}}],["ack",{"2":{"422":3,"424":1}}],["action",{"2":{"718":2}}],["action=",{"2":{"402":2}}],["activate",{"0":{"365":1}}],["active",{"2":{"168":23,"428":6,"635":1}}],["achromatic",{"2":{"210":2,"211":2}}],["aliases",{"2":{"837":1}}],["align",{"0":{"591":1,"594":1,"628":1},"2":{"326":7}}],["already",{"0":{"515":1}}],["allowsyntheticdefaultimports",{"2":{"857":2}}],["allowed",{"0":{"533":1}}],["allow",{"0":{"407":1,"408":1,"409":1,"410":1},"2":{"380":1,"424":4}}],["all",{"2":{"251":1,"575":1,"666":2}}],["altkey",{"2":{"226":1}}],["alternate",{"2":{"167":2}}],["alterassettaggroups",{"2":{"139":2}}],["alterassettags",{"2":{"139":2}}],["alert",{"2":{"216":2,"217":2,"219":2,"394":1,"717":8,"718":2}}],["alpha",{"2":{"208":11,"641":1}}],["attr",{"2":{"640":1,"716":1}}],["attributeoldvalue",{"2":{"160":3,"755":3}}],["attributefilter",{"2":{"160":3,"755":3}}],["attribute",{"2":{"157":2,"752":2}}],["attributenamespace",{"2":{"156":5,"751":5}}],["attributename",{"2":{"156":5,"751":5}}],["attributes",{"2":{"151":1,"155":2,"156":8,"158":4,"159":4,"160":3,"716":1,"746":1,"750":2,"751":8,"753":4,"754":4,"755":3}}],["attachevent",{"2":{"219":3}}],["attachment",{"2":{"198":1}}],["ansi",{"0":{"812":1},"1":{"813":1,"814":1,"815":1},"2":{"812":1,"815":1}}],["any",{"2":{"496":1,"635":1,"842":6,"859":3,"863":1,"872":3}}],["anything",{"2":{"396":2}}],["anguished",{"2":{"345":1}}],["angry",{"2":{"345":1}}],["an",{"2":{"326":2,"328":2,"876":2}}],["and",{"0":{"863":1},"2":{"253":4,"429":1,"548":3,"737":2,"861":1}}],["animationend",{"2":{"168":2}}],["animationstart",{"2":{"168":2}}],["animation",{"2":{"167":10}}],["anchoroffset",{"2":{"114":1}}],["anchornode",{"2":{"114":2}}],["after",{"2":{"602":2,"633":1,"639":1,"739":2}}],["afteremit",{"2":{"139":2}}],["aftertemplateexecution",{"2":{"139":2}}],["ascii",{"2":{"703":1,"704":1,"705":1,"814":2,"815":1}}],["ascii码",{"2":{"227":1}}],["aside",{"0":{"686":1}}],["async",{"0":{"312":1,"680":1},"2":{"310":1,"376":1,"680":4}}],["asyncserieswaterfallhook",{"2":{"139":16}}],["assertions",{"2":{"859":1}}],["assertion",{"2":{"837":1}}],["assets",{"2":{"131":2}}],["assignment",{"2":{"742":1}}],["assignmentlet",{"2":{"742":1}}],["assign",{"2":{"271":2,"876":1}}],["as",{"2":{"253":2,"843":2,"844":2,"857":2,"859":2,"860":4,"870":2}}],["ast",{"2":{"170":2,"173":1,"766":1}}],["apiresponsetype",{"2":{"841":4}}],["api",{"0":{"154":1,"196":1,"256":1,"259":1,"262":1,"265":1,"267":1,"712":1,"749":1},"1":{"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"268":1,"269":1,"270":1,"271":1,"750":1,"751":1,"752":1,"753":1,"754":1,"755":1,"756":1,"757":1,"758":1,"759":1},"2":{"112":1,"154":1,"196":3,"198":3,"199":1,"380":5,"668":4,"716":1,"717":1,"749":1,"762":1,"820":1,"825":1,"841":4,"857":2,"870":2}}],["appid",{"2":{"717":6}}],["applet",{"2":{"638":1}}],["apple",{"2":{"345":1,"693":9}}],["application",{"2":{"205":1,"454":2,"471":1,"701":1}}],["apply",{"2":{"79":2,"82":4,"86":4,"89":2,"92":4,"98":2,"131":2,"135":2,"143":4,"253":2,"764":4,"803":2,"806":6,"810":4}}],["app",{"2":{"102":4,"104":6,"106":2,"131":2,"146":2,"147":4,"217":8,"218":8,"219":8,"339":2,"871":2}}],["appendchild",{"2":{"158":4,"229":1,"675":2,"716":1,"718":2,"753":4}}],["append",{"2":{"18":1}}],["arr",{"2":{"743":4,"859":4,"860":6}}],["arraybuffer",{"0":{"671":1},"2":{"206":1,"671":5}}],["array",{"2":{"13":2,"253":2,"304":1,"668":4,"806":4,"859":3}}],["arg",{"2":{"866":24}}],["arguments",{"2":{"718":6,"764":4,"797":2,"806":4,"810":4}}],["argsarr",{"2":{"803":2}}],["args",{"2":{"76":4,"79":4,"82":6,"86":6,"89":4,"92":6,"98":8,"764":4,"806":6,"842":2}}],["article",{"0":{"687":1}}],["are",{"2":{"677":2}}],["around",{"0":{"593":1},"2":{"593":2}}],["arp",{"2":{"427":1,"480":3}}],["aot",{"2":{"53":1}}],["a",{"0":{"23":1,"441":1,"840":1},"1":{"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1},"2":{"98":2,"143":8,"147":2,"156":8,"158":4,"239":10,"242":2,"246":2,"253":4,"257":5,"303":8,"304":8,"305":10,"306":8,"309":2,"326":4,"402":5,"429":3,"439":1,"440":1,"546":1,"548":1,"566":2,"618":2,"643":1,"664":2,"666":6,"669":10,"672":34,"723":8,"737":6,"742":2,"751":8,"753":4,"761":10,"762":1,"766":1,"775":6,"776":14,"797":6,"801":8,"802":10,"803":6,"809":6,"814":1,"815":2,"835":4,"837":1,"847":2,"848":3,"849":4,"852":2,"859":3,"860":10,"864":6,"865":2,"866":6,"870":6,"874":12}}],["每段",{"2":{"550":1}}],["每一个",{"2":{"726":1}}],["每一个字节都为",{"2":{"446":1}}],["每一项的高度",{"2":{"191":2}}],["每一项的高度100",{"2":{"188":2}}],["每一项高度",{"2":{"190":2}}],["每一项高度固定",{"2":{"188":1}}],["每次请求都要携带完整的头部",{"2":{"489":1}}],["每次",{"2":{"191":2}}],["每次多展示两条数据",{"2":{"190":2}}],["每次mutationrecord被添加到mutationobserver的记录队列时",{"2":{"162":1,"757":1}}],["每次编译时都触发主",{"2":{"132":1}}],["每次输入完毕",{"2":{"75":1}}],["每次取堆顶元素",{"2":{"12":1}}],["每日定时执行",{"2":{"24":1}}],["每个插件一个进程",{"2":{"729":1}}],["每个盒子由四部分组成",{"2":{"585":1}}],["每个部分",{"2":{"429":1}}],["每个",{"2":{"354":1,"729":1}}],["每个合格的突变",{"2":{"161":1,"756":1}}],["每个阶段",{"2":{"67":1}}],["每个开发者都认领",{"2":{"64":1}}],["每个节点的属性",{"2":{"14":1}}],["每个叶子节点都是黑色的空节点",{"2":{"7":1}}],["实体类型",{"2":{"838":1}}],["实验室工具",{"2":{"382":1}}],["实测工具",{"2":{"382":1}}],["实际引用或者指向硬盘驱动器上的某个点",{"2":{"320":1}}],["实际上",{"2":{"114":1}}],["实际上已经生成",{"2":{"104":1}}],["实时性高",{"2":{"794":1}}],["实时性更强",{"2":{"489":1}}],["实时传输协议",{"2":{"571":1}}],["实时监听滚动的高度",{"2":{"188":1}}],["实时编译",{"2":{"104":1}}],["实例化对象无法访问",{"2":{"864":1}}],["实例化对象和子类都无法访问",{"2":{"864":1}}],["实例类型",{"2":{"838":1}}],["实例属性",{"2":{"206":1}}],["实例对象方法",{"2":{"198":1}}],["实例对象属性",{"2":{"198":1}}],["实例时",{"2":{"163":1,"758":1}}],["实例",{"0":{"159":1,"754":1}}],["实例方法",{"2":{"12":1,"13":1,"14":1,"206":1}}],["实现网络管理和系统支持功能",{"2":{"466":1}}],["实现一个缓冲机制",{"2":{"365":1}}],["实现一个简易热更新",{"0":{"99":1},"1":{"100":1,"101":1,"102":1,"103":1,"104":1,"105":1,"106":1,"107":1,"108":1,"109":1}}],["实现双方通信",{"2":{"105":1}}],["实现思考",{"0":{"100":1},"1":{"101":1,"102":1,"103":1,"104":1,"105":1,"106":1}}],["实现热更新",{"2":{"99":1}}],["实现多种完整版的防抖节流",{"2":{"73":1}}],["实现",{"0":{"8":1,"94":1,"195":1},"1":{"95":1,"96":1,"97":1,"98":1},"2":{"188":1,"466":1}}],["递归调用",{"2":{"820":1}}],["递归遍历根元素",{"2":{"183":1}}],["递归寻找",{"2":{"21":1}}],["递归",{"2":{"14":1}}],["递归左右子节点",{"2":{"12":1}}],["递归父节点",{"2":{"12":1}}],["自带凭证",{"0":{"683":1}}],["自签名证书",{"2":{"567":1}}],["自协议",{"2":{"489":1}}],["自定义数据属性",{"2":{"717":1}}],["自定义应用数据",{"2":{"569":1}}],["自定义压缩算法",{"2":{"489":1}}],["自定义扩展协议",{"2":{"489":1}}],["自定义解析",{"2":{"238":1}}],["自动引用合适的上下文对象",{"2":{"796":1}}],["自动执行器注意的是",{"2":{"669":1}}],["自动执行器",{"2":{"669":2}}],["自动验证",{"2":{"568":1}}],["自动返回错误的信息",{"2":{"480":1}}],["自动化测试",{"2":{"64":1}}],["自动化",{"0":{"24":1},"2":{"23":1}}],["自由匹配规则插入到index",{"2":{"145":2}}],["自由处理规则",{"2":{"144":2}}],["自由实现",{"2":{"131":2}}],["自己注入标签",{"2":{"131":2}}],["自顶向下",{"2":{"12":2}}],["自下向顶",{"2":{"12":2}}],["右关联",{"2":{"744":2}}],["右关联相同操作符按照从右往左的顺序执行",{"2":{"744":1}}],["右移一位",{"2":{"297":1}}],["右",{"2":{"21":3}}],["右节点需要寻找最小节点作为当前删除节点",{"2":{"21":1}}],["右字节点下标",{"2":{"12":1}}],["右旋",{"2":{"8":1}}],["+$",{"2":{"835":2,"852":2}}],["+2",{"2":{"294":3}}],["+0",{"2":{"294":2}}],["++",{"2":{"191":2,"744":1}}],["+1",{"2":{"191":2,"294":3,"345":1}}],["+=",{"2":{"147":2,"188":2,"191":4,"208":6,"210":2}}],["+options",{"2":{"98":2}}],["+wait",{"2":{"98":2}}],["+",{"0":{"295":1,"559":1,"613":1},"1":{"296":1,"297":1,"298":1,"299":1,"560":1,"561":1},"2":{"12":2,"24":5,"53":1,"99":1,"101":1,"143":4,"147":6,"188":6,"190":8,"191":6,"195":2,"210":10,"211":10,"219":2,"234":2,"242":2,"246":8,"268":1,"271":2,"294":4,"298":4,"347":11,"399":4,"419":2,"441":1,"442":1,"443":1,"480":2,"481":1,"494":2,"550":1,"666":6,"718":8,"741":2,"744":1,"815":1,"861":2,"865":4,"874":2}}],["io",{"2":{"428":12}}],["icmp",{"2":{"427":1,"466":1,"480":1}}],["icon",{"2":{"134":2}}],["ipv6",{"0":{"430":1}}],["ipv4",{"0":{"429":1},"2":{"498":1,"546":1}}],["ipconfig",{"2":{"428":1}}],["ipsec",{"2":{"427":1}}],["iproute2",{"2":{"421":1}}],["ip",{"0":{"421":1,"428":1,"431":1,"434":1,"435":1,"436":1,"437":1,"440":1,"447":1,"478":1},"1":{"429":1,"430":1,"431":1,"435":1,"436":1,"437":1,"438":2,"439":2,"440":1,"441":2,"442":2,"443":2,"444":2,"445":2,"446":2,"447":1,"479":1,"480":1,"481":1,"482":1,"483":1},"2":{"421":4,"422":9,"424":2,"425":1,"427":1,"429":4,"432":1,"433":1,"440":2,"446":6,"447":2,"459":1,"465":1,"466":1,"475":1,"478":2,"480":8,"481":1,"483":2,"486":1,"497":1,"499":1,"545":3,"546":3,"547":3,"548":2,"549":1,"550":1,"551":3,"552":1,"562":1}}],["idle",{"0":{"823":1},"2":{"819":1,"820":1}}],["identity",{"2":{"866":14}}],["identifier",{"2":{"494":1}}],["ide",{"2":{"857":2}}],["idempotent",{"2":{"461":1}}],["idconst",{"2":{"309":1}}],["id",{"0":{"606":1},"2":{"303":2,"309":6,"428":2,"446":1,"837":1}}],["id=",{"2":{"104":2,"131":2,"146":2,"147":4,"168":2,"188":2,"195":2,"217":2,"218":2,"219":2,"339":2,"713":6,"715":2}}],["ignore",{"2":{"253":12,"424":2,"872":1}}],["ignorepatterns",{"2":{"252":1}}],["ignoring",{"2":{"253":2}}],["ignition",{"2":{"174":2}}],["iec",{"2":{"812":1}}],["ie=edge",{"2":{"701":1}}],["ie4",{"2":{"311":1}}],["ieee754",{"2":{"284":1}}],["ieee",{"0":{"272":1},"1":{"273":1,"274":1,"275":1,"276":1,"277":1,"278":1,"279":1,"280":1,"281":1,"282":1,"283":1,"284":1,"285":1,"286":1,"287":1,"288":1,"289":1,"290":1,"291":1,"292":1,"293":1,"294":1,"295":1,"296":1,"297":1,"298":1,"299":1},"2":{"283":1}}],["ie7",{"2":{"232":2}}],["ie8",{"2":{"232":2}}],["ie8及之前版本都不支持",{"2":{"226":1}}],["ie5",{"2":{"225":2}}],["ie",{"0":{"219":1,"222":1},"2":{"222":2,"717":1,"718":2}}],["ie9",{"2":{"212":1,"218":1}}],["i++",{"2":{"188":2,"191":2}}],["it",{"0":{"702":1},"2":{"326":2,"666":2,"675":2,"848":3,"849":4}}],["its",{"2":{"326":4}}],["item4",{"2":{"594":2}}],["item3",{"2":{"592":4,"594":10}}],["item2",{"2":{"592":4,"594":12}}],["item1",{"2":{"592":4,"594":6}}],["items",{"0":{"591":1},"2":{"575":1}}],["itemsize",{"2":{"188":12}}],["item",{"2":{"575":1,"591":4,"593":8,"646":24,"716":1,"718":1}}],["itemcount",{"2":{"190":8,"191":8}}],["itemheight",{"2":{"188":10,"190":8}}],["iteration",{"2":{"167":1}}],["italic",{"2":{"113":1}}],["iii",{"2":{"156":2,"751":2,"866":2}}],["ii",{"2":{"156":2,"751":2,"866":2}}],["im",{"0":{"516":1}}],["imports",{"2":{"850":4}}],["importing",{"0":{"841":1}}],["important",{"2":{"718":1}}],["import",{"0":{"620":1,"840":1},"2":{"306":4,"672":3,"675":2,"680":2,"681":2,"682":2,"839":1,"840":1,"841":5,"843":2,"844":5,"847":2,"849":2,"852":2,"857":4,"870":1,"871":1,"876":1}}],["implements",{"2":{"852":2,"860":1}}],["implemented",{"0":{"540":1}}],["implementation",{"2":{"223":4}}],["impliedstrict",{"2":{"237":1}}],["img",{"2":{"224":1,"402":1,"638":1,"643":1}}],["image",{"2":{"205":1,"402":1}}],["ime",{"2":{"116":2}}],["immediate",{"2":{"79":2,"82":2}}],["isrequired",{"2":{"876":4}}],["isacceptable",{"2":{"852":2}}],["ispirme",{"2":{"844":2}}],["isprime",{"2":{"844":8}}],["isprototypeof",{"2":{"762":1}}],["isolatedmodules",{"2":{"841":1}}],["iso",{"2":{"812":1}}],["isview",{"2":{"671":1}}],["ish",{"2":{"265":6}}],["is",{"2":{"253":2,"326":4,"635":1,"666":4,"775":2,"797":2,"801":2,"806":4,"837":1,"850":4,"876":1}}],["issecurecontext",{"2":{"196":1,"200":2}}],["issupported",{"2":{"223":4,"232":2}}],["issupport",{"2":{"168":4}}],["isc",{"2":{"832":1}}],["iscallable",{"2":{"806":2}}],["iscroll",{"0":{"188":1}}],["iscollapsed",{"2":{"114":1}}],["iscompleteword",{"2":{"14":1}}],["isinvoking",{"2":{"98":4}}],["istanbul",{"2":{"25":1}}],["ifc",{"0":{"577":1},"1":{"578":1},"2":{"577":2}}],["ifcost",{"2":{"428":2}}],["ifconfig",{"2":{"421":4,"428":2}}],["ifmaxaddr",{"2":{"428":4}}],["iframe",{"2":{"350":1,"354":1,"380":1,"402":3,"419":1,"638":1}}],["if",{"0":{"722":1},"2":{"19":2,"76":2,"79":4,"82":6,"86":4,"89":4,"92":8,"98":14,"143":2,"168":6,"188":2,"200":2,"210":12,"211":2,"253":2,"271":1,"326":4,"419":4,"522":2,"718":6,"761":2,"806":3,"810":1,"842":6,"848":3,"849":4,"850":2}}],["increment",{"2":{"861":2}}],["incremental",{"2":{"185":1}}],["include",{"2":{"832":1,"857":4}}],["incoming",{"2":{"820":1}}],["inherit",{"2":{"762":2}}],["inheritprototype",{"2":{"762":4}}],["innertext",{"2":{"717":1}}],["innerhtml",{"2":{"717":9}}],["invalid",{"2":{"635":2,"742":2}}],["invocations",{"2":{"98":2}}],["invoke",{"2":{"98":2}}],["invokefunc",{"2":{"98":8}}],["inaddr",{"2":{"496":1}}],["inactive",{"2":{"428":8}}],["infer",{"2":{"837":2}}],["information",{"0":{"510":1},"2":{"253":4}}],["info",{"2":{"253":2}}],["infinite",{"2":{"167":1}}],["int32array",{"2":{"671":2}}],["intrinsic",{"2":{"655":3}}],["into",{"2":{"257":2}}],["int",{"2":{"253":2}}],["intersection",{"0":{"863":1}}],["interval",{"2":{"860":6}}],["interfaces",{"0":{"860":1},"2":{"860":2}}],["interface",{"2":{"837":1,"843":2,"852":2,"860":5,"864":3,"866":7,"874":5}}],["intermediates",{"2":{"568":1}}],["inter",{"2":{"551":1}}],["internal",{"0":{"539":1}}],["internet",{"2":{"347":1,"434":1,"478":1}}],["interconnect",{"2":{"470":1}}],["interim",{"2":{"424":2}}],["interger",{"2":{"221":2}}],["interactive",{"2":{"230":1,"256":4,"388":1}}],["interact",{"2":{"56":1}}],["inline",{"0":{"680":1},"2":{"198":1,"246":2,"253":4,"326":9,"575":1,"577":1,"583":1,"598":2,"627":1,"628":2,"643":3,"644":2,"647":3,"679":6,"680":2}}],["inject",{"2":{"134":2}}],["indeterminate",{"2":{"635":1}}],["indempotent",{"2":{"461":1}}],["inde",{"2":{"137":1}}],["indent",{"2":{"113":1}}],["indexable",{"2":{"860":1}}],["index++",{"2":{"191":2}}],["indexdb",{"2":{"55":1}}],["index",{"0":{"144":1,"146":1},"1":{"147":1},"2":{"12":4,"104":1,"106":5,"114":1,"131":2,"132":1,"134":2,"137":4,"143":6,"144":2,"147":6,"189":2,"191":16,"269":2,"392":1,"660":1,"718":3,"848":4,"849":12,"850":2,"857":4,"858":2,"860":2}}],["insights",{"2":{"382":2}}],["instancetype",{"2":{"838":1}}],["instanceof",{"2":{"761":2,"806":6}}],["instance",{"2":{"354":1,"761":1,"764":6}}],["installhandlers",{"2":{"106":2}}],["insertbefore",{"2":{"229":1,"716":1}}],["insertparagraph",{"2":{"113":1}}],["insertunorderedlist",{"2":{"113":1}}],["insertorderedlist",{"2":{"113":1}}],["insertimage",{"2":{"113":1}}],["inserthorizontalrule",{"2":{"113":1}}],["insert",{"2":{"12":1,"18":1,"20":2}}],["in",{"2":{"98":6,"167":2,"168":2,"232":2,"253":4,"326":6,"635":1,"742":2,"837":2,"862":4}}],["initramfs",{"2":{"423":1,"425":1}}],["initialization",{"2":{"253":2}}],["initial",{"2":{"131":2,"146":2,"147":4,"649":2}}],["init",{"2":{"98":2,"253":2}}],["inputmethod",{"2":{"227":1}}],["input",{"2":{"56":1,"111":1,"349":1,"350":1,"352":1,"390":1,"608":1,"633":1,"638":1,"717":2}}],["i",{"0":{"819":1},"2":{"12":4,"156":2,"188":10,"191":6,"198":1,"256":4,"751":2,"802":4,"819":4,"822":1,"824":3,"827":1,"866":2}}],["左上角",{"2":{"815":1}}],["左关联",{"2":{"744":3}}],["左关联相同操作符按照从左往右的顺序执行",{"2":{"744":1}}],["左边框宽度和右边框宽度",{"2":{"718":1}}],["左边按钮",{"2":{"226":1}}],["左侧侧边栏",{"2":{"686":1}}],["左对齐",{"2":{"113":1}}],["左",{"2":{"21":3}}],["左右",{"2":{"21":1}}],["左字节点下标",{"2":{"12":1}}],["左旋",{"2":{"8":1}}],["数值成员必须为对象",{"2":{"668":1}}],["数表示",{"0":{"284":1}}],["数组只读",{"2":{"860":2}}],["数组参数",{"2":{"803":1}}],["数组去重",{"2":{"668":1}}],["数组结构赋值",{"2":{"664":1}}],["数组",{"2":{"160":2,"198":1,"303":1,"755":2,"761":1,"795":1}}],["数组存储",{"2":{"12":1}}],["数字枚举类型",{"2":{"865":1}}],["数字类型枚举",{"2":{"865":1}}],["数字引用",{"2":{"666":2}}],["数字证书链",{"2":{"568":1}}],["数字证书",{"2":{"568":1}}],["数字证书拓展",{"0":{"568":1}}],["数字证书最核心的内容就是使用其自有的私钥生成的数字签名",{"2":{"567":1}}],["数字签名",{"0":{"565":1}}],["数字",{"2":{"113":1}}],["数量",{"2":{"52":1}}],["数据传输加密过程",{"2":{"552":1}}],["数据包的对",{"2":{"551":1}}],["数据包的长度",{"2":{"481":1}}],["数据包的长度不会超过",{"2":{"481":1}}],["数据包+4",{"2":{"489":1}}],["数据包没有长度限制",{"2":{"481":1}}],["数据包丢失",{"2":{"481":1}}],["数据包被发送到主机上以后",{"2":{"481":1}}],["数据包必须是一块网卡传送到另一块网卡",{"2":{"479":1}}],["数据链表尾",{"2":{"476":1}}],["数据链表头",{"2":{"476":1}}],["数据链路层",{"0":{"476":1},"2":{"464":1,"552":1}}],["数据格式的解析",{"2":{"351":1}}],["数据与",{"2":{"321":1}}],["数据所在的位置",{"2":{"317":1}}],["数据",{"2":{"172":1,"481":1}}],["数据监控",{"0":{"47":1}}],["数据上报",{"0":{"46":1}}],["数据埋点与收集",{"0":{"42":1},"1":{"43":1,"44":1,"45":1,"46":1,"47":1}}],["数据层",{"2":{"33":1}}],["数据模块",{"2":{"33":1}}],["数据结构性能优化",{"2":{"128":1}}],["数据结构辅助记忆",{"0":{"10":1},"1":{"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1}}],["数据结构有限",{"2":{"9":1}}],["堆空间的垃圾回收",{"0":{"178":1}}],["堆空间",{"0":{"177":1,"791":1},"2":{"788":1}}],["堆排序",{"2":{"12":1}}],["堆",{"0":{"12":1,"795":1}}],["常量基本类型不能赋值",{"2":{"865":1}}],["常量定义可以为结算",{"2":{"865":1}}],["常规",{"2":{"815":1}}],["常见配置介绍",{"2":{"857":2}}],["常见解析",{"0":{"847":1}}],["常见解决方案",{"0":{"187":1}}],["常见网络协议",{"0":{"427":1}}],["常见的数据结构",{"0":{"11":1},"1":{"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1}}],["常用于多机测试",{"2":{"497":1}}],["常用配置",{"2":{"134":2}}],["常用的位运算操作",{"0":{"4":1}}],["算法函数计算明文信息",{"2":{"566":1}}],["算法无限",{"2":{"9":1}}],["算法",{"2":{"9":1,"13":1,"182":1}}],["算法的执行时间与数据规模之间的增长关系",{"2":{"2":1}}],["3d",{"2":{"729":1}}],["3xx",{"0":{"517":1},"1":{"518":1,"519":1,"520":1,"521":1,"522":1,"523":1,"524":1,"525":1,"526":1}}],["3a44",{"2":{"428":2}}],["3a",{"2":{"289":1}}],["34",{"2":{"277":1,"283":1}}],["32位的ip地址一分为二",{"2":{"429":1}}],["32",{"2":{"274":1,"283":2,"429":3,"547":1,"671":2}}],["3拖放进来",{"2":{"227":1}}],["3表示数字小键盘",{"2":{"227":1}}],["36028797018963968",{"2":{"282":1}}],["360",{"2":{"210":5,"347":2}}],["3位",{"2":{"208":4}}],["39",{"2":{"98":40,"104":4,"106":8,"114":8,"131":4,"134":12,"139":28,"143":20,"144":8,"147":32,"149":4,"153":4,"155":12,"156":44,"157":16,"158":24,"159":16,"168":120,"188":4,"195":24,"200":24,"201":12,"202":8,"203":8,"216":4,"217":8,"218":8,"219":8,"223":16,"232":4,"269":4,"270":4,"303":8,"304":16,"305":8,"306":8,"309":4,"326":14,"339":4,"380":8,"395":4,"396":4,"399":4,"400":4,"419":32,"494":16,"602":4,"666":76,"667":8,"672":12,"675":12,"680":8,"682":4,"684":4,"713":40,"715":4,"717":28,"718":40,"736":8,"737":16,"741":8,"748":4,"750":12,"751":44,"752":16,"753":24,"754":16,"761":60,"762":8,"763":8,"764":8,"775":8,"801":8,"802":4,"806":8,"835":12,"840":4,"841":8,"843":12,"844":4,"847":4,"850":8,"854":12,"857":22,"859":8,"860":8,"862":12,"865":4,"866":8,"871":4,"876":16}}],["307",{"0":{"525":1}}],["306",{"0":{"524":1}}],["305",{"0":{"523":1}}],["304",{"0":{"522":1}}],["303",{"0":{"521":1}}],["302",{"0":{"520":1}}],["301",{"0":{"519":1}}],["308",{"0":{"526":1},"2":{"280":1}}],["3000",{"2":{"490":2}}],["300",{"0":{"518":1},"2":{"190":2,"191":2}}],["30w+",{"2":{"62":1}}],["30+",{"2":{"62":1}}],["3",{"0":{"295":1,"297":1},"1":{"296":1,"297":1,"298":1,"299":1},"2":{"8":7,"24":1,"112":2,"114":1,"168":2,"210":8,"221":1,"223":8,"226":1,"237":2,"283":2,"290":1,"297":2,"298":1,"311":1,"312":1,"344":2,"441":1,"443":1,"463":1,"594":4,"644":3,"646":9,"647":1,"648":2,"666":1,"668":6,"669":12,"672":10,"678":3,"761":1,"762":1,"809":2,"835":2,"841":1,"862":2,"864":2,"876":1}}],["31",{"2":{"8":1,"429":1,"439":1,"440":1}}],["2const",{"2":{"671":1}}],["2xx",{"0":{"506":1},"1":{"507":1,"508":1,"509":1,"510":1,"511":1,"512":1,"513":1,"514":1,"515":1,"516":1}}],["226",{"0":{"516":1}}],["224",{"2":{"444":1}}],["223",{"2":{"429":1,"440":1}}],["27",{"2":{"429":1,"814":1}}],["28",{"2":{"429":1}}],["29",{"2":{"428":6}}],["2d7c",{"2":{"428":2}}],["25px",{"2":{"718":2}}],["258eafa5",{"2":{"494":1}}],["254",{"2":{"429":1,"440":4}}],["250",{"2":{"424":2}}],["255",{"2":{"208":6,"209":6,"211":6,"422":8,"424":12,"428":2,"429":19,"439":7,"440":13,"444":3,"446":7,"548":12}}],["20bb7",{"2":{"666":2}}],["208",{"0":{"515":1}}],["207",{"0":{"514":1}}],["206",{"0":{"513":1}}],["205",{"0":{"512":1},"2":{"512":1}}],["204",{"0":{"511":1},"2":{"511":1,"512":1}}],["203",{"0":{"510":1}}],["2022",{"2":{"812":1}}],["2020",{"2":{"694":5}}],["202",{"0":{"509":1}}],["2015",{"2":{"666":4}}],["201",{"0":{"508":1}}],["2018",{"2":{"324":2}}],["2097152",{"2":{"440":1}}],["200px",{"2":{"599":4,"718":2}}],["200",{"0":{"507":1}}],["2008",{"2":{"283":1}}],["2000",{"2":{"76":2,"79":2,"428":2,"618":2}}],["234",{"2":{"835":2}}],["23456",{"2":{"717":2}}],["239",{"2":{"444":1}}],["2304",{"2":{"428":2}}],["23",{"2":{"283":1}}],["2×10^",{"2":{"280":1}}],["2^21",{"2":{"440":1}}],["2^14",{"2":{"440":1}}],["2^1024",{"2":{"280":1}}],["2^7",{"2":{"440":1}}],["2^55",{"2":{"282":1}}],["2^54",{"2":{"282":2}}],["2^53",{"2":{"282":3}}],["2^",{"2":{"280":1,"296":1,"297":1,"298":2}}],["240",{"2":{"424":2}}],["24",{"2":{"274":1,"283":1,"421":4,"429":3,"550":2}}],["2粘贴进来",{"2":{"227":1}}],["2表示右侧键盘",{"2":{"227":1}}],["21600",{"2":{"424":2}}],["21",{"2":{"8":1,"429":1}}],["2",{"2":{"8":7,"12":3,"24":1,"112":2,"114":1,"168":2,"188":4,"190":4,"191":2,"208":8,"210":8,"211":6,"221":1,"223":6,"226":1,"237":1,"243":1,"246":2,"268":1,"280":1,"282":1,"283":2,"287":5,"288":10,"289":3,"290":3,"294":1,"296":8,"297":10,"298":1,"303":2,"326":2,"344":2,"379":1,"429":1,"440":1,"442":2,"594":4,"644":3,"646":9,"647":1,"648":2,"664":1,"666":5,"669":14,"671":3,"672":10,"678":3,"679":3,"681":4,"713":2,"723":2,"761":3,"762":1,"776":8,"797":2,"803":2,"809":2,"815":2,"844":6,"859":6,"860":4,"862":2,"864":2,"866":2,"874":2,"877":2}}],["着色",{"2":{"8":4}}],["rhs",{"0":{"768":1},"2":{"768":1,"770":2}}],["r2",{"2":{"666":4}}],["r1",{"2":{"666":4}}],["rl",{"2":{"580":1}}],["rtcp",{"0":{"571":1},"2":{"571":1}}],["rtp",{"0":{"571":1},"2":{"569":1,"571":3}}],["rtmp",{"2":{"427":1}}],["rfc",{"0":{"504":1,"505":1,"513":1,"514":1,"515":1,"516":1,"526":1,"529":1,"535":1}}],["rxcsum",{"2":{"428":4}}],["rpc",{"2":{"427":1}}],["rapidssl",{"2":{"568":1}}],["random",{"2":{"553":2,"554":4,"555":2,"559":2,"560":2,"563":2}}],["range",{"2":{"114":6,"635":2}}],["rangecount",{"2":{"114":1}}],["rasterization",{"2":{"364":1}}],["raster",{"0":{"364":1},"2":{"359":1,"363":1,"364":1,"365":1}}],["rm",{"2":{"318":2,"322":2}}],["r",{"2":{"210":8,"211":14,"309":8,"666":10}}],["roman",{"2":{"641":2}}],["routing",{"2":{"551":1}}],["router",{"2":{"466":1}}],["routers",{"2":{"424":2}}],["round",{"2":{"208":6}}],["rose",{"2":{"345":1}}],["rootdir",{"2":{"857":2}}],["rootdirs",{"2":{"850":3,"857":2}}],["root",{"2":{"250":1,"256":2,"333":2,"568":1,"575":1,"635":1,"715":10,"847":8,"848":11,"849":25,"870":2}}],["rotation",{"2":{"234":1}}],["row",{"2":{"188":4,"594":2}}],["rgb2hsl",{"2":{"211":2}}],["rgb2hex",{"2":{"209":2}}],["rgb",{"0":{"208":1,"209":1,"210":1,"211":1},"2":{"208":7,"209":7}}],["rulesdir",{"2":{"253":2}}],["rules",{"0":{"243":1},"1":{"244":1,"245":1,"246":1,"247":1},"2":{"236":1,"242":2,"247":4,"253":8}}],["rule",{"2":{"144":2,"242":2,"246":2,"253":2}}],["running",{"2":{"167":1,"428":20,"433":1}}],["runincontext",{"2":{"147":2}}],["runaschild",{"2":{"143":2}}],["run",{"2":{"109":2,"253":4}}],["rdd",{"2":{"34":1}}],["reg",{"2":{"835":4}}],["regexgreeksymbol",{"2":{"666":4}}],["regexp",{"2":{"309":1,"666":5}}],["refcb",{"2":{"877":4}}],["ref=",{"2":{"877":8}}],["ref",{"0":{"877":1},"2":{"877":22}}],["references",{"2":{"857":2}}],["reference",{"2":{"852":2,"854":8,"857":4,"871":2}}],["referenceerror",{"2":{"769":1,"770":1,"775":2,"797":2}}],["referenct",{"2":{"843":2}}],["refresh",{"2":{"701":1}}],["re",{"2":{"666":22}}],["req",{"2":{"494":2}}],["requre",{"2":{"853":1}}],["requrie",{"2":{"309":3}}],["request",{"0":{"413":1,"414":1,"528":1,"536":1},"2":{"402":1,"422":4,"424":1,"456":1,"461":2}}],["requestanimationframe",{"2":{"168":5}}],["requirejs",{"2":{"839":1}}],["required",{"0":{"530":1,"535":1,"544":1},"2":{"635":1,"838":1}}],["require",{"0":{"304":1,"309":1},"2":{"139":2,"143":2,"144":2,"147":2,"303":7,"304":15,"305":4,"494":2,"672":5,"842":6,"848":2,"854":4,"870":1,"871":2}}],["rect",{"2":{"718":10}}],["receivemessage",{"2":{"419":8}}],["record",{"2":{"838":1}}],["records",{"0":{"156":1,"751":1},"2":{"156":1,"163":1,"751":1,"758":1}}],["recommended",{"2":{"251":2}}],["rebase",{"0":{"255":1},"1":{"256":1,"257":1},"2":{"256":6,"257":2}}],["reply",{"2":{"422":1}}],["replaced",{"2":{"636":2}}],["replace",{"2":{"271":2,"666":2,"835":2,"876":1}}],["replacestate",{"2":{"268":3}}],["replacechild",{"2":{"20":1,"229":2,"716":1}}],["reported",{"0":{"515":1},"2":{"253":2}}],["report",{"2":{"253":6}}],["reportunuseddisabledirectives",{"2":{"248":1}}],["realtime",{"2":{"571":1}}],["readme",{"2":{"850":2}}],["readonlyarray",{"2":{"860":4}}],["readonly",{"2":{"241":2,"838":1,"860":6,"864":1}}],["readablestream",{"2":{"206":2}}],["readtext",{"0":{"203":1}}],["read",{"0":{"202":1},"2":{"202":2,"203":2,"635":2}}],["readystate",{"2":{"230":1}}],["readystatechange",{"2":{"43":1,"230":1}}],["ready",{"2":{"56":1}}],["react",{"0":{"189":1},"1":{"190":1,"191":1},"2":{"189":1,"191":2,"251":1,"857":8,"876":7,"877":7}}],["reloption",{"2":{"718":1}}],["reload",{"2":{"106":1,"271":2}}],["relative",{"2":{"253":2,"850":2}}],["rel=",{"2":{"134":2,"402":1}}],["reomverange",{"2":{"114":1}}],["remainingwait",{"2":{"98":4}}],["remaining",{"2":{"98":2}}],["removeproperty",{"2":{"718":1}}],["removeattribute",{"2":{"716":1}}],["removeallranges",{"2":{"114":1}}],["removeeventlistener",{"2":{"168":2,"195":2,"218":1,"715":2}}],["removednodes",{"2":{"156":5,"751":5}}],["removelistener",{"2":{"149":2}}],["removeformat",{"2":{"113":1}}],["removechild",{"2":{"20":1,"229":1,"716":1,"718":2}}],["remove",{"2":{"12":2,"20":2,"717":1,"718":1}}],["rest",{"2":{"861":1}}],["restore",{"0":{"261":1},"1":{"262":1,"263":1,"264":1,"265":1,"266":1},"2":{"262":6,"263":3}}],["res",{"2":{"764":12}}],["response",{"2":{"461":2}}],["responsibility",{"2":{"34":1}}],["resolution",{"0":{"845":1},"1":{"846":1,"847":1,"848":1,"849":1,"850":1,"851":1}}],["resolved",{"2":{"253":2}}],["resolve",{"2":{"144":2,"198":1,"206":1,"253":2,"309":3}}],["resource",{"2":{"405":1}}],["reset",{"0":{"264":1,"512":1},"2":{"265":8,"266":2,"718":1,"860":6}}],["resize",{"2":{"224":1}}],["result",{"2":{"98":10,"156":2,"202":4,"203":4,"678":1,"679":1,"680":1,"681":1,"682":1,"713":4,"751":2}}],["returntype",{"2":{"838":1}}],["returnvalue",{"2":{"222":1,"230":2}}],["return",{"2":{"76":2,"79":2,"82":2,"86":2,"89":2,"92":2,"98":22,"131":4,"139":2,"143":2,"144":2,"147":4,"190":4,"191":4,"200":2,"208":6,"209":2,"210":10,"211":2,"419":4,"669":8,"718":8,"737":6,"761":9,"762":4,"764":4,"806":10,"810":4,"852":2,"854":2,"860":4,"861":2,"866":10,"876":2,"877":2}}],["revert",{"0":{"258":1},"1":{"259":1,"260":1},"2":{"259":4,"266":1}}],["reverse",{"2":{"18":1,"167":2}}],["review",{"2":{"64":1}}],["rendering",{"2":{"347":1,"369":1}}],["render",{"0":{"373":1},"2":{"56":1,"188":2,"349":2,"353":1,"354":3,"357":1}}],["redirect",{"0":{"525":1,"526":1}}],["red",{"2":{"6":1,"208":18,"209":8,"718":2,"859":2}}],["rightheight",{"2":{"20":1}}],["right",{"2":{"8":6,"586":2,"590":2,"592":2,"598":1,"603":1,"635":1,"647":2,"718":4}}],["红色节点不能相邻",{"2":{"7":1}}],["红黑树",{"0":{"6":1},"1":{"7":1,"8":1},"2":{"6":1,"53":1}}],["0m",{"2":{"815":1}}],["03",{"2":{"694":2}}],["0const",{"2":{"671":1}}],["02",{"2":{"666":4}}],["0这个网络",{"2":{"548":2}}],["0a",{"2":{"428":2}}],["01",{"2":{"428":8,"666":4}}],["011001",{"2":{"297":1}}],["01111111",{"2":{"294":1}}],["0x7e",{"2":{"815":1}}],["0x3f",{"2":{"815":1}}],["0x30",{"2":{"815":1}}],["0x40",{"2":{"814":1,"815":1}}],["0xd",{"2":{"428":2}}],["0xc",{"2":{"428":2}}],["0xb",{"2":{"428":2}}],["0xa",{"2":{"428":2}}],["0x2f",{"2":{"815":1}}],["0x20",{"2":{"815":1}}],["0x2",{"2":{"428":2}}],["0xffffff00",{"2":{"428":2}}],["0xff000000",{"2":{"428":2}}],["0x5f",{"2":{"814":1}}],["0x5",{"2":{"428":2}}],["0x1b",{"2":{"814":1}}],["0x1",{"2":{"428":2}}],["0️⃣",{"2":{"345":1}}],["000",{"2":{"616":2}}],["00000001",{"2":{"294":2}}],["00000000",{"2":{"294":1,"548":6}}],["00000010",{"2":{"294":3}}],["0011",{"2":{"298":1}}],["001111",{"2":{"290":1}}],["00111010",{"2":{"289":1}}],["001",{"2":{"296":1,"298":1}}],["0开始",{"2":{"234":1}}],["0肖像模式",{"2":{"233":1}}],["0不确定输入",{"2":{"227":1}}],["0表示默认键盘",{"2":{"227":1}}],["0px",{"2":{"188":2}}],["0",{"0":{"295":3,"296":1,"297":1,"496":4,"499":2},"1":{"296":3,"297":3,"298":3,"299":3,"497":4,"498":4},"2":{"4":1,"58":1,"92":2,"98":8,"114":2,"131":2,"146":2,"147":4,"156":4,"157":2,"159":4,"162":1,"168":10,"188":4,"190":8,"191":10,"208":4,"210":13,"211":6,"223":14,"226":1,"243":1,"271":1,"283":1,"287":3,"288":14,"294":5,"296":11,"297":15,"298":5,"421":8,"422":4,"424":8,"425":1,"428":58,"429":27,"439":7,"440":13,"441":1,"444":3,"446":13,"490":4,"501":1,"548":10,"550":2,"590":1,"592":4,"602":1,"649":3,"655":2,"671":9,"717":1,"718":4,"736":4,"751":4,"752":2,"754":4,"757":1,"797":4,"815":4,"876":1}}],["1f",{"2":{"812":1}}],["1function",{"2":{"809":1}}],["1890ff",{"2":{"876":2}}],["18",{"2":{"762":2}}],["180",{"2":{"424":2}}],["18000",{"2":{"424":2}}],["18014398509481984",{"2":{"282":1}}],["1$",{"2":{"666":4}}],["1d",{"2":{"666":2}}],["1px",{"2":{"644":2,"647":2,"718":2}}],["1xx",{"0":{"501":1},"1":{"502":1,"503":1,"504":1,"505":1},"2":{"501":1}}],["14",{"2":{"429":1}}],["1484",{"2":{"428":2}}],["149c",{"2":{"428":2}}],["1a",{"2":{"428":10}}],["1380",{"2":{"428":2}}],["13",{"2":{"428":6,"490":2,"694":5}}],["1位符号位",{"2":{"295":1}}],["12",{"2":{"671":2,"860":2}}],["1234567890",{"2":{"835":2}}],["123",{"2":{"646":3}}],["126",{"2":{"440":1}}],["122",{"2":{"429":1}}],["1200",{"2":{"428":2}}],["127",{"0":{"499":1},"2":{"283":1,"294":1,"428":2,"429":2,"440":1,"446":5,"490":2}}],["1280",{"2":{"428":4}}],["128",{"2":{"277":1,"283":2,"294":1,"428":2,"429":1,"430":1,"440":1}}],["1999",{"2":{"618":2}}],["191",{"2":{"429":1,"440":1}}],["192",{"2":{"424":10,"428":4,"429":4,"439":2,"440":3,"548":4,"550":1}}],["19",{"2":{"276":1,"283":1}}],["172",{"2":{"429":2,"439":2,"440":2}}],["17",{"2":{"275":1,"290":1}}],["15",{"2":{"275":1,"283":4,"876":1}}],["1500",{"2":{"428":10,"433":3}}],["150",{"2":{"191":2}}],["1键盘输入",{"2":{"227":1}}],["1表示左侧键盘",{"2":{"227":1}}],["1开始",{"2":{"226":1,"234":1}}],["110",{"2":{"443":1}}],["1100",{"2":{"298":1}}],["110101",{"2":{"290":1}}],["11位指数位",{"2":{"295":1}}],["11110",{"2":{"446":1}}],["1111",{"2":{"445":1}}],["11111101",{"2":{"294":1}}],["11111110",{"2":{"294":3}}],["11111111",{"2":{"294":1,"548":6}}],["1110",{"2":{"444":1}}],["11100",{"2":{"298":1}}],["11100111",{"2":{"289":1}}],["113",{"2":{"283":1}}],["112",{"2":{"283":1}}],["11",{"2":{"225":2,"280":1,"283":2,"284":1,"548":2,"667":1}}],["16777214",{"2":{"429":1,"440":1}}],["16384",{"2":{"428":2,"440":1}}],["16383",{"2":{"283":2}}],["168",{"2":{"424":10,"428":4,"429":2,"439":2,"440":2,"548":6,"550":1}}],["16",{"2":{"208":18,"209":6,"277":1,"279":1,"283":2,"289":3,"429":2,"439":1,"440":1,"674":1,"876":1}}],["1+",{"2":{"196":1,"225":2}}],["103",{"0":{"505":1}}],["10mbps",{"2":{"463":1}}],["101",{"0":{"503":1},"2":{"298":2,"490":3}}],["102",{"0":{"504":1}}],["1023",{"2":{"283":1}}],["1022",{"2":{"280":1}}],["10^308",{"2":{"280":1}}],["10",{"2":{"188":11,"283":1,"296":2,"297":1,"421":4,"429":3,"439":2,"440":2,"442":1,"548":6,"674":1,"860":4}}],["100ms",{"2":{"821":2}}],["100vh",{"2":{"595":2}}],["1001",{"2":{"296":5,"297":2,"298":1}}],["100",{"0":{"502":1},"2":{"188":11,"190":3,"191":2,"298":1,"345":1,"428":2,"429":1,"463":1,"666":6,"821":2}}],["100px",{"2":{"168":4,"188":4,"644":2,"647":2,"655":2,"718":4}}],["10000mbps",{"2":{"463":1}}],["100000000",{"2":{"294":2}}],["10000000",{"2":{"294":1}}],["10000",{"2":{"190":2,"191":2}}],["1000",{"2":{"86":2,"89":2,"92":2,"287":1,"463":1}}],["10+",{"2":{"62":1}}],["1",{"0":{"499":1,"510":2},"2":{"4":5,"8":4,"12":1,"24":1,"112":2,"114":1,"168":6,"179":1,"188":2,"190":8,"191":2,"208":4,"210":20,"221":1,"226":1,"243":1,"246":2,"253":2,"263":1,"268":2,"271":1,"280":1,"283":5,"284":1,"287":1,"288":5,"294":8,"296":6,"297":7,"298":5,"303":2,"326":2,"344":2,"345":1,"348":4,"421":4,"424":12,"428":6,"429":12,"440":4,"441":1,"443":1,"446":4,"459":1,"490":10,"494":1,"575":1,"579":1,"594":4,"618":2,"644":3,"646":9,"647":1,"648":2,"663":1,"664":5,"666":5,"668":10,"669":10,"671":2,"672":14,"674":1,"678":3,"679":3,"680":2,"681":8,"683":10,"713":2,"723":2,"742":2,"743":2,"761":3,"762":2,"766":1,"775":4,"776":4,"801":6,"802":6,"803":2,"806":2,"809":3,"810":2,"815":9,"835":2,"859":6,"860":4,"862":2,"864":2,"865":4,"866":2,"874":2,"877":2}}],["x2",{"2":{"671":4}}],["x1",{"2":{"671":6}}],["xml",{"2":{"514":1}}],["xhtml",{"2":{"618":2}}],["xhc20",{"2":{"428":2}}],["xhr",{"2":{"44":1}}],["xsrf",{"2":{"402":1}}],["xss",{"0":{"68":1},"1":{"69":1,"70":1,"71":1,"72":1},"2":{"72":1}}],["xx2",{"2":{"321":4}}],["xx3",{"2":{"317":1}}],["xx1",{"2":{"317":2,"321":6,"322":8}}],["xx",{"2":{"304":2,"870":1}}],["xxx",{"2":{"137":1,"143":2,"832":5}}],["xxxx",{"2":{"104":1,"106":4}}],["x^",{"2":{"298":1}}],["x86",{"2":{"283":1}}],["x",{"2":{"4":6,"158":4,"280":1,"345":1,"454":1,"586":1,"663":4,"701":1,"753":4,"844":2,"859":2,"861":4,"864":4,"866":10,"874":10}}],["均摊时间复杂度",{"2":{"2":1}}],["平均情况时间复杂度",{"2":{"2":1}}],["最接近的",{"2":{"806":2}}],["最理想的继承范式",{"2":{"762":1}}],["最权威的机构",{"2":{"567":1}}],["最高位必须为",{"2":{"445":1}}],["最终字节",{"2":{"815":1}}],["最终会导致dom渲染的结果不可预期",{"2":{"731":1}}],["最终可能不会被执行",{"2":{"509":1}}],["最终输出到屏幕上",{"2":{"368":1}}],["最终版",{"2":{"94":1}}],["最好不要在此修改",{"2":{"312":1}}],["最好情况时间复杂度",{"2":{"2":1}}],["最大网络数",{"2":{"440":1}}],["最大传输单元",{"2":{"433":1}}],["最大主机数",{"2":{"429":1}}],["最大内容绘制控制在",{"2":{"379":1}}],["最大内容绘制",{"2":{"379":1}}],["最大偏移高度",{"2":{"191":2}}],["最大单元格数",{"0":{"126":1}}],["最小的单个字符或字符串",{"2":{"172":1}}],["最初提供给mutationobserver构造函数",{"2":{"162":1,"757":1}}],["最后使用",{"2":{"353":1}}],["最后一位表示透明度",{"2":{"208":2}}],["最后一个元素替换删除元素",{"2":{"12":1}}],["最后再根据字节码来执行程序",{"2":{"170":1}}],["最后再生成处理器能够理解的机器码",{"2":{"170":1}}],["最后的二进制文件也不会生成成功",{"2":{"170":1}}],["最后在执行一次",{"2":{"95":1}}],["最后定时器再执行一次",{"2":{"81":1}}],["最坏情况时间复杂度",{"2":{"2":1}}],["乘法法则",{"2":{"1":1}}],["fbound",{"2":{"806":6}}],["ftobind",{"2":{"806":4}}],["ftp",{"2":{"471":1,"478":1,"482":1}}],["fe1a",{"2":{"428":4}}],["fe80",{"2":{"428":12}}],["f8",{"2":{"428":4}}],["fwddelay",{"2":{"428":2}}],["ff",{"2":{"422":12,"814":1}}],["friends",{"2":{"761":16}}],["franklin",{"2":{"666":2}}],["frames",{"0":{"624":1},"2":{"419":1}}],["from",{"0":{"840":1},"2":{"253":8,"262":2,"265":2,"306":4,"668":4,"672":2,"675":2,"680":2,"841":4,"843":2,"844":2,"847":2,"849":2,"857":4,"876":2}}],["fromcharcode",{"2":{"227":1}}],["fromarray",{"2":{"18":1}}],["fmp",{"0":{"386":1}}],["fcp",{"0":{"384":1}}],["fp",{"0":{"383":1}}],["flase",{"2":{"664":2}}],["flags",{"2":{"428":2,"433":1,"666":1}}],["flags=3",{"2":{"428":4}}],["flags=8943",{"2":{"428":2}}],["flags=8963",{"2":{"428":4}}],["flags=8843",{"2":{"428":2}}],["flags=8863",{"2":{"428":6}}],["flags=8051",{"2":{"428":4}}],["flags=8010",{"2":{"428":2}}],["flags=8049",{"2":{"428":2}}],["flags=0",{"2":{"428":4}}],["flex",{"0":{"588":1,"589":1,"594":2,"651":1},"1":{"589":1,"590":2,"591":2,"592":2,"593":2,"594":2,"595":2},"2":{"575":2,"589":2,"590":2,"591":2,"592":2,"593":2,"594":8,"595":4,"651":2}}],["float",{"0":{"596":1,"597":1,"598":1,"650":1},"1":{"597":1,"598":2,"599":2,"600":2,"601":1,"602":1,"603":1},"2":{"575":3,"576":1,"582":1,"599":2,"650":2}}],["flow",{"0":{"579":1},"2":{"326":4,"575":1}}],["floor",{"2":{"188":4,"190":2}}],["flushed",{"2":{"345":1}}],["flush",{"2":{"95":1,"98":6}}],["funding",{"2":{"832":1}}],["functon",{"2":{"869":1}}],["functions",{"0":{"861":1}}],["function",{"2":{"76":3,"79":3,"82":3,"86":3,"89":3,"92":3,"98":23,"106":2,"139":2,"144":2,"147":6,"167":2,"168":26,"188":2,"190":4,"191":6,"195":4,"208":4,"209":2,"210":4,"211":1,"217":2,"218":2,"219":2,"221":3,"268":5,"269":2,"270":2,"271":3,"301":4,"303":4,"304":9,"339":2,"419":4,"669":7,"672":2,"675":2,"684":2,"713":8,"715":4,"718":5,"737":6,"761":23,"762":24,"764":6,"775":1,"797":6,"801":4,"802":2,"806":18,"810":8,"821":2,"842":4,"843":2,"844":2,"854":6,"860":9,"861":3,"863":2,"866":7,"870":2}}],["func",{"2":{"98":4,"740":2,"866":2}}],["future",{"2":{"635":1}}],["fullscreen",{"2":{"635":1}}],["full",{"2":{"428":4}}],["fulltemplate",{"2":{"143":4}}],["fallback",{"2":{"677":2}}],["falsefunction",{"2":{"761":1}}],["false",{"2":{"77":2,"87":2,"96":4,"112":2,"114":1,"160":19,"218":3,"221":1,"230":1,"253":12,"269":2,"309":2,"419":4,"666":6,"668":1,"669":8,"712":1,"716":1,"723":2,"737":2,"755":19,"761":3,"857":6,"858":1,"866":2}}],["fast",{"2":{"433":2}}],["facepunch",{"2":{"345":1}}],["factory",{"2":{"301":4,"303":3}}],["favicon",{"0":{"145":1},"2":{"134":2}}],["found",{"0":{"520":1,"532":1}}],["four",{"2":{"345":1}}],["folder",{"2":{"253":2,"847":4}}],["footer",{"2":{"595":6}}],["footprints",{"2":{"345":1}}],["football",{"2":{"345":1}}],["foo",{"2":{"246":2,"664":2,"666":8,"667":6,"739":10,"741":2,"775":4,"776":6,"797":16,"801":7,"802":8,"809":10}}],["focusout",{"2":{"225":2}}],["focusoffset",{"2":{"114":2}}],["focusin",{"2":{"225":2}}],["focus",{"2":{"225":2,"635":3}}],["focusevent",{"2":{"223":2}}],["focusnode",{"2":{"114":3}}],["forwareref",{"2":{"877":2}}],["forwardref",{"2":{"877":3}}],["forward",{"2":{"231":1,"268":1}}],["forwards",{"2":{"167":1}}],["foreach",{"2":{"668":2}}],["forecolor",{"2":{"113":1}}],["forbidden",{"0":{"531":1}}],["forms",{"2":{"717":1}}],["form",{"2":{"402":2,"454":2}}],["formatting",{"2":{"574":1,"577":1}}],["format",{"2":{"253":4}}],["formatblock",{"2":{"113":2}}],["forgery",{"2":{"402":1}}],["fork",{"2":{"257":2}}],["force",{"2":{"253":2}}],["for",{"2":{"191":2,"253":4,"380":2,"667":5,"669":2,"837":1}}],["fontface",{"0":{"625":1}}],["font",{"0":{"649":1},"2":{"618":2,"630":2,"649":4}}],["fontsize",{"2":{"113":1}}],["fontname",{"2":{"113":1}}],["fs",{"2":{"104":1}}],["fnop",{"2":{"806":8}}],["fn",{"2":{"76":4,"77":2,"79":4,"82":6,"83":2,"86":6,"87":2,"89":4,"92":6,"93":2,"95":1,"96":2,"97":2,"98":4,"806":8,"810":6}}],["fish",{"2":{"863":4}}],["fields",{"2":{"832":1}}],["figcaption",{"0":{"695":1}}],["figure",{"0":{"695":1}}],["finally",{"2":{"669":2}}],["findmin",{"2":{"20":1}}],["find",{"2":{"12":1,"18":1,"20":1}}],["fi",{"2":{"511":1}}],["fixed",{"2":{"575":1}}],["fixes",{"2":{"253":2}}],["fix",{"2":{"253":10}}],["fixing",{"2":{"253":2}}],["firefox",{"2":{"212":1,"218":1,"226":1,"231":1,"311":1,"312":1,"347":1,"404":1,"674":1}}],["firefox4+",{"2":{"196":1}}],["firstchild",{"2":{"717":1}}],["firstelementchild",{"2":{"717":1}}],["first",{"2":{"56":1,"143":2,"383":1,"384":1,"386":1,"390":1,"633":2,"635":3,"859":2}}],["file=",{"2":{"262":2,"265":2}}],["fileeslint",{"2":{"253":1}}],["file",{"2":{"253":21,"262":4,"265":4}}],["files",{"2":{"239":2,"247":2,"253":8,"269":2,"832":3,"857":2}}],["filename",{"2":{"104":1,"134":2,"143":2,"147":2,"253":4,"424":1}}],["fill",{"2":{"167":1}}],["fid",{"0":{"390":1},"2":{"56":1}}],["f",{"2":{"0":2,"208":2,"253":2,"668":2,"669":30,"715":4,"762":6,"815":1}}],["====",{"2":{"548":2,"661":2}}],["===",{"0":{"721":1},"2":{"98":8,"168":4,"206":1,"208":3,"219":2,"232":2,"402":1,"444":1,"480":1,"550":1,"566":1,"667":2,"668":2,"761":6,"810":2,"832":1}}],["==",{"0":{"720":1},"2":{"4":1,"147":2,"210":2,"211":2,"303":1,"419":4,"669":2,"672":2,"723":2,"761":2,"806":2,"821":2,"877":4}}],["=",{"0":{"295":1,"723":1},"1":{"296":1,"297":1,"298":1,"299":1},"2":{"0":2,"4":1,"13":6,"19":14,"76":8,"79":12,"82":16,"86":8,"89":10,"92":24,"98":76,"102":6,"104":8,"106":4,"112":2,"114":8,"131":6,"132":3,"134":4,"139":2,"143":18,"144":6,"145":4,"146":2,"147":20,"149":2,"153":4,"155":6,"156":11,"157":10,"158":10,"159":14,"160":3,"168":26,"181":2,"188":20,"190":16,"191":28,"195":8,"200":8,"201":6,"202":4,"203":4,"208":28,"209":6,"210":20,"211":28,"217":4,"218":2,"219":2,"222":1,"223":4,"226":1,"227":3,"229":3,"230":3,"231":2,"232":2,"233":1,"234":2,"237":3,"250":1,"252":3,"271":7,"280":1,"287":3,"288":6,"289":3,"290":3,"294":4,"296":6,"297":7,"303":4,"304":4,"305":10,"309":3,"347":8,"380":2,"395":2,"396":2,"399":4,"400":2,"419":2,"429":3,"494":6,"580":1,"600":1,"664":6,"666":24,"667":4,"668":2,"669":20,"671":14,"672":22,"675":4,"693":1,"694":1,"698":1,"713":4,"715":36,"716":2,"717":18,"718":31,"723":8,"736":6,"739":6,"740":2,"741":2,"742":4,"743":2,"744":1,"748":4,"750":6,"751":11,"752":10,"753":10,"754":14,"755":3,"761":50,"762":30,"764":18,"766":1,"770":1,"775":2,"776":12,"794":1,"797":4,"801":6,"802":8,"803":4,"806":14,"809":8,"810":10,"815":1,"835":6,"837":4,"842":2,"843":2,"848":4,"849":2,"852":6,"854":4,"857":14,"859":19,"860":26,"861":6,"862":4,"863":1,"864":2,"865":4,"866":21,"870":6,"871":2,"874":4,"876":12,"877":16}}],["nbsp",{"2":{"717":2}}],["nbar",{"2":{"666":4}}],["nth",{"2":{"635":6}}],["nh",{"2":{"475":1}}],["npmignore",{"2":{"832":1}}],["npm",{"2":{"330":2,"832":1}}],["nginxlocation",{"2":{"269":1}}],["nginx",{"2":{"269":1}}],["nubmer",{"2":{"866":2,"874":2}}],["numeric",{"2":{"862":1,"865":1}}],["number",{"2":{"167":4,"188":2,"237":1,"253":4,"259":2,"268":1,"630":1,"718":2,"788":1,"837":3,"844":2,"859":11,"860":14,"861":12,"864":6,"865":1,"866":2,"872":1,"874":4}}],["nul",{"2":{"262":2,"265":2}}],["null除外",{"2":{"668":1}}],["null",{"2":{"19":4,"76":4,"79":8,"82":8,"86":4,"89":6,"92":10,"112":4,"113":18,"114":1,"147":2,"149":2,"156":19,"168":2,"664":2,"666":2,"718":2,"735":1,"736":2,"737":7,"738":1,"751":19,"769":1,"788":1,"808":2,"837":3,"838":1,"859":3,"865":1,"877":4}}],["nreturn",{"2":{"147":2}}],["nvar",{"2":{"147":2}}],["native",{"2":{"715":6}}],["nav",{"0":{"697":1}}],["navigator",{"0":{"199":1},"1":{"200":1,"201":1,"202":1,"203":1},"2":{"198":1,"200":4,"201":2,"202":1,"203":1}}],["navigationstart",{"2":{"43":1}}],["nan",{"2":{"664":2,"668":3}}],["namedmodule",{"2":{"854":4}}],["namednodemap",{"2":{"716":1}}],["nameitem",{"2":{"716":1}}],["namesapce",{"2":{"852":1}}],["namespaces",{"0":{"852":1,"853":1},"2":{"853":1}}],["namespace",{"0":{"618":1},"2":{"618":4,"844":2,"852":7,"853":1,"870":2,"874":7}}],["names",{"2":{"155":2,"750":2}}],["name=",{"2":{"131":2,"146":2,"147":4,"854":2}}],["name",{"2":{"112":2,"141":1,"143":4,"167":1,"345":3,"641":2,"701":3,"718":2,"761":54,"762":13,"764":8,"832":2}}],["nolib",{"2":{"854":1}}],["noresolve",{"2":{"851":1,"854":1}}],["noresolvetsc",{"2":{"851":1}}],["normalize",{"2":{"716":1}}],["normal",{"2":{"326":2,"630":1,"640":1}}],["noimplicitthis",{"2":{"838":1}}],["noinlineconfig",{"2":{"248":1}}],["noscript",{"0":{"677":1},"2":{"677":5}}],["nomodule",{"0":{"677":1},"2":{"677":3}}],["note",{"2":{"859":1}}],["noticetext",{"2":{"330":2}}],["notice",{"2":{"330":3}}],["not",{"0":{"522":1,"532":1,"533":1,"534":1,"540":1},"2":{"326":2,"635":1,"677":2,"682":2,"775":2,"797":2,"801":2,"806":2}}],["nonnullable",{"2":{"838":1}}],["non",{"0":{"510":1}}],["nonzero",{"2":{"253":2}}],["none",{"2":{"167":1,"168":15,"402":1,"522":1,"598":1,"603":1,"636":1,"640":1,"653":2}}],["no",{"0":{"511":1},"2":{"246":2,"253":10,"259":2,"326":2,"461":14,"640":2,"682":4,"761":5,"762":5,"764":2,"854":2}}],["nowrap",{"2":{"326":2}}],["now",{"2":{"82":12,"86":10,"92":10,"98":4,"399":2,"841":2}}],["nodes",{"2":{"160":1,"356":1,"755":1}}],["nodelist",{"2":{"156":11,"716":1,"751":11}}],["nodejs",{"0":{"147":1,"817":1},"1":{"818":1,"819":1,"820":1,"821":1,"822":1,"823":1,"824":1,"825":1,"826":1,"827":1,"828":1,"829":1,"830":1},"2":{"35":1,"99":1,"101":1,"147":1,"305":1,"868":1}}],["node",{"0":{"848":1},"2":{"19":2,"23":1,"106":2,"114":4,"168":50,"240":1,"715":6,"824":1,"832":2,"842":2,"843":4,"848":9,"849":24,"850":2,"857":4,"877":8}}],["never",{"2":{"859":2}}],["network",{"0":{"544":1},"2":{"475":1}}],["netmask",{"2":{"424":2,"428":4}}],["net",{"2":{"421":1,"433":1}}],["nexttickqueue",{"2":{"828":1}}],["nexttick",{"0":{"820":1,"828":1,"829":1,"830":1},"1":{"829":1,"830":1},"2":{"820":4,"826":1,"828":1,"829":1}}],["nextelementsibling",{"2":{"717":1}}],["nextsibling",{"2":{"156":5,"717":1,"751":5}}],["nextnode",{"2":{"19":8}}],["next",{"2":{"16":1,"19":4,"246":4,"424":2,"669":16}}],["newoption",{"2":{"718":1}}],["newbase",{"2":{"256":4,"257":1}}],["newurl",{"2":{"232":1}}],["newsource",{"2":{"147":6}}],["new",{"0":{"804":1},"2":{"13":2,"102":2,"104":2,"106":4,"134":2,"139":12,"143":2,"153":2,"155":2,"156":2,"157":2,"158":2,"159":2,"160":2,"200":4,"380":1,"399":2,"668":2,"669":5,"670":1,"671":10,"748":2,"750":2,"751":2,"752":2,"753":2,"754":2,"755":2,"761":16,"762":8,"764":1,"804":3,"805":2,"806":5,"852":2,"866":8}}],["n",{"2":{"0":6,"147":32,"259":2,"265":2,"666":1,"736":4,"815":20}}],["tuple",{"2":{"859":1}}],["turbofan",{"2":{"174":2}}],["tsexport",{"2":{"870":1}}],["tsfunction",{"2":{"866":3}}],["tstype",{"2":{"862":2}}],["tsinterface",{"2":{"860":3,"866":1}}],["tsimport",{"2":{"840":1,"871":1}}],["tslet",{"2":{"859":3,"861":1}}],["tsnamespace",{"2":{"852":1}}],["tsclass",{"2":{"864":1,"874":2}}],["tsc",{"2":{"851":2,"858":9}}],["tsconfig",{"0":{"856":1},"1":{"857":1,"858":1},"2":{"846":1,"850":2,"857":6,"858":2,"870":2}}],["tsx",{"2":{"849":8}}],["ts",{"0":{"870":1,"872":1},"2":{"841":1,"842":1,"843":6,"844":3,"847":11,"849":21,"850":10,"852":6,"854":5,"857":4,"858":4,"859":2,"860":2,"863":1,"865":1,"866":2,"869":4,"870":4,"871":2,"872":1}}],["tso6",{"2":{"428":6}}],["tso4",{"2":{"428":6}}],["twice",{"2":{"666":18}}],["two",{"2":{"666":2,"859":2}}],["tc",{"2":{"646":32}}],["tcp",{"0":{"478":1},"1":{"479":1,"480":1,"481":1,"482":1,"483":1},"2":{"427":1,"433":1,"447":1,"459":1,"466":1,"474":1,"478":2,"481":4,"483":2,"488":1,"552":1,"819":1,"822":1}}],["tb",{"2":{"580":1}}],["tbt",{"0":{"389":1},"2":{"56":1}}],["tls",{"2":{"459":1,"552":1}}],["txstatus",{"2":{"428":2}}],["txcsum",{"2":{"428":4}}],["txtsrc",{"2":{"850":1}}],["txtday1",{"2":{"850":1}}],["txtip",{"2":{"548":1}}],["txthttp",{"2":{"490":1}}],["txtget",{"2":{"490":1}}],["txtalign",{"2":{"326":1}}],["txtls",{"2":{"318":1}}],["txt",{"2":{"294":1,"318":11,"322":12}}],["txtthe",{"2":{"326":1}}],["txtt",{"2":{"0":1}}],["tftp",{"2":{"425":3}}],["typeacquisition",{"2":{"857":4}}],["typeroots",{"2":{"857":2}}],["typeerror",{"2":{"769":1,"801":2,"806":2}}],["typedarray",{"2":{"671":1}}],["typeof",{"2":{"663":1,"718":2,"761":2,"806":2,"837":1,"842":1}}],["type=image",{"2":{"638":1}}],["type=",{"0":{"673":1},"1":{"674":1,"675":1,"676":1,"677":1,"678":1,"679":1,"680":1,"681":1,"682":1,"683":1,"684":1},"2":{"608":1,"675":2,"677":2,"678":2,"679":2,"680":4,"681":6,"682":6,"683":8,"684":2,"717":2}}],["types=",{"2":{"854":2,"871":2}}],["typescriptlang",{"2":{"843":2}}],["typescript",{"0":{"836":1,"849":1,"855":1,"867":1},"1":{"837":1,"838":1,"839":1,"840":1,"841":1,"842":1,"843":1,"844":1,"845":1,"846":1,"847":1,"848":1,"849":1,"850":1,"851":1,"852":1,"853":1,"854":1,"856":1,"857":1,"858":1,"859":1,"860":1,"861":1,"862":1,"863":1,"864":1,"865":1,"866":1,"868":1,"869":1,"870":1,"871":1,"872":1,"873":1,"874":1},"2":{"238":1,"841":1,"859":1,"867":1}}],["types",{"0":{"838":1,"841":1,"862":1,"863":1},"2":{"198":1,"253":2,"837":3,"849":7,"857":4,"860":4,"861":1,"863":1,"876":2}}],["type",{"0":{"205":1,"537":1,"684":1,"837":1,"859":1},"2":{"156":5,"195":2,"198":1,"200":2,"205":1,"206":2,"221":1,"222":1,"253":2,"380":2,"428":2,"482":1,"635":5,"701":1,"715":16,"751":5,"832":2,"837":5,"838":21,"841":3,"854":1,"857":2,"859":1,"862":2,"874":4}}],["table",{"2":{"575":2,"628":1}}],["tab",{"2":{"350":1,"354":2,"726":1,"729":1,"814":1}}],["tada",{"2":{"345":1}}],["takerecords",{"0":{"163":1,"758":1}}],["targetorigin",{"2":{"419":3}}],["target",{"2":{"156":5,"158":2,"221":2,"230":1,"635":2,"670":1,"716":2,"718":2,"751":5,"753":2,"857":4}}],["tapable",{"2":{"139":3}}],["tapasync",{"2":{"131":2,"138":1,"139":1,"143":2,"145":2}}],["tap",{"2":{"106":2,"137":2}}],["telnet",{"2":{"471":1}}],["temporary",{"0":{"525":1}}],["temporarily",{"0":{"520":1}}],["temp",{"2":{"252":1,"718":12}}],["template1",{"2":{"850":4}}],["templates",{"2":{"304":2,"850":4}}],["templatepath",{"2":{"304":2}}],["templateparams",{"2":{"147":6}}],["template绝对地址为",{"2":{"143":2}}],["template",{"2":{"134":2,"143":2,"147":4}}],["textcontent",{"2":{"675":2,"717":1}}],["textinput输入实际字符的键时会触发",{"2":{"227":1}}],["textinput",{"2":{"227":2}}],["text=",{"2":{"195":2}}],["text",{"2":{"160":1,"195":4,"200":8,"201":4,"205":1,"206":1,"608":1,"675":4,"701":1,"718":8,"755":1}}],["textnode",{"2":{"151":1,"746":1}}],["textarea",{"2":{"111":1,"195":2}}],["tester",{"2":{"352":1}}],["testing",{"2":{"351":1}}],["tests",{"2":{"250":1}}],["test",{"2":{"144":2,"250":1,"419":12,"666":20,"852":2,"857":6}}],["tick",{"2":{"829":1}}],["tirm",{"2":{"494":2}}],["tiling",{"0":{"363":1}}],["tips",{"2":{"364":1}}],["tip",{"2":{"343":2,"378":1}}],["tip带符号位的机器数对应的真正数值称为机器数的真值带符号位的机器数对应的真正数值称为机器数的真值",{"2":{"291":1}}],["timing",{"2":{"167":2,"380":1}}],["timestamp",{"2":{"428":2}}],["timesincelastinvoke",{"2":{"98":10}}],["timesincelastcall",{"2":{"98":12}}],["timewating",{"2":{"98":6}}],["timers",{"0":{"821":1},"2":{"820":1}}],["timer",{"2":{"98":4,"819":1}}],["timerexpired",{"2":{"98":10}}],["timerid2",{"2":{"92":12}}],["timerid",{"2":{"76":8,"79":14,"82":12,"89":12,"92":8,"98":16}}],["timeout",{"0":{"536":1,"543":1},"2":{"89":2,"92":2,"428":2}}],["time",{"0":{"694":1},"2":{"56":3,"98":48,"388":1,"389":1,"424":6,"694":4}}],["title=",{"2":{"689":2}}],["title",{"0":{"146":1},"1":{"147":1},"2":{"131":4,"134":10,"146":6,"147":12}}],["tight",{"2":{"98":2}}],["thunk",{"2":{"669":1}}],["that",{"2":{"666":2}}],["thawte",{"2":{"568":1}}],["than",{"2":{"326":2}}],["th",{"2":{"474":1}}],["throw",{"2":{"669":3,"806":2}}],["throttle",{"0":{"97":1},"2":{"86":2,"87":2,"89":2,"92":2,"93":2,"94":1,"97":2}}],["thrread",{"2":{"359":1}}],["thread",{"2":{"349":2,"353":2,"367":1}}],["those",{"2":{"253":2}}],["them",{"2":{"666":2}}],["the",{"2":{"184":1,"253":18,"326":23,"666":2,"861":1}}],["then",{"2":{"145":2,"200":2,"201":2,"202":2,"203":2,"762":2}}],["thistype",{"2":{"838":1}}],["thisparametertype",{"2":{"838":1}}],["thiscompilation",{"0":{"137":1},"2":{"132":2,"137":2,"143":2}}],["this",{"0":{"796":1,"798":1,"808":1},"1":{"797":1,"798":1,"799":2,"800":2,"801":2,"802":2,"803":2,"804":2,"805":2,"806":2,"807":2,"808":2,"809":2,"810":2,"811":2},"2":{"13":4,"98":2,"219":2,"221":1,"222":1,"253":4,"669":14,"670":2,"682":2,"761":33,"762":12,"764":10,"794":1,"796":4,"797":9,"799":1,"800":1,"801":6,"802":4,"803":4,"804":1,"806":18,"808":1,"810":9,"811":1,"838":4,"850":4,"861":4,"864":1,"876":4,"877":12}}],["tti",{"0":{"388":1},"2":{"56":1}}],["ttsr",{"2":{"56":1}}],["toggle",{"2":{"717":1}}],["tools",{"2":{"421":1}}],["toc",{"2":{"340":2}}],["toutcstring",{"2":{"399":3}}],["tourl",{"2":{"304":3}}],["touchcancel",{"2":{"234":1}}],["touchend",{"2":{"234":2}}],["touchmove",{"2":{"234":1}}],["touchstart",{"2":{"234":2}}],["tofixed",{"2":{"299":1}}],["todo",{"2":{"256":2}}],["toprecision",{"2":{"299":1}}],["top",{"0":{"188":1,"600":1},"2":{"188":16,"255":1,"326":1,"583":3,"586":2,"590":2,"594":2,"595":2,"600":3,"718":8}}],["token",{"2":{"172":2,"356":1,"766":1}}],["tokenize",{"2":{"172":1}}],["total",{"2":{"56":1,"389":1}}],["to",{"2":{"56":2,"208":3,"209":3,"253":24,"388":1,"806":2,"850":2,"876":1}}],["tostring",{"2":{"18":1,"20":2,"98":2,"114":1,"208":6,"209":6,"271":1}}],["toarray",{"2":{"18":1}}],["trying",{"2":{"806":2}}],["try",{"2":{"269":2,"669":2}}],["triple",{"0":{"854":1}}],["triangle",{"2":{"852":2}}],["trim",{"2":{"586":1}}],["trident",{"2":{"347":2}}],["trigger",{"2":{"253":2}}],["trie",{"2":{"14":1}}],["trusted",{"2":{"221":1}}],["truefunction",{"2":{"761":1}}],["truevar",{"2":{"723":1}}],["trueconst",{"2":{"666":1}}],["true",{"2":{"77":2,"83":4,"87":2,"93":4,"95":1,"97":4,"98":4,"134":2,"147":2,"155":2,"156":2,"157":2,"158":4,"159":4,"160":1,"168":2,"218":1,"219":2,"221":3,"231":1,"242":2,"250":1,"380":2,"408":1,"666":17,"667":2,"668":1,"669":7,"712":1,"713":4,"716":1,"723":3,"737":2,"750":2,"751":2,"752":2,"753":4,"754":4,"755":1,"761":1,"762":2,"854":2,"857":2,"858":1,"860":2,"866":4,"870":2,"871":1}}],["traversal",{"2":{"717":1}}],["traverseinorder",{"2":{"20":1}}],["traceresolution",{"2":{"851":2}}],["trace",{"0":{"457":1},"2":{"461":1}}],["transimission",{"2":{"572":1}}],["transitionend",{"2":{"168":15}}],["transitionstart",{"2":{"168":4}}],["transition",{"2":{"167":6,"168":2}}],["transmission",{"2":{"478":1}}],["transport",{"2":{"474":1,"571":2}}],["transferable",{"2":{"419":1}}],["transfer",{"2":{"419":3,"450":1}}],["transfom",{"2":{"168":2}}],["transform",{"0":{"188":1},"2":{"168":2,"359":1}}],["trailingedge",{"2":{"98":4}}],["trailing",{"2":{"77":2,"83":2,"87":2,"93":2,"95":1,"96":2,"97":2,"98":16}}],["trees",{"2":{"359":1}}],["tree",{"0":{"373":1},"2":{"6":1,"50":1,"65":1,"262":6,"265":6,"356":2,"357":2}}],["t",{"2":{"0":2,"147":6,"210":20,"815":1,"866":62}}],["omitthisparameter",{"2":{"838":1}}],["omit",{"2":{"838":1}}],["othis",{"2":{"806":6}}],["otherwindow",{"2":{"419":2}}],["other",{"0":{"521":1},"2":{"326":2,"683":4}}],["o2",{"2":{"776":8}}],["o1",{"2":{"776":6}}],["ov",{"2":{"568":2}}],["overloads",{"2":{"861":1,"872":1}}],["overriding",{"2":{"253":2}}],["overrides",{"0":{"247":1},"2":{"239":5,"247":2}}],["overscancount",{"2":{"188":4,"190":6,"191":6}}],["overflow",{"2":{"188":2,"326":10,"575":1,"586":3}}],["ok",{"0":{"507":1},"2":{"844":2,"859":4,"874":6}}],["oy4nraq13jhfonc7bp8dtkb4ptu=",{"2":{"490":1}}],["oy4nraq13jhfonc7bp8dtkb4ptu=http",{"2":{"490":1}}],["osi",{"0":{"470":1},"1":{"471":1,"472":1,"473":1,"474":1,"475":1,"476":1,"477":1},"2":{"464":1,"470":1}}],["ospf",{"2":{"427":1}}],["occurred",{"2":{"328":2}}],["of",{"2":{"253":14,"326":8,"380":2,"635":6,"666":4,"669":2}}],["offer",{"2":{"324":1,"422":2}}],["off",{"2":{"243":1,"244":2,"245":2}}],["offstart",{"2":{"190":4}}],["offsettop",{"2":{"718":1}}],["offsetleft",{"2":{"718":1}}],["offsetwidth",{"2":{"718":1}}],["offsetheight",{"2":{"168":1,"718":1}}],["offset",{"2":{"114":2,"188":6,"190":10,"191":24,"424":2,"718":16}}],["opiton",{"2":{"638":1}}],["optional",{"0":{"842":1},"2":{"461":5,"635":1,"860":1,"861":1}}],["options=201",{"2":{"428":14}}],["options",{"0":{"458":1},"2":{"95":2,"98":14,"134":2,"146":2,"147":4,"253":8,"256":4,"262":6,"461":1,"718":1}}],["open",{"2":{"419":3,"470":1,"640":2}}],["opera",{"2":{"212":1,"218":1,"225":2,"231":1,"347":1,"656":1}}],["opera45+",{"2":{"196":1}}],["opacity",{"2":{"168":6}}],["objb",{"2":{"809":4}}],["obja",{"2":{"809":4}}],["obj",{"2":{"669":10,"739":10,"740":4,"741":4,"742":4,"763":1,"776":4,"802":4,"803":6,"806":2,"810":4,"866":4}}],["object创建了一个childcompiler",{"2":{"140":1}}],["object",{"2":{"72":1,"98":6,"141":1,"143":4,"253":4,"356":1,"638":1,"667":1,"668":2,"669":12,"712":1,"715":10,"761":6,"762":12,"763":3,"788":1,"810":2,"859":1,"876":2}}],["observe",{"0":{"155":1,"160":1,"750":1,"755":1},"2":{"155":2,"156":2,"157":2,"158":4,"159":4,"380":2,"750":2,"751":2,"752":2,"753":4,"754":4}}],["observer",{"2":{"153":2,"155":4,"156":4,"157":8,"158":8,"159":8,"160":2,"748":2,"750":4,"751":4,"752":8,"753":8,"754":8,"755":2}}],["ouputoptions",{"2":{"141":1}}],["outdir",{"2":{"857":2}}],["outdent",{"2":{"113":1}}],["outfile",{"2":{"853":1,"854":1,"857":2}}],["outertext",{"2":{"717":1}}],["outerhtml",{"2":{"717":1}}],["out",{"2":{"167":2,"635":1,"854":1,"862":4}}],["outputoptions",{"2":{"143":2}}],["output",{"2":{"106":1,"139":1,"253":12,"736":4,"835":2}}],["output=",{"2":{"104":1}}],["oldurl",{"2":{"232":1}}],["oldvalue",{"2":{"156":5,"751":5}}],["ol",{"0":{"697":1},"2":{"113":1}}],["one",{"2":{"666":2}}],["onerror",{"2":{"44":1}}],["onload",{"2":{"387":1,"842":2}}],["only",{"0":{"840":1},"2":{"253":4,"394":1,"635":3}}],["onto",{"2":{"256":4,"257":3}}],["onhashchange",{"2":{"232":2}}],["on",{"2":{"219":2,"253":4,"666":2,"819":1}}],["once",{"2":{"712":1,"713":2}}],["onclick=",{"2":{"216":2}}],["onclick",{"2":{"195":4,"217":2,"219":2}}],["onclose",{"2":{"106":4}}],["onchange",{"2":{"149":2}}],["onconnection",{"2":{"106":2}}],["onmessage",{"2":{"106":4}}],["onopen",{"2":{"106":2}}],["org",{"2":{"618":4,"843":2}}],["original",{"2":{"762":4}}],["origin",{"0":{"407":1,"415":1},"2":{"380":1,"405":1,"416":1,"419":6,"490":2,"683":4}}],["orientation",{"2":{"233":1}}],["orientationchange",{"2":{"233":1}}],["orangered",{"2":{"168":2,"876":6}}],["orange",{"2":{"114":2,"644":2,"647":2}}],["or",{"2":{"4":1,"109":2,"208":1,"243":3,"253":4,"263":2,"326":2,"737":2,"796":1,"832":5,"866":4,"870":2,"876":2,"877":4}}],["o",{"0":{"0":1,"819":1},"1":{"1":1,"2":1},"2":{"0":2,"198":1,"253":2,"666":6,"736":4,"761":24,"762":4,"802":6,"819":4,"822":1,"824":3,"826":1,"827":1,"828":1}}],["大端字节序",{"2":{"671":1}}],["大于0xffff的unicode字符码",{"2":{"666":1}}],["大学所学的知识让我充满了迷茫与惆怅",{"2":{"324":1}}],["大数据",{"0":{"125":1}}],["大型项目痛点",{"0":{"62":1},"1":{"63":1,"64":1,"65":1,"66":1}}],["大任务拆解",{"2":{"53":1}}],["大小",{"2":{"13":1,"586":1}}],["大顶堆",{"2":{"12":1}}],["大o表示的并不是程序执行的时间",{"2":{"1":1}}],["大",{"0":{"0":1},"1":{"1":1,"2":1}}]],"serializationVersion":2}';export{t as default};
diff --git a/assets/chunks/@localSearchIndexroot.a8619f7e.js b/assets/chunks/@localSearchIndexroot.a8619f7e.js
new file mode 100644
index 0000000..bea8adb
--- /dev/null
+++ b/assets/chunks/@localSearchIndexroot.a8619f7e.js
@@ -0,0 +1 @@
+const t='{"documentCount":879,"nextId":879,"documentIds":{"0":"/alogrithm/basic/O.html#大-o-表示法","1":"/alogrithm/basic/O.html#时间复杂度","2":"/alogrithm/basic/O.html#空间复杂度","3":"/alogrithm/basic/bit.html#位运算","4":"/alogrithm/basic/bit.html#常用的位运算操作","5":"/alogrithm/basic/bit.html#复杂的位运算操作","6":"/alogrithm/basic/red_black_tree.html#红黑树","7":"/alogrithm/basic/red_black_tree.html#特点","8":"/alogrithm/basic/red_black_tree.html#实现","9":"/alogrithm/#开启之路","10":"/alogrithm/interview/self.html#数据结构辅助记忆","11":"/alogrithm/interview/self.html#常见的数据结构","12":"/alogrithm/interview/self.html#堆","13":"/alogrithm/interview/self.html#hash-表","14":"/alogrithm/interview/self.html#字典树","15":"/alogrithm/interview/self.html#图","16":"/alogrithm/interview/self.html#探测环","17":"/alogrithm/interview/self.html#disjoin-set","18":"/alogrithm/interview/self.html#链表","19":"/alogrithm/interview/self.html#链表倒转","20":"/alogrithm/interview/self.html#树","21":"/alogrithm/interview/self.html#注意点","22":"/architecture/#架构","23":"/architecture/standard/A-YZ.html#a-yz","24":"/architecture/standard/A-YZ.html#ui-自动化","25":"/architecture/standard/A-YZ.html#接口测试","26":"/architecture/standard/A-YZ.html#单元测试","27":"/architecture/standard/A-YZ.html#基础库变更报警","28":"/architecture/standard/A-YZ.html#sentry-报警","29":"/architecture/standard/A-YZ.html#业务报警","30":"/architecture/standard/A-YZ.html#约定规范","31":"/architecture/standard/comp-mod.html#组件化与模块化设计","32":"/architecture/standard/comp-mod.html#模块化设计","33":"/architecture/standard/comp-mod.html#应用的模块与层级划分","34":"/architecture/standard/comp-mod.html#模块划分与设计原则","35":"/architecture/standard/comp-mod.html#如何进行模块间依赖的解耦","36":"/architecture/standard/comp-mod.html#组件化设计","37":"/architecture/standard/comp-mod.html#组件划分","38":"/architecture/standard/comp-mod.html#组件封装","39":"/architecture/standard/monitor.html#前端监控体系","40":"/architecture/standard/monitor.html#为什么","41":"/architecture/standard/monitor.html#监控内容","42":"/architecture/standard/monitor.html#数据埋点与收集","43":"/architecture/standard/monitor.html#系统生命周期","44":"/architecture/standard/monitor.html#系统异常","45":"/architecture/standard/monitor.html#用户日志","46":"/architecture/standard/monitor.html#数据上报","47":"/architecture/standard/monitor.html#数据监控","48":"/architecture/standard/performance.html#前端性能优化","49":"/architecture/standard/performance.html#时间角度","50":"/architecture/standard/performance.html#网络请求优化","51":"/architecture/standard/performance.html#首屏加载优化","52":"/architecture/standard/performance.html#渲染过程优化","53":"/architecture/standard/performance.html#计算-逻辑提速","54":"/architecture/standard/performance.html#空间角度","55":"/architecture/standard/performance.html#降低资源占用","56":"/architecture/standard/performance.html#性能数据","57":"/architecture/standard/project-design.html#项目设计","58":"/architecture/standard/project-design.html#技术方案设计与选型","59":"/architecture/standard/project-design.html#技术选型的影响因素","60":"/architecture/standard/project-design.html#多人协作与团队规范","61":"/architecture/standard/project-design.html#前端工程化","62":"/architecture/standard/project-design.html#大型项目痛点","63":"/architecture/standard/project-design.html#模块耦合严重","64":"/architecture/standard/project-design.html#项目复杂熟悉成本过高","65":"/architecture/standard/project-design.html#项目代码量过大","66":"/architecture/standard/project-design.html#问题定位效率低","67":"/architecture/standard/project-design.html#项目前期准备与复盘","68":"/architecture/websecure/xss.html#xss","69":"/architecture/websecure/xss.html#类型","70":"/architecture/websecure/xss.html#反射型","71":"/architecture/websecure/xss.html#存储型","72":"/architecture/websecure/xss.html#dom-跨站","73":"/articles/advanced/debounce.html#防抖节流","74":"/articles/advanced/debounce.html#防抖","75":"/articles/advanced/debounce.html#正常防抖","76":"/articles/advanced/debounce.html#代码实现","77":"/articles/advanced/debounce.html#lodash-类似实现用法","78":"/articles/advanced/debounce.html#立即执行防抖函数i","79":"/articles/advanced/debounce.html#代码执行","80":"/articles/advanced/debounce.html#lodash-类似实现用法-1","81":"/articles/advanced/debounce.html#立即执行防抖函数ii","82":"/articles/advanced/debounce.html#代码实现-1","83":"/articles/advanced/debounce.html#lodash-类似实现用法-2","84":"/articles/advanced/debounce.html#节流","85":"/articles/advanced/debounce.html#节流非定时器版","86":"/articles/advanced/debounce.html#代码实现-2","87":"/articles/advanced/debounce.html#lodash-类似实现用法-3","88":"/articles/advanced/debounce.html#节流定时器版","89":"/articles/advanced/debounce.html#代码实现-3","90":"/articles/advanced/debounce.html#lodash-类似实现用法-4","91":"/articles/advanced/debounce.html#节流最终执行","92":"/articles/advanced/debounce.html#代码实现-4","93":"/articles/advanced/debounce.html#lodash-类似实现用法-5","94":"/articles/advanced/debounce.html#lodash-实现","95":"/articles/advanced/debounce.html#lodash-的参数","96":"/articles/advanced/debounce.html#lodash-debounce-默认调用","97":"/articles/advanced/debounce.html#lodash-throttle-默认调用","98":"/articles/advanced/debounce.html#源码实现","99":"/articles/advanced/devServer.html#实现一个简易热更新","100":"/articles/advanced/devServer.html#实现思考","101":"/articles/advanced/devServer.html#思考一","102":"/articles/advanced/devServer.html#解答","103":"/articles/advanced/devServer.html#思考二","104":"/articles/advanced/devServer.html#解答-1","105":"/articles/advanced/devServer.html#思考三","106":"/articles/advanced/devServer.html#解答-2","107":"/articles/advanced/devServer.html#环境准备","108":"/articles/advanced/devServer.html#目录搭建","109":"/articles/advanced/devServer.html#项目启动","110":"/articles/advanced/docs.html#前端文档","111":"/articles/advanced/docs.html#前端文档浅思考","112":"/articles/advanced/docs.html#富文本编辑","113":"/articles/advanced/docs.html#操作富文本","114":"/articles/advanced/docs.html#富文本选区","115":"/articles/advanced/docs.html#操作范围-dom2","116":"/articles/advanced/docs.html#复合事件","117":"/articles/advanced/docs.html#前端文档深思考","118":"/articles/advanced/docs.html#同构表vs异构表","119":"/articles/advanced/docs.html#文档技术","120":"/articles/advanced/docs.html#在线协同","121":"/articles/advanced/docs.html#前端文档应用","122":"/articles/advanced/docs.html#钉钉","123":"/articles/advanced/docs.html#语雀","124":"/articles/advanced/docs.html#前端文档性能","125":"/articles/advanced/docs.html#大数据","126":"/articles/advanced/docs.html#最大单元格数","127":"/articles/advanced/docs.html#前端文档展望","128":"/articles/advanced/docs.html#复杂度","129":"/articles/advanced/docs.html#未来","130":"/articles/advanced/htmlWebpackPlugin.html#htmlwepbackplugin-源码分析","131":"/articles/advanced/htmlWebpackPlugin.html#简易的写一个-hwp-插件","132":"/articles/advanced/htmlWebpackPlugin.html#简易实现问题","133":"/articles/advanced/htmlWebpackPlugin.html#hwp-源码实现","134":"/articles/advanced/htmlWebpackPlugin.html#webpack-配置","135":"/articles/advanced/htmlWebpackPlugin.html#写一个-webpack-插件","136":"/articles/advanced/htmlWebpackPlugin.html#使用到的-webpack-compiler","137":"/articles/advanced/htmlWebpackPlugin.html#compiler-hooks-thiscompilation","138":"/articles/advanced/htmlWebpackPlugin.html#compiler-hooks-make","139":"/articles/advanced/htmlWebpackPlugin.html#compiler-hooks-emit","140":"/articles/advanced/htmlWebpackPlugin.html#hwp-创建一个子解析器-childcompiler","141":"/articles/advanced/htmlWebpackPlugin.html#createchildcompiler","142":"/articles/advanced/htmlWebpackPlugin.html#动手实现一个-hwp-插件","143":"/articles/advanced/htmlWebpackPlugin.html#创建-childcompiler","144":"/articles/advanced/htmlWebpackPlugin.html#index-html-解析器-loader","145":"/articles/advanced/htmlWebpackPlugin.html#开始注入-js-css-favicon-文件","146":"/articles/advanced/htmlWebpackPlugin.html#title-如何注入到-index-html-中","147":"/articles/advanced/htmlWebpackPlugin.html#nodejs-vm-模块","148":"/articles/advanced/knowledge.js.html#你不知道的-js","149":"/articles/advanced/knowledge.js.html#matchmedia","150":"/articles/advanced/mutationObserver.html#mutationobserver","151":"/articles/advanced/mutationObserver.html#概念","152":"/articles/advanced/mutationObserver.html#兼容性","153":"/articles/advanced/mutationObserver.html#用法","154":"/articles/advanced/mutationObserver.html#api","155":"/articles/advanced/mutationObserver.html#observe-方法","156":"/articles/advanced/mutationObserver.html#callback-mutation-records-回调参数属性分析","157":"/articles/advanced/mutationObserver.html#disconnect-关闭连接","158":"/articles/advanced/mutationObserver.html#multi-mutaintionobserver-多监听改变","159":"/articles/advanced/mutationObserver.html#重新使用-mutationobserver-实例","160":"/articles/advanced/mutationObserver.html#observe-方法第二个参数对象有哪些属性","161":"/articles/advanced/mutationObserver.html#mutationobserver-设计规范","162":"/articles/advanced/mutationObserver.html#异步回调和记录队列","163":"/articles/advanced/mutationObserver.html#takerecords-方法","164":"/articles/advanced/mutationObserver.html#性能分析","165":"/articles/advanced/transitionAnimation.html#cssjs-动画那些事","166":"/articles/advanced/transitionAnimation.html#回流与重绘","167":"/articles/advanced/transitionAnimation.html#css-动画","168":"/articles/advanced/transitionAnimation.html#js-动画","169":"/articles/advanced/v8-code.html#v8","170":"/articles/advanced/v8-code.html#解释器和执行器","171":"/articles/advanced/v8-code.html#v8-执行代码","172":"/articles/advanced/v8-code.html#生成抽象语法树和执行上下文","173":"/articles/advanced/v8-code.html#生成字节码","174":"/articles/advanced/v8-code.html#执行代码","175":"/articles/advanced/v8-code.html#垃圾回收","176":"/articles/advanced/v8-code.html#栈空间","177":"/articles/advanced/v8-code.html#堆空间","178":"/articles/advanced/v8-code.html#堆空间的垃圾回收","179":"/articles/advanced/v8-code.html#新生代","180":"/articles/advanced/v8-code.html#老生代","181":"/articles/advanced/v8-code.html#垃圾回收流程","182":"/articles/advanced/v8-code.html#副垃圾回收器","183":"/articles/advanced/v8-code.html#主垃圾回收器","184":"/articles/advanced/v8-code.html#全停顿","185":"/articles/advanced/v8-code.html#增量标记","186":"/articles/advanced/virtualList.html#pc虚拟列表如何处理","187":"/articles/advanced/virtualList.html#常见解决方案","188":"/articles/advanced/virtualList.html#iscroll-方案-使用-transform-或者-top","189":"/articles/advanced/virtualList.html#react-window-解决方案","190":"/articles/advanced/virtualList.html#高度固定","191":"/articles/advanced/virtualList.html#高度改变","192":"/articles/advanced/virtualList.html#写在最后","193":"/articles/basic/clipboard.html#js-如何实现复制","194":"/articles/basic/clipboard.html#document-execcommand","195":"/articles/basic/clipboard.html#实现","196":"/articles/basic/clipboard.html#clipboard-api","197":"/articles/basic/clipboard.html#clipboardevent","198":"/articles/basic/clipboard.html#clipboarditem","199":"/articles/basic/clipboard.html#navigator-clipboard","200":"/articles/basic/clipboard.html#write","201":"/articles/basic/clipboard.html#writetext","202":"/articles/basic/clipboard.html#read","203":"/articles/basic/clipboard.html#readtext","204":"/articles/basic/clipboard.html#扩展","205":"/articles/basic/clipboard.html#mime-type","206":"/articles/basic/clipboard.html#blob","207":"/articles/basic/color_convert.html#颜色值变换","208":"/articles/basic/color_convert.html#十六进制转换成-rgb","209":"/articles/basic/color_convert.html#rgb-转换成十六进制","210":"/articles/basic/color_convert.html#hsl-转换成-rgb","211":"/articles/basic/color_convert.html#rgb-转换成-hsl","212":"/articles/basic/dom_events.html#dom-bom-事件流","213":"/articles/basic/dom_events.html#事件冒泡","214":"/articles/basic/dom_events.html#事件捕获","215":"/articles/basic/dom_events.html#事件处理程序","216":"/articles/basic/dom_events.html#html-事件处理程序","217":"/articles/basic/dom_events.html#dom0-级事件处理程序","218":"/articles/basic/dom_events.html#dom2-级事件处理程序","219":"/articles/basic/dom_events.html#ie-事件处理程序","220":"/articles/basic/dom_events.html#事件对象","221":"/articles/basic/dom_events.html#dom-事件对象","222":"/articles/basic/dom_events.html#ie-事件对象","223":"/articles/basic/dom_events.html#事件对象-1","224":"/articles/basic/dom_events.html#ui事件","225":"/articles/basic/dom_events.html#焦点事件","226":"/articles/basic/dom_events.html#鼠标与滚轮事件","227":"/articles/basic/dom_events.html#键盘与文本事件","228":"/articles/basic/dom_events.html#复合事件","229":"/articles/basic/dom_events.html#变动事件","230":"/articles/basic/dom_events.html#html5事件","231":"/articles/basic/dom_events.html#pageshow-和-pagehide-事件","232":"/articles/basic/dom_events.html#hashchange","233":"/articles/basic/dom_events.html#设备事件","234":"/articles/basic/dom_events.html#触摸与手势事件","235":"/articles/basic/eslint.html#eslint","236":"/articles/basic/eslint.html#配置","237":"/articles/basic/eslint.html#指定解析选项","238":"/articles/basic/eslint.html#指定解析","239":"/articles/basic/eslint.html#指定预处理器-processor","240":"/articles/basic/eslint.html#指定解析环境-env","241":"/articles/basic/eslint.html#指定全局环境-globals","242":"/articles/basic/eslint.html#配置插件-plugins","243":"/articles/basic/eslint.html#配置规则-rules","244":"/articles/basic/eslint.html#使用注释规则","245":"/articles/basic/eslint.html#配置举例","246":"/articles/basic/eslint.html#行内注释","247":"/articles/basic/eslint.html#使用-overrides-对指定文件进行规则覆盖","248":"/articles/basic/eslint.html#禁止使用-eslint-disable","249":"/articles/basic/eslint.html#共享配置-settings","250":"/articles/basic/eslint.html#配置项目文件结构","251":"/articles/basic/eslint.html#扩展-extends","252":"/articles/basic/eslint.html#配置忽略文件","253":"/articles/basic/eslint.html#cli","254":"/articles/basic/git.html#git","255":"/articles/basic/git.html#git-rebase","256":"/articles/basic/git.html#api","257":"/articles/basic/git.html#理解","258":"/articles/basic/git.html#git-revert","259":"/articles/basic/git.html#api-1","260":"/articles/basic/git.html#理解-1","261":"/articles/basic/git.html#git-restore","262":"/articles/basic/git.html#api-2","263":"/articles/basic/git.html#理解-2","264":"/articles/basic/git.html#git-reset","265":"/articles/basic/git.html#api-3","266":"/articles/basic/git.html#理解-3","267":"/articles/basic/history.html#history-api","268":"/articles/basic/history.html#window-history","269":"/articles/basic/history.html#browser-浏览器路由","270":"/articles/basic/history.html#hash-哈希路由","271":"/articles/basic/history.html#window-location","272":"/articles/basic/ieee.html#ieee-754","273":"/articles/basic/ieee.html#基本格式","274":"/articles/basic/ieee.html#单精度","275":"/articles/basic/ieee.html#双精度","276":"/articles/basic/ieee.html#双重扩展","277":"/articles/basic/ieee.html#四倍精度","278":"/articles/basic/ieee.html#decimal64-decimal128","279":"/articles/basic/ieee.html#半精度","280":"/articles/basic/ieee.html#浮点数范围","281":"/articles/basic/ieee.html#字节序-endian","282":"/articles/basic/ieee.html#整数值的精度限制","283":"/articles/basic/ieee.html#内部表示","284":"/articles/basic/ieee.html#javascript-数表示","285":"/articles/basic/ieee.html#进制转换","286":"/articles/basic/ieee.html#二进制转换","287":"/articles/basic/ieee.html#整数","288":"/articles/basic/ieee.html#小数","289":"/articles/basic/ieee.html#十六进制转换","290":"/articles/basic/ieee.html#八进制转换","291":"/articles/basic/ieee.html#计算机编码方式","292":"/articles/basic/ieee.html#原码","293":"/articles/basic/ieee.html#反码","294":"/articles/basic/ieee.html#补码","295":"/articles/basic/ieee.html#_0-6-0-3-0-9","296":"/articles/basic/ieee.html#_0-6-的二进制","297":"/articles/basic/ieee.html#_0-3-的二进制","298":"/articles/basic/ieee.html#指数对齐相加","299":"/articles/basic/ieee.html#解决方法","300":"/articles/basic/module.html#前端模块的演变","301":"/articles/basic/module.html#umd","302":"/articles/basic/module.html#amd","303":"/articles/basic/module.html#define-函数","304":"/articles/basic/module.html#require-函数","305":"/articles/basic/module.html#commonjs","306":"/articles/basic/module.html#esm","307":"/articles/basic/module.html#扩展","308":"/articles/basic/module.html#systemjs","309":"/articles/basic/module.html#require-context","310":"/articles/basic/script_link.html#script-link-标签","311":"/articles/basic/script_link.html#defer","312":"/articles/basic/script_link.html#async","313":"/articles/basic/script_link.html#crossorigin","314":"/articles/basic/syslink.html#linux-链接","315":"/articles/basic/syslink.html#soft-links","316":"/articles/basic/syslink.html#定义","317":"/articles/basic/syslink.html#工作","318":"/articles/basic/syslink.html#创建","319":"/articles/basic/syslink.html#hard-links","320":"/articles/basic/syslink.html#定义-1","321":"/articles/basic/syslink.html#工作-1","322":"/articles/basic/syslink.html#创建-1","323":"/articles/basic/syslink.html#区别","324":"/articles/#开启写作之旅","325":"/articles/problem/css.html#css-遇到的问题","326":"/articles/problem/css.html#问题一","327":"/articles/problem/yarn.html#yarn-问题","328":"/articles/problem/yarn.html#spawn-e2big","329":"/articles/problem/yarn.html#问题描述","330":"/articles/problem/yarn.html#问题解决","331":"/articles/servers/ecs.html#云服务器ecs","332":"/articles/servers/ecs.html#阿里云服务器-elastic-compute-service","333":"/articles/servers/ecs.html#mac","334":"/articles/servers/ecs.html#腾讯云","335":"/editor/#文档编辑","336":"/editor/markdown/vuepress.html#vuepress-vitepress","337":"/editor/markdown/vuepress.html#标题类","338":"/editor/markdown/vuepress.html#标签类","339":"/editor/markdown/vuepress.html#输出类","340":"/editor/markdown/vuepress.html#目录类","341":"/editor/markdown/vuepress.html#链接类","342":"/editor/markdown/vuepress.html#风格类","343":"/editor/markdown/vuepress.html#提示类","344":"/editor/markdown/vuepress.html#表格类","345":"/editor/markdown/vuepress.html#表情类","346":"/interview/browser.html#chromium-渲染流水线","347":"/interview/browser.html#浏览器架构","348":"/interview/browser.html#chromium-进程","349":"/interview/browser.html#浏览器进程","350":"/interview/browser.html#渲染进程","351":"/interview/browser.html#主线程","352":"/interview/browser.html#合成线程","353":"/interview/browser.html#viz-进程","354":"/interview/browser.html#进程模式","355":"/interview/browser.html#渲染流水线","356":"/interview/browser.html#parsing","357":"/interview/browser.html#style","358":"/interview/browser.html#layout","359":"/interview/browser.html#pre-paint","360":"/interview/browser.html#paint","361":"/interview/browser.html#commit","362":"/interview/browser.html#compositing","363":"/interview/browser.html#tiling","364":"/interview/browser.html#raster","365":"/interview/browser.html#activate","366":"/interview/browser.html#draw","367":"/interview/browser.html#aggregate","368":"/interview/browser.html#display","369":"/interview/crp.html#关键路径渲染","370":"/interview/crp.html#浏览器渲染","371":"/interview/crp.html#dom","372":"/interview/crp.html#cssom","373":"/interview/crp.html#render-tree","374":"/interview/crp.html#layout","375":"/interview/crp.html#paint","376":"/interview/crp.html#优化","377":"/interview/#面试","378":"/interview/metrics.html#性能指标","379":"/interview/metrics.html#lcp","380":"/interview/metrics.html#如何衡量","381":"/interview/metrics.html#改进","382":"/interview/metrics.html#测量工具","383":"/interview/metrics.html#fp","384":"/interview/metrics.html#fcp","385":"/interview/metrics.html#dcl","386":"/interview/metrics.html#fmp","387":"/interview/metrics.html#l","388":"/interview/metrics.html#tti","389":"/interview/metrics.html#tbt","390":"/interview/metrics.html#fid","391":"/interview/metrics.html#cls","392":"/interview/metrics.html#si","393":"/network/cookie.html#cookies","394":"/network/cookie.html#读取","395":"/network/cookie.html#写入","396":"/network/cookie.html#path","397":"/network/cookie.html#domain","398":"/network/cookie.html#过期时间","399":"/network/cookie.html#expires","400":"/network/cookie.html#max-age","401":"/network/cookie.html#secure","402":"/network/cookie.html#samesite","403":"/network/cookie.html#httponly","404":"/network/cookie.html#第三方-cookie","405":"/network/cors.html#cors","406":"/network/cors.html#cors-headers","407":"/network/cors.html#access-control-allow-origin","408":"/network/cors.html#access-control-allow-credentials","409":"/network/cors.html#access-control-allow-headers","410":"/network/cors.html#access-control-allow-methods","411":"/network/cors.html#access-control-expose-headers","412":"/network/cors.html#access-control-max-age","413":"/network/cors.html#access-control-request-headers","414":"/network/cors.html#access-control-request-method","415":"/network/cors.html#origin","416":"/network/cors.html#同源策略","417":"/network/cors.html#document-domain","418":"/network/cors.html#跨域访问的几种方式","419":"/network/cors.html#window-postmessage","420":"/network/dhcp.html#dhcp","421":"/network/dhcp.html#如何配置-ip-地址","422":"/network/dhcp.html#动态主机配置协议-dhcp","423":"/network/dhcp.html#pxe","424":"/network/dhcp.html#原理","425":"/network/dhcp.html#pxe-工作过程","426":"/network/#网络协议","427":"/network/#常见网络协议","428":"/network/#ip-地址","429":"/network/#ipv4","430":"/network/#ipv6","431":"/network/#ip-地址如何计算广播地址、子网掩码","432":"/network/#mac-地址","433":"/network/#网络设备的状态标识","434":"/network/ip_addr.html#ip-地址","435":"/network/ip_addr.html#ip-协议","436":"/network/ip_addr.html#ip-地址-1","437":"/network/ip_addr.html#ip-地址类型","438":"/network/ip_addr.html#公有地址","439":"/network/ip_addr.html#私有地址","440":"/network/ip_addr.html#ip-地址编址方式","441":"/network/ip_addr.html#a-类地址","442":"/network/ip_addr.html#b-类地址","443":"/network/ip_addr.html#c-类地址","444":"/network/ip_addr.html#d-类地址","445":"/network/ip_addr.html#e-类地址","446":"/network/ip_addr.html#特殊的网址","447":"/network/ip_addr.html#ip-地址的分配","448":"/network/layer.html#网络分层","449":"/network/layer.html#工作过程","450":"/network/methods.html#http-请求方法","451":"/network/methods.html#get","452":"/network/methods.html#head","453":"/network/methods.html#post","454":"/network/methods.html#请求-body-格式","455":"/network/methods.html#put","456":"/network/methods.html#delete","457":"/network/methods.html#trace","458":"/network/methods.html#options","459":"/network/methods.html#connect","460":"/network/methods.html#patch","461":"/network/methods.html#对比","462":"/network/noun.html#计算机网络名词","463":"/network/noun.html#以太网","464":"/network/noun.html#交换机","465":"/network/noun.html#网关","466":"/network/noun.html#路由器","467":"/network/noun.html#mac-地址","468":"/network/osi.html#网络模型","469":"/network/osi.html#网络传输协议","470":"/network/osi.html#osi-网络模型","471":"/network/osi.html#应用层","472":"/network/osi.html#表达层","473":"/network/osi.html#会话层","474":"/network/osi.html#传输层","475":"/network/osi.html#网络层","476":"/network/osi.html#数据链路层","477":"/network/osi.html#物理层","478":"/network/osi.html#tcp-ip-协议","479":"/network/osi.html#链路层","480":"/network/osi.html#网络层-1","481":"/network/osi.html#传输层-1","482":"/network/osi.html#应用层-1","483":"/network/osi.html#缺陷","484":"/network/socket.html#socket","485":"/network/socket.html#socket-1","486":"/network/socket.html#表示方法","487":"/network/socket.html#连接","488":"/network/socket.html#websocket","489":"/network/socket.html#优点","490":"/network/socket.html#建立连接","491":"/network/socket.html#连接保持-心跳","492":"/network/socket.html#响应头-请求头","493":"/network/socket.html#sec-websocket-key-sec-websocket-accept","494":"/network/socket.html#遇到的一些问题","495":"/network/special_addr.html#http-特殊地址","496":"/network/special_addr.html#_0-0-0-0","497":"/network/special_addr.html#服务器","498":"/network/special_addr.html#客户端","499":"/network/special_addr.html#_127-0-0-1","500":"/network/status_code.html#http-状态码","501":"/network/status_code.html#_1xx","502":"/network/status_code.html#_100-continue","503":"/network/status_code.html#_101-switching-protocols","504":"/network/status_code.html#_102-processing-webdav-rfc","505":"/network/status_code.html#_103-early-hints-rfc","506":"/network/status_code.html#_2xx","507":"/network/status_code.html#_200-ok","508":"/network/status_code.html#_201-created","509":"/network/status_code.html#_202-accepted","510":"/network/status_code.html#_203-non-authroritative-information-http-1-1","511":"/network/status_code.html#_204-no-content","512":"/network/status_code.html#_205-reset-content","513":"/network/status_code.html#_206-partial-content-rfc","514":"/network/status_code.html#_207-multi-status-rfc","515":"/network/status_code.html#_208-already-reported-rfc","516":"/network/status_code.html#_226-im-used-rfc","517":"/network/status_code.html#_3xx","518":"/network/status_code.html#_300-multiple-choices","519":"/network/status_code.html#_301-moved-permanently","520":"/network/status_code.html#_302-found-moved-temporarily","521":"/network/status_code.html#_303-see-other","522":"/network/status_code.html#_304-not-modified","523":"/network/status_code.html#_305-use-proxy","524":"/network/status_code.html#_306-switch-proxy","525":"/network/status_code.html#_307-temporary-redirect","526":"/network/status_code.html#_308-permanent-redirect-rfc","527":"/network/status_code.html#_4xx","528":"/network/status_code.html#_400-bad-request","529":"/network/status_code.html#_401-unauthorized-rfc","530":"/network/status_code.html#_402-payment-required","531":"/network/status_code.html#_403-forbidden","532":"/network/status_code.html#_404-not-found","533":"/network/status_code.html#_405-method-not-allowed","534":"/network/status_code.html#_406-not-acceptable","535":"/network/status_code.html#_407-proxy-authentication-required-rfc","536":"/network/status_code.html#_408-request-timeout","537":"/network/status_code.html#_415-unsupported-media-type","538":"/network/status_code.html#_5xx","539":"/network/status_code.html#_500-internal-server-error","540":"/network/status_code.html#_501-not-implemented","541":"/network/status_code.html#_502-bad-gateway","542":"/network/status_code.html#_503-service-unavailable","543":"/network/status_code.html#_504-gateway-timeout","544":"/network/status_code.html#_511-network-authentication-required","545":"/network/subnet_mask.html#子网掩码","546":"/network/subnet_mask.html#背景","547":"/network/subnet_mask.html#功能","548":"/network/subnet_mask.html#声明网络地址与主机地址","549":"/network/subnet_mask.html#划分子网","550":"/network/subnet_mask.html#变长子网掩码","551":"/network/subnet_mask.html#无类别域间路由","552":"/network/tls_ssl.html#https-加密层","553":"/network/tls_ssl.html#对称加密","554":"/network/tls_ssl.html#计算密钥","555":"/network/tls_ssl.html#缺陷","556":"/network/tls_ssl.html#非对称加密","557":"/network/tls_ssl.html#加密数据","558":"/network/tls_ssl.html#缺陷-1","559":"/network/tls_ssl.html#对称加密-非对称加密","560":"/network/tls_ssl.html#加密数据-1","561":"/network/tls_ssl.html#安全性","562":"/network/tls_ssl.html#ca-证书","563":"/network/tls_ssl.html#加密方式","564":"/network/tls_ssl.html#申请数字证书","565":"/network/tls_ssl.html#ca-数字签名","566":"/network/tls_ssl.html#验证数字证书","567":"/network/tls_ssl.html#总结","568":"/network/tls_ssl.html#数字证书拓展","569":"/network/webrtc.html#webrtc","570":"/network/webrtc.html#udp-dtls","571":"/network/webrtc.html#rtp-srtp-rtcp-srtcp","572":"/network/webrtc.html#sctp","573":"/notes/css/bfc.html#html-格式化上下文","574":"/notes/css/bfc.html#bfc","575":"/notes/css/bfc.html#css-属性创建-bfc","576":"/notes/css/bfc.html#解决了什么问题","577":"/notes/css/bfc.html#ifc","578":"/notes/css/bfc.html#说明","579":"/notes/css/bfc.html#flow-layout","580":"/notes/css/bfc.html#writing-mode","581":"/notes/css/bfc.html#说明-1","582":"/notes/css/bfc.html#外边距重叠","583":"/notes/css/bfc.html#情形","584":"/notes/css/box.html#盒模型","585":"/notes/css/box.html#基础盒模型","586":"/notes/css/box.html#与盒模型相关的css属性","587":"/notes/css/box.html#视觉格式化模型","588":"/notes/css/flex.html#flex-扩展","589":"/notes/css/flex.html#flex-margin","590":"/notes/css/flex.html#margin-auto","591":"/notes/css/flex.html#justify-content-align-items","592":"/notes/css/flex.html#space-between","593":"/notes/css/flex.html#space-around","594":"/notes/css/flex.html#align-self-flex-start-flex-end-center","595":"/notes/css/flex.html#粘性布局","596":"/notes/css/float.html#float-clear","597":"/notes/css/float.html#float","598":"/notes/css/float.html#float-属性取值","599":"/notes/css/float.html#是否设置宽度","600":"/notes/css/float.html#是否设置-margin-top","601":"/notes/css/float.html#clear","602":"/notes/css/float.html#clearfix","603":"/notes/css/float.html#clear-属性取值","604":"/notes/css/#css-选择器","605":"/notes/css/#元素选择器","606":"/notes/css/#id-选择器","607":"/notes/css/#类选择器","608":"/notes/css/#属性选择器","609":"/notes/css/#伪类选择器","610":"/notes/css/#选择器组合","611":"/notes/css/#","612":"/notes/css/#空格","613":"/notes/css/#-1","614":"/notes/css/#-2","615":"/notes/css/#-3","616":"/notes/css/#-4","617":"/notes/css/#带-符号的选择器","618":"/notes/css/#namespace","619":"/notes/css/#charset","620":"/notes/css/#import","621":"/notes/css/#media","622":"/notes/css/#page","623":"/notes/css/#counter-style","624":"/notes/css/#key-frames","625":"/notes/css/#fontface","626":"/notes/css/#support","627":"/notes/css/inline.html#行内元素-css","628":"/notes/css/inline.html#vertical-align","629":"/notes/css/inline.html#line-height","630":"/notes/css/inline.html#取值","631":"/notes/css/pseudo.html#伪元素-伪类","632":"/notes/css/pseudo.html#伪元素","633":"/notes/css/pseudo.html#列举","634":"/notes/css/pseudo.html#伪类","635":"/notes/css/pseudo.html#列举-1","636":"/notes/css/replaced.html#可替换元素","637":"/notes/css/replaced.html#定义","638":"/notes/css/replaced.html#替换元素","639":"/notes/css/replaced.html#content-属性","640":"/notes/css/replaced.html#取值","641":"/notes/css/replaced.html#counter-counters","642":"/notes/css/replaced.html#list-style-属性","643":"/notes/css/text-character.html#文字特性","644":"/notes/css/text-character.html#例子","645":"/notes/css/text-character.html#解决方式","646":"/notes/css/text-character.html#压缩方式","647":"/notes/css/text-character.html#margin-方式","648":"/notes/css/text-character.html#忽略闭合标签","649":"/notes/css/text-character.html#font-size-方式","650":"/notes/css/text-character.html#float-方式","651":"/notes/css/text-character.html#flex-布局方式","652":"/notes/css/visibility.html#visibility","653":"/notes/css/visibility.html#display","654":"/notes/css/visibility.html#visibility-1","655":"/notes/css/visibility.html#content-visibility","656":"/notes/css/visibility.html#contain","657":"/notes/css/visibility.html#size","658":"/notes/css/visibility.html#layout","659":"/notes/css/visibility.html#style","660":"/notes/css/visibility.html#paint","661":"/notes/css/visibility.html#组合使用","662":"/notes/es/es6.html#es6","663":"/notes/es/es6.html#let-const","664":"/notes/es/es6.html#解构赋值","665":"/notes/es/es6.html#正则的扩展","666":"/notes/es/es6.html#match-exec-matchall","667":"/notes/es/es6.html#symbol","668":"/notes/es/es6.html#set-map","669":"/notes/es/es6.html#generate","670":"/notes/es/es6.html#class","671":"/notes/es/es6.html#arraybuffer","672":"/notes/es/es6.html#commonjs-es6","673":"/notes/html/esmodule.html#浏览器-type-module","674":"/notes/html/esmodule.html#兼容性","675":"/notes/html/esmodule.html#基本使用","676":"/notes/html/esmodule.html#路径支持","677":"/notes/html/esmodule.html#nomodule-noscript","678":"/notes/html/esmodule.html#加载顺序默认为-defer","679":"/notes/html/esmodule.html#module-行内执行顺序-defer","680":"/notes/html/esmodule.html#async-inline-module","681":"/notes/html/esmodule.html#多次加载只加载一次","682":"/notes/html/esmodule.html#跨域问题","683":"/notes/html/esmodule.html#自带凭证-crossorigin","684":"/notes/html/esmodule.html#mime-type","685":"/notes/html/seo.html#seo语义化","686":"/notes/html/seo.html#aside","687":"/notes/html/seo.html#article","688":"/notes/html/seo.html#hgroup-h1-h2","689":"/notes/html/seo.html#abbr","690":"/notes/html/seo.html#hr","691":"/notes/html/seo.html#p","692":"/notes/html/seo.html#strong","693":"/notes/html/seo.html#blockquote-q-cite","694":"/notes/html/seo.html#time","695":"/notes/html/seo.html#figure-figcaption","696":"/notes/html/seo.html#dfn","697":"/notes/html/seo.html#nav-ol-ul","698":"/notes/html/seo.html#pre-samp-code","699":"/notes/html/seo.html#其他","700":"/notes/html/unusual.html#你不知道的-html-标签","701":"/notes/html/unusual.html#meta","702":"/notes/#just-do-it","703":"/notes/javascript/URI.html#uri-编码","704":"/notes/javascript/URI.html#unescape","705":"/notes/javascript/URI.html#escape","706":"/notes/javascript/URI.html#encodeuri","707":"/notes/javascript/URI.html#decodeuri","708":"/notes/javascript/URI.html#encodeuricomponent","709":"/notes/javascript/URI.html#decodeuricomponent","710":"/notes/javascript/addEventListener.html#dom2-级绑定事件","711":"/notes/javascript/addEventListener.html#addeventlistener","712":"/notes/javascript/addEventListener.html#api","713":"/notes/javascript/addEventListener.html#例子","714":"/notes/javascript/dom.html#dom-类型","715":"/notes/javascript/dom.html#dom-链","716":"/notes/javascript/dom.html#dom-操作","717":"/notes/javascript/dom.html#dom-扩展","718":"/notes/javascript/dom.html#dom2-dom3","719":"/notes/javascript/equal.html#js-相等性","720":"/notes/javascript/equal.html#相等","721":"/notes/javascript/equal.html#严格相等","722":"/notes/javascript/equal.html#判断-if","723":"/notes/javascript/equal.html#比较","724":"/notes/javascript/event-loop.html#event-loop","725":"/notes/javascript/event-loop.html#cpu、进程、线程之间的关系","726":"/notes/javascript/event-loop.html#浏览器是多进程的","727":"/notes/javascript/event-loop.html#浏览器包含了哪些进程","728":"/notes/javascript/event-loop.html#主进程","729":"/notes/javascript/event-loop.html#第三方插件进程","730":"/notes/javascript/event-loop.html#浏览器内核-渲染进程","731":"/notes/javascript/event-loop.html#javascript-单线程","732":"/notes/javascript/event-loop.html#gui-渲染线程与-js-引擎线程互斥","733":"/notes/javascript/event-loop.html#event-loop-go","734":"/notes/javascript/jsop.html#js-运算符","735":"/notes/javascript/jsop.html#控制合并操作符","736":"/notes/javascript/jsop.html#赋值","737":"/notes/javascript/jsop.html#短路","738":"/notes/javascript/jsop.html#可选链式操作符","739":"/notes/javascript/jsop.html#比较","740":"/notes/javascript/jsop.html#函数调用","741":"/notes/javascript/jsop.html#表达式","742":"/notes/javascript/jsop.html#不能用于赋值","743":"/notes/javascript/jsop.html#访问数组元素","744":"/notes/javascript/jsop.html#运算符优先级","745":"/notes/javascript/mutationObserver.html#mutationobserver","746":"/notes/javascript/mutationObserver.html#概念","747":"/notes/javascript/mutationObserver.html#兼容性","748":"/notes/javascript/mutationObserver.html#用法","749":"/notes/javascript/mutationObserver.html#api","750":"/notes/javascript/mutationObserver.html#observe-方法","751":"/notes/javascript/mutationObserver.html#callback-mutation-records-回调参数属性分析","752":"/notes/javascript/mutationObserver.html#disconnect-关闭连接","753":"/notes/javascript/mutationObserver.html#multi-mutaintionobserver-多监听改变","754":"/notes/javascript/mutationObserver.html#重新使用-mutationobserver-实例","755":"/notes/javascript/mutationObserver.html#observe-方法第二个参数对象有哪些属性","756":"/notes/javascript/mutationObserver.html#mutationobserver-设计规范","757":"/notes/javascript/mutationObserver.html#异步回调和记录队列","758":"/notes/javascript/mutationObserver.html#takerecords-方法","759":"/notes/javascript/mutationObserver.html#性能分析","760":"/notes/javascript/prototype.html#原型","761":"/notes/javascript/prototype.html#创建一个对象","762":"/notes/javascript/prototype.html#继承","763":"/notes/javascript/prototype.html#proto","764":"/notes/javascript/prototype.html#constructor","765":"/notes/javascript/scope.html#js-作用域","766":"/notes/javascript/scope.html#编译原理","767":"/notes/javascript/scope.html#理解作用域","768":"/notes/javascript/scope.html#lhs-rhs","769":"/notes/javascript/scope.html#异常","770":"/notes/javascript/scope.html#总结","771":"/notes/javascript/scope.html#词法作用域","772":"/notes/javascript/scope.html#闭包","773":"/notes/javascript/scope.html#查找作用域","774":"/notes/javascript/scope.html#欺骗作用域","775":"/notes/javascript/scope.html#eval","776":"/notes/javascript/scope.html#with","777":"/notes/javascript/scope.html#性能","778":"/notes/javascript/scope.html#全局作用域","779":"/notes/javascript/scope.html#函数作用域","780":"/notes/javascript/scope.html#块级作用域","781":"/notes/javascript/storage-struct.html#js-的存储结构","782":"/notes/javascript/storage-struct.html#栈结构","783":"/notes/javascript/storage-struct.html#调用栈","784":"/notes/javascript/storage-struct.html#函数调用","785":"/notes/javascript/storage-struct.html#栈","786":"/notes/javascript/storage-struct.html#总结","787":"/notes/javascript/storage-struct.html#栈溢出","788":"/notes/javascript/storage-struct.html#内存空间","789":"/notes/javascript/storage-struct.html#代码空间","790":"/notes/javascript/storage-struct.html#栈空间","791":"/notes/javascript/storage-struct.html#堆空间","792":"/notes/javascript/storage-struct.html#js-内存管理-变量分配","793":"/notes/javascript/storage-struct.html#静态区","794":"/notes/javascript/storage-struct.html#调用栈-1","795":"/notes/javascript/storage-struct.html#堆","796":"/notes/javascript/this.html#关于-this","797":"/notes/javascript/this.html#误解","798":"/notes/javascript/this.html#this-全面解析","799":"/notes/javascript/this.html#调用位置","800":"/notes/javascript/this.html#绑定规则","801":"/notes/javascript/this.html#默认绑定","802":"/notes/javascript/this.html#隐式绑定","803":"/notes/javascript/this.html#显式绑定","804":"/notes/javascript/this.html#new-绑定","805":"/notes/javascript/this.html#绑定优先级","806":"/notes/javascript/this.html#bind","807":"/notes/javascript/this.html#注意点","808":"/notes/javascript/this.html#忽略的-this","809":"/notes/javascript/this.html#间接引用","810":"/notes/javascript/this.html#软绑定","811":"/notes/javascript/this.html#es6-箭头函数","812":"/notes/nodejs/ansi.html#ansi-escape-sequences","813":"/notes/nodejs/ansi.html#定义","814":"/notes/nodejs/ansi.html#转义序列","815":"/notes/nodejs/ansi.html#csi-序列","816":"/notes/nodejs/ansi.html#更多","817":"/notes/nodejs/event-loop.html#nodejs-事件循环","818":"/notes/nodejs/event-loop.html#理解","819":"/notes/nodejs/event-loop.html#非阻塞-i-o-操作的设计机制","820":"/notes/nodejs/event-loop.html#process-nexttick-又是如何执行","821":"/notes/nodejs/event-loop.html#定时器-timers","822":"/notes/nodejs/event-loop.html#待定的回调-pending-callbacks","823":"/notes/nodejs/event-loop.html#idle-prepare","824":"/notes/nodejs/event-loop.html#轮询-poll","825":"/notes/nodejs/event-loop.html#检测-check","826":"/notes/nodejs/event-loop.html#关闭的回调函数-close-callbacks","827":"/notes/nodejs/event-loop.html#settimeout-vs-setimmediate","828":"/notes/nodejs/event-loop.html#process-nexttick","829":"/notes/nodejs/event-loop.html#process-nexttick-vs-setimmediate","830":"/notes/nodejs/event-loop.html#为什么使用-process-nexttick","831":"/notes/nodejs/npm.html#package-json","832":"/notes/nodejs/npm.html#json-配置","833":"/notes/regexp/base.html#正则表达式","834":"/notes/regexp/unknown.html#你不知道的正则表达式","835":"/notes/regexp/unknown.html#逗号分隔千分位","836":"/notes/typescript/advanced.html#typescript-高级","837":"/notes/typescript/advanced.html#advanced-type","838":"/notes/typescript/advanced.html#utility-types","839":"/notes/typescript/advanced.html#modules","840":"/notes/typescript/advanced.html#import-a-moudle-from-side-effects-only","841":"/notes/typescript/advanced.html#importing-types","842":"/notes/typescript/advanced.html#optional-module-loading","843":"/notes/typescript/advanced.html#ambient-modules","844":"/notes/typescript/advanced.html#umd-modules","845":"/notes/typescript/advanced.html#module-resolution","846":"/notes/typescript/advanced.html#相对路径-非相对路径","847":"/notes/typescript/advanced.html#常见解析-classic","848":"/notes/typescript/advanced.html#node-js-解析","849":"/notes/typescript/advanced.html#typescript-解析","850":"/notes/typescript/advanced.html#baseurl-配置","851":"/notes/typescript/advanced.html#测试解析路径","852":"/notes/typescript/advanced.html#namespaces","853":"/notes/typescript/advanced.html#namespaces-modules","854":"/notes/typescript/advanced.html#triple-slash-directives","855":"/notes/typescript/basic.html#typescript-基础","856":"/notes/typescript/basic.html#tsconfig-json-jsconfig-json-文件","857":"/notes/typescript/basic.html#配置参数","858":"/notes/typescript/basic.html#cli","859":"/notes/typescript/basic.html#basic-type","860":"/notes/typescript/basic.html#interfaces","861":"/notes/typescript/basic.html#functions","862":"/notes/typescript/basic.html#literal-types","863":"/notes/typescript/basic.html#union-and-intersection-types","864":"/notes/typescript/basic.html#classes","865":"/notes/typescript/basic.html#enum","866":"/notes/typescript/basic.html#generics","867":"/notes/typescript/lib-struct.html#typescript-文件结构定义","868":"/notes/typescript/lib-struct.html#模块化","869":"/notes/typescript/lib-struct.html#模块模板","870":"/notes/typescript/lib-struct.html#module-d-ts","871":"/notes/typescript/lib-struct.html#全局模板","872":"/notes/typescript/lib-struct.html#do-s-don-ts","873":"/notes/typescript/lib-struct.html#deep-dive","874":"/notes/typescript/lib-struct.html#高级组合","875":"/source-code/#导航","876":"/source-code/react/api/context.html#context","877":"/source-code/react/api/ref.html#ref","878":"/source-code/vue/#开始"},"fieldIds":{"title":0,"titles":1,"text":2},"fieldLength":{"0":[3,1,10],"1":[1,3,9],"2":[1,3,7],"3":[1,1,2],"4":[1,1,11],"5":[1,1,1],"6":[1,1,5],"7":[1,1,5],"8":[1,1,18],"9":[1,1,4],"10":[1,1,2],"11":[1,1,1],"12":[1,2,41],"13":[2,2,29],"14":[1,2,14],"15":[1,2,11],"16":[1,3,22],"17":[2,2,3],"18":[1,2,12],"19":[1,3,16],"20":[1,2,25],"21":[1,3,16],"22":[1,1,6],"23":[2,1,24],"24":[2,3,18],"25":[1,3,4],"26":[1,3,2],"27":[1,3,2],"28":[2,3,1],"29":[1,3,1],"30":[1,3,1],"31":[1,1,1],"32":[1,1,1],"33":[1,2,16],"34":[1,2,12],"35":[1,2,17],"36":[1,1,1],"37":[1,2,3],"38":[1,2,7],"39":[1,1,2],"40":[1,1,3],"41":[1,1,12],"42":[1,1,17],"43":[1,2,17],"44":[1,2,8],"45":[1,2,3],"46":[1,2,5],"47":[1,2,10],"48":[1,1,12],"49":[1,1,2],"50":[1,2,35],"51":[1,2,24],"52":[1,2,20],"53":[2,2,21],"54":[1,1,1],"55":[1,2,15],"56":[1,1,25],"57":[1,1,3],"58":[1,1,8],"59":[1,2,20],"60":[1,2,15],"61":[1,1,16],"62":[1,1,7],"63":[1,2,14],"64":[1,2,19],"65":[1,2,39],"66":[1,2,5],"67":[1,1,18],"68":[1,1,5],"69":[1,1,2],"70":[1,2,2],"71":[1,2,2],"72":[2,2,7],"73":[1,1,5],"74":[1,1,2],"75":[1,2,3],"76":[1,3,18],"77":[2,3,9],"78":[1,2,4],"79":[1,3,20],"80":[2,3,3],"81":[1,2,4],"82":[1,3,22],"83":[2,3,8],"84":[1,1,2],"85":[1,2,3],"86":[1,3,18],"87":[2,3,10],"88":[1,2,3],"89":[1,3,19],"90":[2,3,2],"91":[1,2,5],"92":[1,3,30],"93":[2,3,9],"94":[2,1,5],"95":[2,3,32],"96":[3,3,8],"97":[3,3,9],"98":[1,3,83],"99":[1,1,10],"100":[2,1,8],"101":[1,3,7],"102":[1,3,19],"103":[1,3,3],"104":[1,3,68],"105":[1,3,5],"106":[1,3,85],"107":[1,1,8],"108":[1,1,11],"109":[1,1,7],"110":[1,1,13],"111":[1,1,7],"112":[1,2,25],"113":[1,3,76],"114":[1,3,89],"115":[2,3,12],"116":[1,3,11],"117":[1,1,2],"118":[1,2,1],"119":[1,2,1],"120":[1,2,1],"121":[1,1,2],"122":[1,2,2],"123":[1,2,2],"124":[1,1,1],"125":[1,2,3],"126":[1,2,3],"127":[1,1,1],"128":[1,2,11],"129":[1,2,5],"130":[2,1,12],"131":[3,2,53],"132":[1,5,31],"133":[2,2,1],"134":[2,4,40],"135":[3,4,10],"136":[3,4,4],"137":[3,7,35],"138":[3,7,14],"139":[3,7,53],"140":[3,4,5],"141":[1,6,13],"142":[3,2,8],"143":[2,5,73],"144":[4,5,31],"145":[5,5,17],"146":[5,5,30],"147":[3,10,100],"148":[2,1,1],"149":[1,2,23],"150":[1,1,1],"151":[1,1,15],"152":[1,1,1],"153":[1,1,14],"154":[1,1,3],"155":[2,2,22],"156":[4,2,58],"157":[2,2,31],"158":[4,2,35],"159":[3,2,30],"160":[2,2,37],"161":[2,2,10],"162":[1,3,20],"163":[2,3,15],"164":[1,3,4],"165":[2,1,2],"166":[1,2,11],"167":[2,2,44],"168":[2,2,140],"169":[1,1,1],"170":[1,1,19],"171":[2,1,1],"172":[1,2,16],"173":[1,2,7],"174":[1,2,21],"175":[1,1,3],"176":[1,2,6],"177":[1,2,3],"178":[1,2,6],"179":[1,2,5],"180":[1,2,2],"181":[1,2,15],"182":[1,2,26],"183":[1,2,18],"184":[1,2,9],"185":[1,2,12],"186":[1,1,4],"187":[1,1,5],"188":[7,1,94],"189":[3,1,12],"190":[1,4,55],"191":[1,4,84],"192":[1,1,4],"193":[2,1,1],"194":[2,2,10],"195":[1,4,58],"196":[2,2,32],"197":[1,4,6],"198":[1,4,39],"199":[2,4,3],"200":[1,6,34],"201":[1,6,21],"202":[1,6,21],"203":[1,6,19],"204":[1,2,1],"205":[2,3,10],"206":[1,3,32],"207":[1,1,1],"208":[2,1,50],"209":[2,1,18],"210":[3,1,42],"211":[3,1,33],"212":[3,1,11],"213":[1,3,7],"214":[1,3,4],"215":[1,3,1],"216":[2,4,10],"217":[2,4,17],"218":[2,4,40],"219":[2,4,31],"220":[1,3,1],"221":[2,4,62],"222":[2,4,25],"223":[1,3,20],"224":[1,4,36],"225":[1,4,27],"226":[1,4,79],"227":[1,4,54],"228":[1,4,9],"229":[1,4,28],"230":[1,4,39],"231":[4,4,14],"232":[1,4,37],"233":[1,4,19],"234":[1,4,31],"235":[1,1,2],"236":[1,1,10],"237":[1,1,23],"238":[1,1,9],"239":[2,1,12],"240":[2,1,13],"241":[2,1,9],"242":[2,1,18],"243":[2,1,8],"244":[1,3,8],"245":[1,3,8],"246":[1,3,23],"247":[3,3,6],"248":[3,1,4],"249":[2,1,6],"250":[1,1,22],"251":[2,1,12],"252":[1,1,15],"253":[1,1,173],"254":[1,1,4],"255":[2,1,6],"256":[1,3,28],"257":[1,3,27],"258":[2,1,2],"259":[1,3,22],"260":[1,3,3],"261":[2,1,2],"262":[1,3,19],"263":[1,3,18],"264":[2,3,4],"265":[1,3,25],"266":[1,3,13],"267":[2,1,1],"268":[2,2,55],"269":[2,2,21],"270":[2,2,14],"271":[2,2,62],"272":[2,1,2],"273":[1,2,1],"274":[1,3,13],"275":[1,3,14],"276":[1,3,8],"277":[1,3,10],"278":[2,3,2],"279":[1,3,4],"280":[1,2,22],"281":[3,3,3],"282":[1,3,19],"283":[1,2,41],"284":[2,2,16],"285":[1,2,1],"286":[1,3,1],"287":[1,4,12],"288":[1,4,10],"289":[1,3,13],"290":[1,3,13],"291":[1,2,3],"292":[1,3,4],"293":[1,3,7],"294":[1,3,40],"295":[6,2,7],"296":[3,8,15],"297":[3,8,17],"298":[1,8,19],"299":[1,8,8],"300":[1,1,5],"301":[1,1,10],"302":[1,1,1],"303":[2,2,27],"304":[2,2,18],"305":[1,1,14],"306":[1,1,12],"307":[1,1,1],"308":[1,2,1],"309":[2,2,34],"310":[3,1,4],"311":[1,3,18],"312":[1,3,20],"313":[1,3,1],"314":[2,1,3],"315":[2,2,3],"316":[1,4,11],"317":[1,4,13],"318":[1,4,15],"319":[2,2,2],"320":[1,4,9],"321":[1,4,22],"322":[1,4,15],"323":[1,2,8],"324":[1,1,44],"325":[2,1,1],"326":[1,2,98],"327":[2,1,1],"328":[2,2,9],"329":[1,4,8],"330":[1,4,16],"331":[1,1,1],"332":[5,1,1],"333":[1,6,6],"334":[1,1,1],"335":[1,1,2],"336":[3,1,6],"337":[1,3,7],"338":[1,3,4],"339":[1,3,33],"340":[1,3,2],"341":[1,3,6],"342":[1,3,10],"343":[1,3,10],"344":[1,3,12],"345":[1,3,64],"346":[2,1,2],"347":[1,2,44],"348":[2,2,12],"349":[1,3,18],"350":[1,3,18],"351":[1,4,13],"352":[1,4,15],"353":[2,3,19],"354":[1,2,25],"355":[1,2,1],"356":[1,2,19],"357":[1,2,18],"358":[1,2,8],"359":[2,2,19],"360":[1,2,7],"361":[1,2,8],"362":[1,2,10],"363":[1,2,11],"364":[1,2,13],"365":[1,2,13],"366":[1,2,11],"367":[1,2,11],"368":[1,2,16],"369":[1,1,11],"370":[1,1,2],"371":[1,2,1],"372":[1,2,1],"373":[2,2,1],"374":[1,2,1],"375":[1,2,1],"376":[1,1,7],"377":[1,1,2],"378":[1,1,5],"379":[1,1,9],"380":[1,2,52],"381":[1,2,15],"382":[1,2,16],"383":[1,1,3],"384":[1,1,4],"385":[1,1,2],"386":[1,1,4],"387":[1,1,2],"388":[1,1,4],"389":[1,1,4],"390":[1,1,4],"391":[1,1,5],"392":[1,1,3],"393":[1,1,9],"394":[1,1,10],"395":[1,1,12],"396":[1,1,17],"397":[1,1,4],"398":[1,1,1],"399":[1,2,20],"400":[2,2,11],"401":[1,1,4],"402":[1,1,45],"403":[1,2,8],"404":[2,1,11],"405":[1,1,15],"406":[2,1,7],"407":[4,3,2],"408":[4,3,5],"409":[4,3,5],"410":[4,3,5],"411":[4,3,4],"412":[4,3,2],"413":[4,3,5],"414":[4,3,5],"415":[1,3,2],"416":[1,1,13],"417":[2,2,3],"418":[1,1,1],"419":[2,2,45],"420":[1,1,7],"421":[3,1,26],"422":[3,1,52],"423":[1,1,23],"424":[1,2,61],"425":[2,2,29],"426":[1,1,1],"427":[1,1,28],"428":[2,1,163],"429":[1,3,84],"430":[1,3,3],"431":[3,3,1],"432":[2,1,19],"433":[1,1,52],"434":[2,1,6],"435":[2,2,2],"436":[2,2,2],"437":[2,2,1],"438":[1,3,2],"439":[1,3,16],"440":[2,2,33],"441":[2,3,8],"442":[2,3,7],"443":[2,3,8],"444":[2,3,10],"445":[2,3,4],"446":[1,3,37],"447":[2,2,8],"448":[1,1,1],"449":[1,1,1],"450":[2,1,7],"451":[1,2,2],"452":[1,2,6],"453":[1,2,6],"454":[3,3,9],"455":[1,2,4],"456":[1,2,5],"457":[1,2,4],"458":[1,2,3],"459":[1,2,16],"460":[1,2,4],"461":[1,2,41],"462":[1,1,1],"463":[1,1,16],"464":[1,1,16],"465":[1,1,15],"466":[1,1,22],"467":[2,1,9],"468":[1,1,1],"469":[1,1,5],"470":[2,1,5],"471":[1,2,12],"472":[1,2,4],"473":[1,2,4],"474":[1,2,8],"475":[1,2,11],"476":[1,2,26],"477":[1,2,12],"478":[3,1,14],"479":[1,4,9],"480":[1,4,47],"481":[1,4,29],"482":[1,4,13],"483":[1,4,11],"484":[1,1,1],"485":[1,1,9],"486":[1,1,4],"487":[1,1,21],"488":[1,1,7],"489":[1,2,16],"490":[1,2,35],"491":[1,2,9],"492":[2,2,1],"493":[5,4,12],"494":[1,2,45],"495":[2,1,1],"496":[1,2,8],"497":[1,3,5],"498":[1,3,4],"499":[3,2,6],"500":[2,1,7],"501":[1,2,11],"502":[2,3,3],"503":[3,3,6],"504":[4,3,6],"505":[4,3,4],"506":[1,2,5],"507":[2,3,3],"508":[2,3,8],"509":[2,3,5],"510":[6,3,3],"511":[3,3,9],"512":[3,3,6],"513":[4,3,5],"514":[4,3,3],"515":[4,3,2],"516":[4,3,2],"517":[1,2,6],"518":[3,3,3],"519":[3,3,5],"520":[4,3,2],"521":[3,3,14],"522":[3,3,11],"523":[3,3,2],"524":[3,3,2],"525":[3,3,5],"526":[4,3,4],"527":[1,2,2],"528":[3,3,4],"529":[3,3,4],"530":[3,3,4],"531":[2,3,5],"532":[3,3,4],"533":[4,3,2],"534":[3,3,4],"535":[5,3,2],"536":[3,3,2],"537":[4,3,3],"538":[1,2,3],"539":[4,3,3],"540":[3,3,4],"541":[3,3,3],"542":[3,3,4],"543":[3,3,3],"544":[4,3,5],"545":[1,1,16],"546":[1,1,14],"547":[1,1,11],"548":[1,2,29],"549":[1,2,7],"550":[1,1,20],"551":[1,1,14],"552":[2,1,11],"553":[1,2,10],"554":[1,3,13],"555":[1,3,9],"556":[1,2,8],"557":[1,3,4],"558":[1,3,5],"559":[3,2,19],"560":[1,5,11],"561":[1,5,7],"562":[2,2,6],"563":[1,4,17],"564":[1,4,17],"565":[2,4,8],"566":[1,4,16],"567":[1,4,9],"568":[1,2,35],"569":[1,1,11],"570":[2,1,2],"571":[4,1,9],"572":[1,1,7],"573":[2,1,1],"574":[1,2,8],"575":[3,3,65],"576":[1,3,9],"577":[1,2,11],"578":[1,3,5],"579":[2,2,6],"580":[2,2,15],"581":[1,4,5],"582":[1,2,14],"583":[1,3,33],"584":[1,1,3],"585":[1,1,6],"586":[1,1,22],"587":[1,1,13],"588":[2,1,1],"589":[3,2,7],"590":[2,4,21],"591":[4,4,15],"592":[2,4,23],"593":[2,4,18],"594":[6,4,32],"595":[1,4,22],"596":[3,1,3],"597":[1,3,3],"598":[2,3,8],"599":[1,3,22],"600":[3,3,12],"601":[1,3,3],"602":[1,3,14],"603":[2,3,6],"604":[2,1,1],"605":[1,2,2],"606":[2,2,2],"607":[1,2,2],"608":[1,2,5],"609":[1,2,3],"610":[1,2,1],"611":[1,3,2],"612":[1,3,2],"613":[1,3,2],"614":[2,3,2],"615":[1,3,2],"616":[1,3,9],"617":[2,2,1],"618":[2,4,28],"619":[2,4,2],"620":[2,4,4],"621":[2,4,2],"622":[2,4,2],"623":[3,4,2],"624":[3,4,2],"625":[2,4,2],"626":[2,4,4],"627":[2,1,8],"628":[2,2,8],"629":[2,2,5],"630":[1,4,11],"631":[2,1,1],"632":[1,2,9],"633":[1,2,16],"634":[1,2,3],"635":[1,2,57],"636":[1,1,4],"637":[1,1,13],"638":[1,1,14],"639":[2,1,7],"640":[1,3,21],"641":[2,3,24],"642":[3,1,3],"643":[1,1,20],"644":[1,1,20],"645":[1,1,1],"646":[1,2,19],"647":[2,2,22],"648":[1,2,10],"649":[3,2,10],"650":[2,2,13],"651":[2,2,13],"652":[1,1,3],"653":[1,1,8],"654":[1,1,8],"655":[2,1,26],"656":[1,1,7],"657":[1,2,4],"658":[1,2,10],"659":[1,2,7],"660":[1,2,11],"661":[1,2,11],"662":[1,1,3],"663":[3,1,7],"664":[1,1,21],"665":[1,1,1],"666":[4,2,126],"667":[1,1,29],"668":[3,1,64],"669":[1,1,109],"670":[1,1,29],"671":[1,1,40],"672":[2,1,51],"673":[5,1,1],"674":[1,5,10],"675":[1,5,30],"676":[1,5,4],"677":[3,5,20],"678":[2,5,16],"679":[3,5,16],"680":[4,5,21],"681":[1,5,19],"682":[1,5,27],"683":[2,5,35],"684":[2,5,20],"685":[1,1,4],"686":[1,1,2],"687":[1,1,2],"688":[3,1,8],"689":[1,1,12],"690":[1,1,2],"691":[1,1,2],"692":[1,1,2],"693":[3,1,14],"694":[1,1,13],"695":[2,1,3],"696":[1,1,2],"697":[3,1,2],"698":[3,1,14],"699":[1,1,1],"700":[3,1,1],"701":[1,3,48],"702":[3,1,6],"703":[2,1,12],"704":[1,2,3],"705":[1,2,3],"706":[1,2,10],"707":[1,2,2],"708":[1,2,2],"709":[1,2,2],"710":[2,1,1],"711":[1,2,3],"712":[1,3,22],"713":[1,3,29],"714":[2,1,1],"715":[2,2,60],"716":[2,2,42],"717":[2,2,86],"718":[2,2,201],"719":[2,1,8],"720":[2,2,2],"721":[2,2,1],"722":[3,2,1],"723":[5,2,16],"724":[2,1,6],"725":[3,2,13],"726":[1,2,6],"727":[1,2,1],"728":[1,3,15],"729":[1,3,17],"730":[3,2,44],"731":[3,2,5],"732":[5,2,4],"733":[3,2,33],"734":[2,1,2],"735":[2,2,10],"736":[1,4,18],"737":[1,4,32],"738":[2,2,9],"739":[1,4,10],"740":[1,4,6],"741":[1,4,9],"742":[1,4,15],"743":[1,4,6],"744":[1,2,14],"745":[1,1,1],"746":[1,1,15],"747":[1,1,1],"748":[1,1,14],"749":[1,1,3],"750":[2,2,22],"751":[4,2,58],"752":[2,2,31],"753":[4,2,35],"754":[3,2,30],"755":[2,2,37],"756":[2,2,10],"757":[1,3,20],"758":[2,3,15],"759":[1,3,4],"760":[1,1,3],"761":[1,1,90],"762":[1,1,90],"763":[2,1,26],"764":[1,1,35],"765":[2,1,7],"766":[1,2,20],"767":[1,2,5],"768":[2,3,6],"769":[1,3,9],"770":[1,3,24],"771":[1,2,8],"772":[1,3,7],"773":[1,3,8],"774":[1,3,5],"775":[1,4,28],"776":[1,4,25],"777":[1,4,16],"778":[1,3,1],"779":[1,3,1],"780":[1,3,4],"781":[2,1,1],"782":[1,2,1],"783":[1,3,2],"784":[1,3,3],"785":[1,3,3],"786":[1,3,8],"787":[1,3,5],"788":[1,2,16],"789":[1,3,2],"790":[1,3,3],"791":[1,3,3],"792":[3,2,1],"793":[1,4,3],"794":[1,4,10],"795":[1,4,10],"796":[2,1,15],"797":[1,2,39],"798":[2,2,1],"799":[1,3,7],"800":[1,3,4],"801":[1,4,25],"802":[1,4,27],"803":[1,4,30],"804":[2,4,21],"805":[1,3,8],"806":[1,4,56],"807":[1,3,1],"808":[2,4,20],"809":[1,4,14],"810":[1,4,35],"811":[2,3,7],"812":[3,1,16],"813":[1,3,4],"814":[1,3,29],"815":[2,3,99],"816":[1,1,2],"817":[2,1,1],"818":[1,2,1],"819":[4,3,53],"820":[4,3,40],"821":[2,2,17],"822":[3,2,10],"823":[2,2,2],"824":[2,2,34],"825":[2,2,12],"826":[3,2,12],"827":[4,2,15],"828":[2,2,19],"829":[5,4,8],"830":[4,4,6],"831":[2,1,4],"832":[2,2,57],"833":[1,1,6],"834":[1,1,1],"835":[1,1,20],"836":[2,1,1],"837":[2,2,62],"838":[2,2,59],"839":[1,2,10],"840":[7,3,10],"841":[2,3,18],"842":[3,3,25],"843":[2,3,33],"844":[2,3,26],"845":[2,2,2],"846":[3,4,11],"847":[2,4,12],"848":[3,4,32],"849":[2,4,29],"850":[2,4,54],"851":[1,4,6],"852":[1,2,48],"853":[3,2,20],"854":[3,2,47],"855":[2,1,1],"856":[4,2,1],"857":[1,6,138],"858":[1,6,28],"859":[2,2,76],"860":[1,2,79],"861":[1,2,34],"862":[2,2,20],"863":[4,2,26],"864":[1,2,57],"865":[1,2,45],"866":[1,2,70],"867":[2,1,5],"868":[1,2,6],"869":[1,2,7],"870":[3,3,41],"871":[1,2,21],"872":[5,2,28],"873":[2,2,1],"874":[1,4,30],"875":[1,1,1],"876":[1,1,77],"877":[1,1,47],"878":[1,1,1]},"averageFieldLength":[1.6177474402730367,2.321956769055743,15.731513083048911],"storedFields":{"0":{"title":"大 O 表示法","titles":[]},"1":{"title":"时间复杂度","titles":["大 O 表示法"]},"2":{"title":"空间复杂度","titles":["大 O 表示法"]},"3":{"title":"位运算","titles":[]},"4":{"title":"常用的位运算操作","titles":["位运算"]},"5":{"title":"复杂的位运算操作","titles":["位运算"]},"6":{"title":"红黑树","titles":[]},"7":{"title":"特点","titles":["红黑树"]},"8":{"title":"实现","titles":["红黑树"]},"9":{"title":"开启之路","titles":[]},"10":{"title":"数据结构辅助记忆","titles":[]},"11":{"title":"常见的数据结构","titles":["数据结构辅助记忆"]},"12":{"title":"堆","titles":["数据结构辅助记忆","常见的数据结构"]},"13":{"title":"Hash 表","titles":["数据结构辅助记忆","常见的数据结构"]},"14":{"title":"字典树","titles":["数据结构辅助记忆","常见的数据结构"]},"15":{"title":"图","titles":["数据结构辅助记忆","常见的数据结构"]},"16":{"title":"探测环","titles":["数据结构辅助记忆","常见的数据结构","图"]},"17":{"title":"Disjoin Set","titles":["数据结构辅助记忆","常见的数据结构"]},"18":{"title":"链表","titles":["数据结构辅助记忆","常见的数据结构"]},"19":{"title":"链表倒转","titles":["数据结构辅助记忆","常见的数据结构","链表"]},"20":{"title":"树","titles":["数据结构辅助记忆","常见的数据结构"]},"21":{"title":"注意点","titles":["数据结构辅助记忆","常见的数据结构","树"]},"22":{"title":"架构","titles":[]},"23":{"title":"A-YZ","titles":[]},"24":{"title":"UI 自动化","titles":["A-YZ",null]},"25":{"title":"接口测试","titles":["A-YZ",null]},"26":{"title":"单元测试","titles":["A-YZ",null]},"27":{"title":"基础库变更报警","titles":["A-YZ",null]},"28":{"title":"sentry 报警","titles":["A-YZ",null]},"29":{"title":"业务报警","titles":["A-YZ",null]},"30":{"title":"约定规范","titles":["A-YZ",null]},"31":{"title":"组件化与模块化设计","titles":[]},"32":{"title":"模块化设计","titles":["组件化与模块化设计"]},"33":{"title":"应用的模块与层级划分","titles":["组件化与模块化设计","模块化设计"]},"34":{"title":"模块划分与设计原则","titles":["组件化与模块化设计","模块化设计"]},"35":{"title":"如何进行模块间依赖的解耦","titles":["组件化与模块化设计","模块化设计"]},"36":{"title":"组件化设计","titles":["组件化与模块化设计"]},"37":{"title":"组件划分","titles":["组件化与模块化设计","组件化设计"]},"38":{"title":"组件封装","titles":["组件化与模块化设计","组件化设计"]},"39":{"title":"前端监控体系","titles":[]},"40":{"title":"为什么","titles":["前端监控体系"]},"41":{"title":"监控内容","titles":["前端监控体系"]},"42":{"title":"数据埋点与收集","titles":["前端监控体系"]},"43":{"title":"系统生命周期","titles":["前端监控体系","数据埋点与收集"]},"44":{"title":"系统异常","titles":["前端监控体系","数据埋点与收集"]},"45":{"title":"用户日志","titles":["前端监控体系","数据埋点与收集"]},"46":{"title":"数据上报","titles":["前端监控体系","数据埋点与收集"]},"47":{"title":"数据监控","titles":["前端监控体系","数据埋点与收集"]},"48":{"title":"前端性能优化","titles":[]},"49":{"title":"时间角度","titles":["前端性能优化"]},"50":{"title":"网络请求优化","titles":["前端性能优化","时间角度"]},"51":{"title":"首屏加载优化","titles":["前端性能优化","时间角度"]},"52":{"title":"渲染过程优化","titles":["前端性能优化","时间角度"]},"53":{"title":"计算/逻辑提速","titles":["前端性能优化","时间角度"]},"54":{"title":"空间角度","titles":["前端性能优化"]},"55":{"title":"降低资源占用","titles":["前端性能优化","空间角度"]},"56":{"title":"性能数据","titles":["前端性能优化"]},"57":{"title":"项目设计","titles":[]},"58":{"title":"技术方案设计与选型","titles":["项目设计"]},"59":{"title":"技术选型的影响因素","titles":["项目设计","技术方案设计与选型"]},"60":{"title":"多人协作与团队规范","titles":["项目设计","技术方案设计与选型"]},"61":{"title":"前端工程化","titles":["项目设计"]},"62":{"title":"大型项目痛点","titles":["项目设计"]},"63":{"title":"模块耦合严重","titles":["项目设计","大型项目痛点"]},"64":{"title":"项目复杂熟悉成本过高","titles":["项目设计","大型项目痛点"]},"65":{"title":"项目代码量过大","titles":["项目设计","大型项目痛点"]},"66":{"title":"问题定位效率低","titles":["项目设计","大型项目痛点"]},"67":{"title":"项目前期准备与复盘","titles":["项目设计"]},"68":{"title":"XSS","titles":[]},"69":{"title":"类型","titles":["XSS"]},"70":{"title":"反射型","titles":["XSS","类型"]},"71":{"title":"存储型","titles":["XSS","类型"]},"72":{"title":"DOM 跨站","titles":["XSS","类型"]},"73":{"title":"防抖节流","titles":[]},"74":{"title":"防抖","titles":["防抖节流"]},"75":{"title":"正常防抖","titles":["防抖节流","防抖"]},"76":{"title":"代码实现","titles":["防抖节流","防抖","正常防抖"]},"77":{"title":"lodash 类似实现用法","titles":["防抖节流","防抖","正常防抖"]},"78":{"title":"立即执行防抖函数I","titles":["防抖节流","防抖"]},"79":{"title":"代码执行","titles":["防抖节流","防抖","立即执行防抖函数I"]},"80":{"title":"lodash 类似实现用法","titles":["防抖节流","防抖","立即执行防抖函数I"]},"81":{"title":"立即执行防抖函数II","titles":["防抖节流","防抖"]},"82":{"title":"代码实现","titles":["防抖节流","防抖","立即执行防抖函数II"]},"83":{"title":"lodash 类似实现用法","titles":["防抖节流","防抖","立即执行防抖函数II"]},"84":{"title":"节流","titles":["防抖节流"]},"85":{"title":"节流非定时器版","titles":["防抖节流","节流"]},"86":{"title":"代码实现","titles":["防抖节流","节流","节流非定时器版"]},"87":{"title":"lodash 类似实现用法","titles":["防抖节流","节流","节流非定时器版"]},"88":{"title":"节流定时器版","titles":["防抖节流","节流"]},"89":{"title":"代码实现","titles":["防抖节流","节流","节流定时器版"]},"90":{"title":"lodash 类似实现用法","titles":["防抖节流","节流","节流定时器版"]},"91":{"title":"节流最终执行","titles":["防抖节流","节流"]},"92":{"title":"代码实现","titles":["防抖节流","节流","节流最终执行"]},"93":{"title":"lodash 类似实现用法","titles":["防抖节流","节流","节流最终执行"]},"94":{"title":"lodash 实现","titles":["防抖节流"]},"95":{"title":"lodash 的参数","titles":["防抖节流","lodash 实现"]},"96":{"title":"lodash debounce 默认调用","titles":["防抖节流","lodash 实现"]},"97":{"title":"lodash throttle 默认调用","titles":["防抖节流","lodash 实现"]},"98":{"title":"源码实现","titles":["防抖节流","lodash 实现"]},"99":{"title":"实现一个简易热更新","titles":[]},"100":{"title":"实现思考？","titles":["实现一个简易热更新"]},"101":{"title":"思考一","titles":["实现一个简易热更新","实现思考？"]},"102":{"title":"解答","titles":["实现一个简易热更新","实现思考？","思考一"]},"103":{"title":"思考二","titles":["实现一个简易热更新","实现思考？"]},"104":{"title":"解答","titles":["实现一个简易热更新","实现思考？","思考二"]},"105":{"title":"思考三","titles":["实现一个简易热更新","实现思考？"]},"106":{"title":"解答","titles":["实现一个简易热更新","实现思考？","思考三"]},"107":{"title":"环境准备","titles":["实现一个简易热更新"]},"108":{"title":"目录搭建","titles":["实现一个简易热更新"]},"109":{"title":"项目启动","titles":["实现一个简易热更新"]},"110":{"title":"前端文档","titles":[]},"111":{"title":"前端文档浅思考","titles":["前端文档"]},"112":{"title":"富文本编辑","titles":["前端文档","前端文档浅思考"]},"113":{"title":"操作富文本","titles":["前端文档","前端文档浅思考","富文本编辑"]},"114":{"title":"富文本选区","titles":["前端文档","前端文档浅思考","富文本编辑"]},"115":{"title":"操作范围 DOM2","titles":["前端文档","前端文档浅思考","富文本编辑"]},"116":{"title":"复合事件","titles":["前端文档","前端文档浅思考","富文本编辑"]},"117":{"title":"前端文档深思考","titles":["前端文档"]},"118":{"title":"同构表VS异构表","titles":["前端文档","前端文档深思考"]},"119":{"title":"文档技术","titles":["前端文档","前端文档深思考"]},"120":{"title":"在线协同","titles":["前端文档","前端文档深思考"]},"121":{"title":"前端文档应用","titles":["前端文档"]},"122":{"title":"钉钉","titles":["前端文档","前端文档应用"]},"123":{"title":"语雀","titles":["前端文档","前端文档应用"]},"124":{"title":"前端文档性能","titles":["前端文档"]},"125":{"title":"大数据","titles":["前端文档","前端文档性能"]},"126":{"title":"最大单元格数","titles":["前端文档","前端文档性能"]},"127":{"title":"前端文档展望","titles":["前端文档"]},"128":{"title":"\\b复杂度","titles":["前端文档","前端文档展望"]},"129":{"title":"未来","titles":["前端文档","前端文档展望"]},"130":{"title":"HtmlWepbackPlugin 源码分析","titles":[]},"131":{"title":"简易的写一个 HWP 插件","titles":["HtmlWepbackPlugin 源码分析"]},"132":{"title":"简易实现问题","titles":["HtmlWepbackPlugin 源码分析","简易的写一个 HWP 插件"]},"133":{"title":"HWP 源码实现","titles":["HtmlWepbackPlugin 源码分析"]},"134":{"title":"Webpack 配置","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现"]},"135":{"title":"写一个 Webpack 插件","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现"]},"136":{"title":"使用到的 webpack compiler","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现"]},"137":{"title":"compiler.hooks.thisCompilation","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现","使用到的 webpack compiler"]},"138":{"title":"compiler.hooks.make","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现","使用到的 webpack compiler"]},"139":{"title":"compiler.hooks.emit","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现","使用到的 webpack compiler"]},"140":{"title":"HWP 创建一个子解析器 childCompiler","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现"]},"141":{"title":"CreateChildCompiler","titles":["HtmlWepbackPlugin 源码分析","HWP 源码实现","HWP 创建一个子解析器 childCompiler"]},"142":{"title":"动手实现一个 HWP 插件","titles":["HtmlWepbackPlugin 源码分析"]},"143":{"title":"创建 childCompiler","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件"]},"144":{"title":"index.html 解析器 loader","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件"]},"145":{"title":"开始注入 js css favicon 文件","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件"]},"146":{"title":"title 如何注入到 index.html 中","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件"]},"147":{"title":"NodeJS VM 模块","titles":["HtmlWepbackPlugin 源码分析","动手实现一个 HWP 插件","title 如何注入到 index.html 中"]},"148":{"title":"你不知道的 JS","titles":[]},"149":{"title":"matchMedia","titles":["你不知道的 JS"]},"150":{"title":"MutationObserver","titles":[]},"151":{"title":"概念","titles":["MutationObserver"]},"152":{"title":"兼容性","titles":["MutationObserver"]},"153":{"title":"用法","titles":["MutationObserver"]},"154":{"title":"API","titles":["MutationObserver"]},"155":{"title":"observe 方法","titles":["MutationObserver","API"]},"156":{"title":"callback mutation records 回调参数属性分析","titles":["MutationObserver","API"]},"157":{"title":"disconnect 关闭连接","titles":["MutationObserver","API"]},"158":{"title":"Multi MutaintionObserver(多监听改变)","titles":["MutationObserver","API"]},"159":{"title":"重新使用 MutationObserver 实例","titles":["MutationObserver","API"]},"160":{"title":"observe 方法第二个参数对象有哪些属性","titles":["MutationObserver","API"]},"161":{"title":"MutationObserver 设计规范","titles":["MutationObserver","API"]},"162":{"title":"异步回调和记录队列","titles":["MutationObserver","API","MutationObserver 设计规范"]},"163":{"title":"takeRecords() 方法","titles":["MutationObserver","API","MutationObserver 设计规范"]},"164":{"title":"性能分析","titles":["MutationObserver","API","MutationObserver 设计规范"]},"165":{"title":"CSSJS 动画那些事","titles":[]},"166":{"title":"回流与重绘","titles":["CSSJS 动画那些事"]},"167":{"title":"CSS 动画","titles":["CSSJS 动画那些事"]},"168":{"title":"JS 动画","titles":["CSSJS 动画那些事"]},"169":{"title":"V8","titles":[]},"170":{"title":"解释器和执行器","titles":["V8"]},"171":{"title":"V8 执行代码","titles":["V8"]},"172":{"title":"生成抽象语法树和执行上下文","titles":["V8","V8 执行代码"]},"173":{"title":"生成字节码","titles":["V8","V8 执行代码"]},"174":{"title":"执行代码","titles":["V8","V8 执行代码"]},"175":{"title":"垃圾回收","titles":["V8"]},"176":{"title":"栈空间","titles":["V8","垃圾回收"]},"177":{"title":"堆空间","titles":["V8","垃圾回收"]},"178":{"title":"堆空间的垃圾回收","titles":["V8","垃圾回收"]},"179":{"title":"新生代","titles":["V8","垃圾回收"]},"180":{"title":"老生代","titles":["V8","垃圾回收"]},"181":{"title":"垃圾回收流程","titles":["V8","垃圾回收"]},"182":{"title":"副垃圾回收器","titles":["V8","垃圾回收"]},"183":{"title":"主垃圾回收器","titles":["V8","垃圾回收"]},"184":{"title":"全停顿","titles":["V8","垃圾回收"]},"185":{"title":"增量标记","titles":["V8","垃圾回收"]},"186":{"title":"PC虚拟列表如何处理","titles":[]},"187":{"title":"常见解决方案","titles":["PC虚拟列表如何处理"]},"188":{"title":"IScroll 方案 (使用 transform 或者 top)","titles":["PC虚拟列表如何处理"]},"189":{"title":"react-window 解决方案","titles":["PC虚拟列表如何处理"]},"190":{"title":"高度固定","titles":["PC虚拟列表如何处理","react-window 解决方案"]},"191":{"title":"高度改变","titles":["PC虚拟列表如何处理","react-window 解决方案"]},"192":{"title":"写在最后","titles":["PC虚拟列表如何处理"]},"193":{"title":"JS 如何实现复制","titles":[]},"194":{"title":"document.execCommand","titles":["JS 如何实现复制"]},"195":{"title":"实现","titles":["JS 如何实现复制","document.execCommand"]},"196":{"title":"Clipboard API","titles":["JS 如何实现复制"]},"197":{"title":"ClipboardEvent","titles":["JS 如何实现复制","Clipboard API"]},"198":{"title":"ClipboardItem","titles":["JS 如何实现复制","Clipboard API"]},"199":{"title":"navigator.clipboard","titles":["JS 如何实现复制","Clipboard API"]},"200":{"title":"write","titles":["JS 如何实现复制","Clipboard API","navigator.clipboard"]},"201":{"title":"writeText","titles":["JS 如何实现复制","Clipboard API","navigator.clipboard"]},"202":{"title":"read","titles":["JS 如何实现复制","Clipboard API","navigator.clipboard"]},"203":{"title":"readText","titles":["JS 如何实现复制","Clipboard API","navigator.clipboard"]},"204":{"title":"扩展","titles":["JS 如何实现复制"]},"205":{"title":"mime type","titles":["JS 如何实现复制","扩展"]},"206":{"title":"Blob","titles":["JS 如何实现复制","扩展"]},"207":{"title":"颜色值变换","titles":[]},"208":{"title":"十六进制转换成 RGB","titles":["颜色值变换"]},"209":{"title":"RGB 转换成十六进制","titles":["颜色值变换"]},"210":{"title":"HSL 转换成 RGB","titles":["颜色值变换"]},"211":{"title":"RGB 转换成 HSL","titles":["颜色值变换"]},"212":{"title":"DOM BOM 事件流","titles":[]},"213":{"title":"事件冒泡","titles":["DOM BOM 事件流"]},"214":{"title":"事件捕获","titles":["DOM BOM 事件流"]},"215":{"title":"事件处理程序","titles":["DOM BOM 事件流"]},"216":{"title":"HTML 事件处理程序","titles":["DOM BOM 事件流","事件处理程序"]},"217":{"title":"DOM0 级事件处理程序","titles":["DOM BOM 事件流","事件处理程序"]},"218":{"title":"DOM2 级事件处理程序","titles":["DOM BOM 事件流","事件处理程序"]},"219":{"title":"IE 事件处理程序","titles":["DOM BOM 事件流","事件处理程序"]},"220":{"title":"事件对象","titles":["DOM BOM 事件流"]},"221":{"title":"DOM 事件对象","titles":["DOM BOM 事件流","事件对象"]},"222":{"title":"IE 事件对象","titles":["DOM BOM 事件流","事件对象"]},"223":{"title":"事件对象","titles":["DOM BOM 事件流"]},"224":{"title":"UI事件","titles":["DOM BOM 事件流","事件对象"]},"225":{"title":"焦点事件","titles":["DOM BOM 事件流","事件对象"]},"226":{"title":"鼠标与滚轮事件","titles":["DOM BOM 事件流","事件对象"]},"227":{"title":"键盘与文本事件","titles":["DOM BOM 事件流","事件对象"]},"228":{"title":"复合事件","titles":["DOM BOM 事件流","事件对象"]},"229":{"title":"变动事件","titles":["DOM BOM 事件流","事件对象"]},"230":{"title":"HTML5事件","titles":["DOM BOM 事件流","事件对象"]},"231":{"title":"pageshow 和 pagehide 事件","titles":["DOM BOM 事件流","事件对象"]},"232":{"title":"hashchange","titles":["DOM BOM 事件流","事件对象"]},"233":{"title":"设备事件","titles":["DOM BOM 事件流","事件对象"]},"234":{"title":"触摸与手势事件","titles":["DOM BOM 事件流","事件对象"]},"235":{"title":"ESLint","titles":[]},"236":{"title":"配置","titles":["ESLint"]},"237":{"title":"指定解析选项","titles":["ESLint"]},"238":{"title":"指定解析","titles":["ESLint"]},"239":{"title":"指定预处理器 processor","titles":["ESLint"]},"240":{"title":"指定解析环境 env","titles":["ESLint"]},"241":{"title":"指定全局环境 globals","titles":["ESLint"]},"242":{"title":"配置插件 plugins","titles":["ESLint"]},"243":{"title":"配置规则 rules","titles":["ESLint"]},"244":{"title":"使用注释规则","titles":["ESLint","配置规则 rules"]},"245":{"title":"配置举例","titles":["ESLint","配置规则 rules"]},"246":{"title":"行内注释","titles":["ESLint","配置规则 rules"]},"247":{"title":"使用 overrides 对指定文件进行规则覆盖","titles":["ESLint","配置规则 rules"]},"248":{"title":"禁止使用 eslint-disable","titles":["ESLint"]},"249":{"title":"共享配置 settings","titles":["ESLint"]},"250":{"title":"配置项目文件结构","titles":["ESLint"]},"251":{"title":"扩展 extends","titles":["ESLint"]},"252":{"title":"配置忽略文件","titles":["ESLint"]},"253":{"title":"CLI","titles":["ESLint"]},"254":{"title":"GIT","titles":[]},"255":{"title":"git rebase","titles":["GIT"]},"256":{"title":"API","titles":["GIT","git rebase"]},"257":{"title":"理解","titles":["GIT","git rebase"]},"258":{"title":"git revert","titles":["GIT"]},"259":{"title":"API","titles":["GIT","git revert"]},"260":{"title":"理解","titles":["GIT","git revert"]},"261":{"title":"git restore","titles":["GIT"]},"262":{"title":"API","titles":["GIT","git restore"]},"263":{"title":"理解","titles":["GIT","git restore"]},"264":{"title":"git reset","titles":["GIT","git restore"]},"265":{"title":"API","titles":["GIT","git restore"]},"266":{"title":"理解","titles":["GIT","git restore"]},"267":{"title":"History API","titles":[]},"268":{"title":"window.history","titles":["History API"]},"269":{"title":"Browser 浏览器路由","titles":["History API"]},"270":{"title":"Hash 哈希路由","titles":["History API"]},"271":{"title":"window.location","titles":["History API"]},"272":{"title":"IEEE 754","titles":[]},"273":{"title":"基本格式","titles":["IEEE 754"]},"274":{"title":"单精度","titles":["IEEE 754","基本格式"]},"275":{"title":"双精度","titles":["IEEE 754","基本格式"]},"276":{"title":"双重扩展","titles":["IEEE 754","基本格式"]},"277":{"title":"四倍精度","titles":["IEEE 754","基本格式"]},"278":{"title":"Decimal64 decimal128","titles":["IEEE 754","基本格式"]},"279":{"title":"半精度","titles":["IEEE 754","基本格式"]},"280":{"title":"浮点数范围","titles":["IEEE 754"]},"281":{"title":"字节序（Endian）","titles":["IEEE 754","浮点数范围"]},"282":{"title":"整数值的精度限制","titles":["IEEE 754","浮点数范围"]},"283":{"title":"内部表示","titles":["IEEE 754"]},"284":{"title":"JavaScript 数表示","titles":["IEEE 754"]},"285":{"title":"进制转换","titles":["IEEE 754"]},"286":{"title":"二进制转换","titles":["IEEE 754","进制转换"]},"287":{"title":"整数","titles":["IEEE 754","进制转换","二进制转换"]},"288":{"title":"小数","titles":["IEEE 754","进制转换","二进制转换"]},"289":{"title":"十六进制转换","titles":["IEEE 754","进制转换"]},"290":{"title":"八进制转换","titles":["IEEE 754","进制转换"]},"291":{"title":"计算机编码方式","titles":["IEEE 754"]},"292":{"title":"原码","titles":["IEEE 754","计算机编码方式"]},"293":{"title":"反码","titles":["IEEE 754","计算机编码方式"]},"294":{"title":"补码","titles":["IEEE 754","计算机编码方式"]},"295":{"title":"0.6 + 0.3 != 0.9","titles":["IEEE 754"]},"296":{"title":"0.6 的二进制","titles":["IEEE 754","0.6 + 0.3 != 0.9"]},"297":{"title":"0.3 的二进制","titles":["IEEE 754","0.6 + 0.3 != 0.9"]},"298":{"title":"指数对齐相加","titles":["IEEE 754","0.6 + 0.3 != 0.9"]},"299":{"title":"解决方法","titles":["IEEE 754","0.6 + 0.3 != 0.9"]},"300":{"title":"前端模块的演变","titles":[]},"301":{"title":"UMD","titles":["前端模块的演变"]},"302":{"title":"AMD","titles":["前端模块的演变"]},"303":{"title":"define 函数","titles":["前端模块的演变","AMD"]},"304":{"title":"require 函数","titles":["前端模块的演变","AMD"]},"305":{"title":"CommonJS","titles":["前端模块的演变"]},"306":{"title":"ESM","titles":["前端模块的演变"]},"307":{"title":"扩展","titles":["前端模块的演变"]},"308":{"title":"SystemJS","titles":["前端模块的演变","扩展"]},"309":{"title":"require.context","titles":["前端模块的演变","扩展"]},"310":{"title":"Script Link 标签","titles":[]},"311":{"title":"defer","titles":["Script Link 标签"]},"312":{"title":"async","titles":["Script Link 标签"]},"313":{"title":"crossorigin","titles":["Script Link 标签"]},"314":{"title":"Linux 链接","titles":[]},"315":{"title":"soft links","titles":["Linux 链接"]},"316":{"title":"定义","titles":["Linux 链接","soft links"]},"317":{"title":"工作","titles":["Linux 链接","soft links"]},"318":{"title":"创建","titles":["Linux 链接","soft links"]},"319":{"title":"hard links","titles":["Linux 链接"]},"320":{"title":"定义","titles":["Linux 链接","hard links"]},"321":{"title":"工作","titles":["Linux 链接","hard links"]},"322":{"title":"创建","titles":["Linux 链接","hard links"]},"323":{"title":"区别","titles":["Linux 链接"]},"324":{"title":"开启写作之旅","titles":[]},"325":{"title":"css 遇到的问题","titles":[]},"326":{"title":"问题一","titles":["css 遇到的问题"]},"327":{"title":"yarn 问题","titles":[]},"328":{"title":"spawn E2BIG","titles":["yarn 问题"]},"329":{"title":"问题描述","titles":["yarn 问题","spawn E2BIG"]},"330":{"title":"问题解决","titles":["yarn 问题","spawn E2BIG"]},"331":{"title":"云服务器ECS","titles":[]},"332":{"title":"阿里云服务器(Elastic Compute Service)","titles":["云服务器ECS"]},"333":{"title":"MAC","titles":["云服务器ECS","阿里云服务器(Elastic Compute Service)"]},"334":{"title":"腾讯云","titles":["云服务器ECS"]},"335":{"title":"文档编辑","titles":[]},"336":{"title":"VuePress &amp; VitePress","titles":[]},"337":{"title":"标题类","titles":["VuePress &amp; VitePress"]},"338":{"title":"标签类","titles":["VuePress &amp; VitePress"]},"339":{"title":"输出类","titles":["VuePress &amp; VitePress"]},"340":{"title":"目录类","titles":["VuePress &amp; VitePress"]},"341":{"title":"链接类","titles":["VuePress &amp; VitePress"]},"342":{"title":"风格类","titles":["VuePress &amp; VitePress"]},"343":{"title":"提示类","titles":["VuePress &amp; VitePress"]},"344":{"title":"表格类","titles":["VuePress &amp; VitePress"]},"345":{"title":"表情类","titles":["VuePress &amp; VitePress"]},"346":{"title":"Chromium 渲染流水线","titles":[]},"347":{"title":"浏览器架构","titles":["Chromium 渲染流水线"]},"348":{"title":"Chromium 进程","titles":["Chromium 渲染流水线"]},"349":{"title":"浏览器进程","titles":["Chromium 渲染流水线","Chromium 进程"]},"350":{"title":"渲染进程","titles":["Chromium 渲染流水线","Chromium 进程"]},"351":{"title":"主线程","titles":["Chromium 渲染流水线","Chromium 进程","渲染进程"]},"352":{"title":"合成线程","titles":["Chromium 渲染流水线","Chromium 进程","渲染进程"]},"353":{"title":"Viz 进程","titles":["Chromium 渲染流水线","Chromium 进程"]},"354":{"title":"进程模式","titles":["Chromium 渲染流水线"]},"355":{"title":"渲染流水线","titles":["Chromium 渲染流水线"]},"356":{"title":"Parsing","titles":["Chromium 渲染流水线","渲染流水线"]},"357":{"title":"Style","titles":["Chromium 渲染流水线","渲染流水线"]},"358":{"title":"Layout","titles":["Chromium 渲染流水线","渲染流水线"]},"359":{"title":"Pre-paint","titles":["Chromium 渲染流水线","渲染流水线"]},"360":{"title":"Paint","titles":["Chromium 渲染流水线","渲染流水线"]},"361":{"title":"Commit","titles":["Chromium 渲染流水线","渲染流水线"]},"362":{"title":"Compositing","titles":["Chromium 渲染流水线","渲染流水线"]},"363":{"title":"Tiling","titles":["Chromium 渲染流水线","渲染流水线"]},"364":{"title":"Raster","titles":["Chromium 渲染流水线","渲染流水线"]},"365":{"title":"Activate","titles":["Chromium 渲染流水线","渲染流水线"]},"366":{"title":"Draw","titles":["Chromium 渲染流水线","渲染流水线"]},"367":{"title":"Aggregate","titles":["Chromium 渲染流水线","渲染流水线"]},"368":{"title":"Display","titles":["Chromium 渲染流水线","渲染流水线"]},"369":{"title":"关键路径渲染","titles":[]},"370":{"title":"浏览器渲染","titles":["关键路径渲染"]},"371":{"title":"DOM","titles":["关键路径渲染","浏览器渲染"]},"372":{"title":"CSSOM","titles":["关键路径渲染","浏览器渲染"]},"373":{"title":"Render Tree","titles":["关键路径渲染","浏览器渲染"]},"374":{"title":"Layout","titles":["关键路径渲染","浏览器渲染"]},"375":{"title":"Paint","titles":["关键路径渲染","浏览器渲染"]},"376":{"title":"优化","titles":["关键路径渲染"]},"377":{"title":"面试","titles":[]},"378":{"title":"性能指标","titles":[]},"379":{"title":"LCP","titles":["性能指标"]},"380":{"title":"如何衡量","titles":["性能指标","LCP"]},"381":{"title":"改进","titles":["性能指标","LCP"]},"382":{"title":"测量工具","titles":["性能指标","LCP"]},"383":{"title":"FP","titles":["性能指标"]},"384":{"title":"FCP","titles":["性能指标"]},"385":{"title":"DCL","titles":["性能指标"]},"386":{"title":"FMP","titles":["性能指标"]},"387":{"title":"L","titles":["性能指标"]},"388":{"title":"TTI","titles":["性能指标"]},"389":{"title":"TBT","titles":["性能指标"]},"390":{"title":"FID","titles":["性能指标"]},"391":{"title":"CLS","titles":["性能指标"]},"392":{"title":"SI","titles":["性能指标"]},"393":{"title":"Cookies","titles":[]},"394":{"title":"读取","titles":["Cookies"]},"395":{"title":"写入","titles":["Cookies"]},"396":{"title":"path","titles":["Cookies"]},"397":{"title":"domain","titles":["Cookies"]},"398":{"title":"过期时间","titles":["Cookies"]},"399":{"title":"expires","titles":["Cookies","过期时间"]},"400":{"title":"max-age","titles":["Cookies","过期时间"]},"401":{"title":"secure","titles":["Cookies"]},"402":{"title":"samesite","titles":["Cookies"]},"403":{"title":"httpOnly","titles":["Cookies","samesite"]},"404":{"title":"第三方 cookie","titles":["Cookies"]},"405":{"title":"CORS","titles":[]},"406":{"title":"Cors Headers","titles":["CORS"]},"407":{"title":"Access-Control-Allow-Origin","titles":["CORS","Cors Headers"]},"408":{"title":"Access-Control-Allow-Credentials","titles":["CORS","Cors Headers"]},"409":{"title":"Access-Control-Allow-Headers","titles":["CORS","Cors Headers"]},"410":{"title":"Access-Control-Allow-Methods","titles":["CORS","Cors Headers"]},"411":{"title":"Access-Control-Expose-Headers","titles":["CORS","Cors Headers"]},"412":{"title":"Access-Control-Max-Age","titles":["CORS","Cors Headers"]},"413":{"title":"Access-Control-Request-Headers","titles":["CORS","Cors Headers"]},"414":{"title":"Access-Control-Request-Method","titles":["CORS","Cors Headers"]},"415":{"title":"Origin","titles":["CORS","Cors Headers"]},"416":{"title":"同源策略","titles":["CORS"]},"417":{"title":"document.domain","titles":["CORS","同源策略"]},"418":{"title":"跨域访问的几种方式","titles":["CORS"]},"419":{"title":"window.postMessage","titles":["CORS","跨域访问的几种方式"]},"420":{"title":"DHCP","titles":[]},"421":{"title":"如何配置 IP 地址","titles":["DHCP"]},"422":{"title":"动态主机配置协议（DHCP)","titles":["DHCP"]},"423":{"title":"PXE","titles":["DHCP"]},"424":{"title":"原理","titles":["DHCP","PXE"]},"425":{"title":"PXE 工作过程","titles":["DHCP","PXE"]},"426":{"title":"网络协议","titles":[]},"427":{"title":"常见网络协议","titles":["网络协议"]},"428":{"title":"IP 地址","titles":["网络协议"]},"429":{"title":"IPv4","titles":["网络协议","IP 地址"]},"430":{"title":"IPv6","titles":["网络协议","IP 地址"]},"431":{"title":"IP 地址如何计算广播地址、子网掩码","titles":["网络协议","IP 地址"]},"432":{"title":"MAC 地址","titles":["网络协议"]},"433":{"title":"网络设备的状态标识","titles":["网络协议"]},"434":{"title":"IP 地址","titles":[]},"435":{"title":"IP 协议","titles":["IP 地址"]},"436":{"title":"IP 地址","titles":["IP 地址"]},"437":{"title":"IP 地址类型","titles":["IP 地址"]},"438":{"title":"公有地址","titles":["IP 地址","IP 地址类型"]},"439":{"title":"私有地址","titles":["IP 地址","IP 地址类型"]},"440":{"title":"IP 地址编址方式","titles":["IP 地址"]},"441":{"title":"A 类地址","titles":["IP 地址","IP 地址编址方式"]},"442":{"title":"B 类地址","titles":["IP 地址","IP 地址编址方式"]},"443":{"title":"C 类地址","titles":["IP 地址","IP 地址编址方式"]},"444":{"title":"D 类地址","titles":["IP 地址","IP 地址编址方式"]},"445":{"title":"E 类地址","titles":["IP 地址","IP 地址编址方式"]},"446":{"title":"特殊的网址","titles":["IP 地址","IP 地址编址方式"]},"447":{"title":"IP 地址的分配","titles":["IP 地址"]},"448":{"title":"网络分层","titles":[]},"449":{"title":"工作过程","titles":["网络分层"]},"450":{"title":"HTTP 请求方法","titles":[]},"451":{"title":"GET","titles":["HTTP 请求方法"]},"452":{"title":"HEAD","titles":["HTTP 请求方法"]},"453":{"title":"POST","titles":["HTTP 请求方法"]},"454":{"title":"请求 body 格式","titles":["HTTP 请求方法","POST"]},"455":{"title":"PUT","titles":["HTTP 请求方法"]},"456":{"title":"DELETE","titles":["HTTP 请求方法"]},"457":{"title":"TRACE","titles":["HTTP 请求方法"]},"458":{"title":"OPTIONS","titles":["HTTP 请求方法"]},"459":{"title":"CONNECT","titles":["HTTP 请求方法"]},"460":{"title":"PATCH","titles":["HTTP 请求方法"]},"461":{"title":"对比","titles":["HTTP 请求方法"]},"462":{"title":"计算机网络名词","titles":[]},"463":{"title":"以太网","titles":["计算机网络名词"]},"464":{"title":"交换机","titles":["计算机网络名词"]},"465":{"title":"网关","titles":["计算机网络名词"]},"466":{"title":"路由器","titles":["计算机网络名词"]},"467":{"title":"MAC 地址","titles":["计算机网络名词"]},"468":{"title":"网络模型","titles":[]},"469":{"title":"网络传输协议","titles":["网络模型"]},"470":{"title":"OSI 网络模型","titles":["网络模型"]},"471":{"title":"应用层","titles":["网络模型","OSI 网络模型"]},"472":{"title":"表达层","titles":["网络模型","OSI 网络模型"]},"473":{"title":"会话层","titles":["网络模型","OSI 网络模型"]},"474":{"title":"传输层","titles":["网络模型","OSI 网络模型"]},"475":{"title":"网络层","titles":["网络模型","OSI 网络模型"]},"476":{"title":"数据链路层","titles":["网络模型","OSI 网络模型"]},"477":{"title":"物理层","titles":["网络模型","OSI 网络模型"]},"478":{"title":"TCP/IP 协议","titles":["网络模型"]},"479":{"title":"链路层","titles":["网络模型","TCP/IP 协议"]},"480":{"title":"网络层","titles":["网络模型","TCP/IP 协议"]},"481":{"title":"传输层","titles":["网络模型","TCP/IP 协议"]},"482":{"title":"应用层","titles":["网络模型","TCP/IP 协议"]},"483":{"title":"缺陷","titles":["网络模型","TCP/IP 协议"]},"484":{"title":"Socket","titles":[]},"485":{"title":"Socket","titles":["Socket"]},"486":{"title":"表示方法","titles":["Socket","Socket"]},"487":{"title":"连接","titles":["Socket","Socket"]},"488":{"title":"WebSocket","titles":["Socket"]},"489":{"title":"优点","titles":["Socket","WebSocket"]},"490":{"title":"建立连接","titles":["Socket","WebSocket"]},"491":{"title":"连接保持+心跳","titles":["Socket","WebSocket"]},"492":{"title":"响应头/请求头","titles":["Socket","WebSocket"]},"493":{"title":"Sec-WebSocket-Key/Sec-Websocket-Accept","titles":["Socket","WebSocket","响应头/请求头"]},"494":{"title":"遇到的一些问题","titles":["Socket","WebSocket"]},"495":{"title":"http 特殊地址","titles":[]},"496":{"title":"0.0.0.0","titles":["http 特殊地址"]},"497":{"title":"服务器","titles":["http 特殊地址","0.0.0.0"]},"498":{"title":"客户端","titles":["http 特殊地址","0.0.0.0"]},"499":{"title":"127.0.0.1","titles":["http 特殊地址"]},"500":{"title":"HTTP 状态码","titles":[]},"501":{"title":"1xx","titles":["HTTP 状态码"]},"502":{"title":"100 Continue","titles":["HTTP 状态码","1xx"]},"503":{"title":"101 Switching Protocols","titles":["HTTP 状态码","1xx"]},"504":{"title":"102 Processing （WebDav）- RFC","titles":["HTTP 状态码","1xx"]},"505":{"title":"103 Early Hints - RFC","titles":["HTTP 状态码","1xx"]},"506":{"title":"2xx","titles":["HTTP 状态码"]},"507":{"title":"200 OK","titles":["HTTP 状态码","2xx"]},"508":{"title":"201 Created","titles":["HTTP 状态码","2xx"]},"509":{"title":"202 Accepted","titles":["HTTP 状态码","2xx"]},"510":{"title":"203 Non-Authroritative Information HTTP/1.1","titles":["HTTP 状态码","2xx"]},"511":{"title":"204 No Content","titles":["HTTP 状态码","2xx"]},"512":{"title":"205 Reset Content","titles":["HTTP 状态码","2xx"]},"513":{"title":"206 Partial Content - RFC","titles":["HTTP 状态码","2xx"]},"514":{"title":"207 Multi-Status - RFC","titles":["HTTP 状态码","2xx"]},"515":{"title":"208 Already Reported - RFC","titles":["HTTP 状态码","2xx"]},"516":{"title":"226 IM Used - RFC","titles":["HTTP 状态码","2xx"]},"517":{"title":"3xx","titles":["HTTP 状态码"]},"518":{"title":"300 Multiple Choices","titles":["HTTP 状态码","3xx"]},"519":{"title":"301 Moved Permanently","titles":["HTTP 状态码","3xx"]},"520":{"title":"302 Found - Moved Temporarily","titles":["HTTP 状态码","3xx"]},"521":{"title":"303 See Other","titles":["HTTP 状态码","3xx"]},"522":{"title":"304 Not Modified","titles":["HTTP 状态码","3xx"]},"523":{"title":"305 Use Proxy","titles":["HTTP 状态码","3xx"]},"524":{"title":"306 Switch Proxy","titles":["HTTP 状态码","3xx"]},"525":{"title":"307 Temporary Redirect","titles":["HTTP 状态码","3xx"]},"526":{"title":"308 Permanent Redirect - RFC","titles":["HTTP 状态码","3xx"]},"527":{"title":"4xx","titles":["HTTP 状态码"]},"528":{"title":"400 Bad Request","titles":["HTTP 状态码","4xx"]},"529":{"title":"401 Unauthorized - RFC","titles":["HTTP 状态码","4xx"]},"530":{"title":"402 Payment Required","titles":["HTTP 状态码","4xx"]},"531":{"title":"403 Forbidden","titles":["HTTP 状态码","4xx"]},"532":{"title":"404 Not Found","titles":["HTTP 状态码","4xx"]},"533":{"title":"405 Method Not Allowed","titles":["HTTP 状态码","4xx"]},"534":{"title":"406 Not Acceptable","titles":["HTTP 状态码","4xx"]},"535":{"title":"407 Proxy Authentication Required - RFC","titles":["HTTP 状态码","4xx"]},"536":{"title":"408 Request Timeout","titles":["HTTP 状态码","4xx"]},"537":{"title":"415 Unsupported Media Type","titles":["HTTP 状态码","4xx"]},"538":{"title":"5xx","titles":["HTTP 状态码"]},"539":{"title":"500 Internal Server Error","titles":["HTTP 状态码","5xx"]},"540":{"title":"501 Not Implemented","titles":["HTTP 状态码","5xx"]},"541":{"title":"502 Bad Gateway","titles":["HTTP 状态码","5xx"]},"542":{"title":"503 Service Unavailable","titles":["HTTP 状态码","5xx"]},"543":{"title":"504 Gateway Timeout","titles":["HTTP 状态码","5xx"]},"544":{"title":"511 Network Authentication Required","titles":["HTTP 状态码","5xx"]},"545":{"title":"子网掩码","titles":[]},"546":{"title":"背景","titles":["子网掩码"]},"547":{"title":"功能","titles":["子网掩码"]},"548":{"title":"声明网络地址与主机地址","titles":["子网掩码","功能"]},"549":{"title":"划分子网","titles":["子网掩码","功能"]},"550":{"title":"变长子网掩码","titles":["子网掩码"]},"551":{"title":"无类别域间路由","titles":["子网掩码"]},"552":{"title":"HTTPS 加密层","titles":[]},"553":{"title":"对称加密","titles":["HTTPS 加密层"]},"554":{"title":"计算密钥","titles":["HTTPS 加密层","对称加密"]},"555":{"title":"缺陷","titles":["HTTPS 加密层","对称加密"]},"556":{"title":"非对称加密","titles":["HTTPS 加密层"]},"557":{"title":"加密数据","titles":["HTTPS 加密层","非对称加密"]},"558":{"title":"缺陷","titles":["HTTPS 加密层","非对称加密"]},"559":{"title":"对称加密 + 非对称加密","titles":["HTTPS 加密层"]},"560":{"title":"加密数据","titles":["HTTPS 加密层","对称加密 + 非对称加密"]},"561":{"title":"安全性","titles":["HTTPS 加密层","对称加密 + 非对称加密"]},"562":{"title":"CA 证书","titles":["HTTPS 加密层"]},"563":{"title":"加密方式","titles":["HTTPS 加密层","CA 证书"]},"564":{"title":"申请数字证书","titles":["HTTPS 加密层","CA 证书"]},"565":{"title":"CA 数字签名","titles":["HTTPS 加密层","CA 证书"]},"566":{"title":"验证数字证书","titles":["HTTPS 加密层","CA 证书"]},"567":{"title":"总结","titles":["HTTPS 加密层","CA 证书"]},"568":{"title":"数字证书拓展","titles":["HTTPS 加密层"]},"569":{"title":"WebRTC","titles":[]},"570":{"title":"UDP DTLS","titles":["WebRTC"]},"571":{"title":"RTP/SRTP RTCP/SRTCP","titles":["WebRTC"]},"572":{"title":"SCTP","titles":["WebRTC"]},"573":{"title":"HTML 格式化上下文","titles":[]},"574":{"title":"BFC","titles":["HTML 格式化上下文"]},"575":{"title":"CSS 属性创建 BFC","titles":["HTML 格式化上下文","BFC"]},"576":{"title":"解决了什么问题","titles":["HTML 格式化上下文","BFC"]},"577":{"title":"IFC","titles":["HTML 格式化上下文"]},"578":{"title":"说明","titles":["HTML 格式化上下文","IFC"]},"579":{"title":"Flow Layout","titles":["HTML 格式化上下文"]},"580":{"title":"Writing Mode","titles":["HTML 格式化上下文"]},"581":{"title":"说明","titles":["HTML 格式化上下文","Writing Mode"]},"582":{"title":"外边距重叠","titles":["HTML 格式化上下文"]},"583":{"title":"情形","titles":["HTML 格式化上下文","外边距重叠"]},"584":{"title":"盒模型","titles":[]},"585":{"title":"基础盒模型","titles":["盒模型"]},"586":{"title":"与盒模型相关的css属性","titles":["盒模型"]},"587":{"title":"视觉格式化模型","titles":["盒模型"]},"588":{"title":"flex 扩展","titles":[]},"589":{"title":"flex &amp; margin","titles":["flex 扩展"]},"590":{"title":"margin: auto","titles":["flex 扩展","flex &amp; margin"]},"591":{"title":"justify-content/align-items","titles":["flex 扩展","flex &amp; margin"]},"592":{"title":"space-between","titles":["flex 扩展","flex &amp; margin"]},"593":{"title":"space-around","titles":["flex 扩展","flex &amp; margin"]},"594":{"title":"align-self: flex-start/flex-end/center","titles":["flex 扩展","flex &amp; margin"]},"595":{"title":"粘性布局","titles":["flex 扩展","flex &amp; margin"]},"596":{"title":"float &amp; clear","titles":[]},"597":{"title":"float","titles":["float &amp; clear"]},"598":{"title":"float 属性取值","titles":["float &amp; clear","float"]},"599":{"title":"是否设置宽度","titles":["float &amp; clear","float"]},"600":{"title":"是否设置 margin-top","titles":["float &amp; clear","float"]},"601":{"title":"clear","titles":["float &amp; clear"]},"602":{"title":"clearfix","titles":["float &amp; clear","clear"]},"603":{"title":"clear 属性取值","titles":["float &amp; clear","clear"]},"604":{"title":"css 选择器","titles":[]},"605":{"title":"元素选择器","titles":["css 选择器"]},"606":{"title":"id 选择器","titles":["css 选择器"]},"607":{"title":"类选择器","titles":["css 选择器"]},"608":{"title":"属性选择器","titles":["css 选择器"]},"609":{"title":"伪类选择器","titles":["css 选择器"]},"610":{"title":"选择器组合","titles":["css 选择器"]},"611":{"title":"*","titles":["css 选择器","选择器组合"]},"612":{"title":"空格","titles":["css 选择器","选择器组合"]},"613":{"title":"+","titles":["css 选择器","选择器组合"]},"614":{"title":"&gt;","titles":["css 选择器","选择器组合"]},"615":{"title":"~","titles":["css 选择器","选择器组合"]},"616":{"title":"||","titles":["css 选择器","选择器组合"]},"617":{"title":"带 @ 符号的选择器","titles":["css 选择器"]},"618":{"title":"@namespace","titles":["css 选择器","带 @ 符号的选择器"]},"619":{"title":"@charset","titles":["css 选择器","带 @ 符号的选择器"]},"620":{"title":"@import","titles":["css 选择器","带 @ 符号的选择器"]},"621":{"title":"@media","titles":["css 选择器","带 @ 符号的选择器"]},"622":{"title":"@page","titles":["css 选择器","带 @ 符号的选择器"]},"623":{"title":"@counter-style","titles":["css 选择器","带 @ 符号的选择器"]},"624":{"title":"@key-frames","titles":["css 选择器","带 @ 符号的选择器"]},"625":{"title":"@fontface","titles":["css 选择器","带 @ 符号的选择器"]},"626":{"title":"@support","titles":["css 选择器","带 @ 符号的选择器"]},"627":{"title":"行内元素 css","titles":[]},"628":{"title":"vertical-align","titles":["行内元素 css"]},"629":{"title":"line-height","titles":["行内元素 css"]},"630":{"title":"取值","titles":["行内元素 css","line-height"]},"631":{"title":"伪元素 伪类","titles":[]},"632":{"title":"伪元素","titles":["伪元素 伪类"]},"633":{"title":"列举","titles":["伪元素 伪类","伪元素"]},"634":{"title":"伪类","titles":["伪元素 伪类"]},"635":{"title":"列举","titles":["伪元素 伪类","伪类"]},"636":{"title":"可替换元素","titles":[]},"637":{"title":"定义","titles":["可替换元素"]},"638":{"title":"替换元素","titles":["可替换元素"]},"639":{"title":"content 属性","titles":["可替换元素"]},"640":{"title":"取值","titles":["可替换元素","content 属性"]},"641":{"title":"counter/counters","titles":["可替换元素","content 属性"]},"642":{"title":"list-style 属性","titles":["可替换元素"]},"643":{"title":"文字特性","titles":[]},"644":{"title":"例子","titles":["文字特性"]},"645":{"title":"解决方式","titles":["文字特性"]},"646":{"title":"压缩方式","titles":["文字特性","解决方式"]},"647":{"title":"margin 方式","titles":["文字特性","解决方式"]},"648":{"title":"忽略闭合标签","titles":["文字特性","解决方式"]},"649":{"title":"font-size 方式","titles":["文字特性","解决方式"]},"650":{"title":"float 方式","titles":["文字特性","解决方式"]},"651":{"title":"flex 布局方式","titles":["文字特性","解决方式"]},"652":{"title":"visibility","titles":[]},"653":{"title":"display","titles":["visibility"]},"654":{"title":"visibility","titles":["visibility"]},"655":{"title":"content-visibility","titles":["visibility"]},"656":{"title":"contain","titles":["visibility"]},"657":{"title":"size","titles":["visibility","contain"]},"658":{"title":"layout","titles":["visibility","contain"]},"659":{"title":"style","titles":["visibility","contain"]},"660":{"title":"paint","titles":["visibility","contain"]},"661":{"title":"组合使用","titles":["visibility","contain"]},"662":{"title":"ES6","titles":[]},"663":{"title":"let &amp; const","titles":["ES6"]},"664":{"title":"解构赋值","titles":["ES6"]},"665":{"title":"正则的扩展","titles":["ES6"]},"666":{"title":"match &amp;&amp; exec &amp;&amp; matchAll","titles":["ES6","正则的扩展"]},"667":{"title":"Symbol","titles":["ES6"]},"668":{"title":"Set &amp;&amp; Map","titles":["ES6"]},"669":{"title":"Generate","titles":["ES6"]},"670":{"title":"Class","titles":["ES6"]},"671":{"title":"ArrayBuffer","titles":["ES6"]},"672":{"title":"CommonJS ES6","titles":["ES6"]},"673":{"title":"浏览器[type=&quot;module&quot;]","titles":[]},"674":{"title":"兼容性","titles":["浏览器[type=&quot;module&quot;]"]},"675":{"title":"基本使用","titles":["浏览器[type=&quot;module&quot;]"]},"676":{"title":"路径支持","titles":["浏览器[type=&quot;module&quot;]"]},"677":{"title":"nomodule &amp;&amp; noscript","titles":["浏览器[type=&quot;module&quot;]"]},"678":{"title":"加载顺序默认为 defer","titles":["浏览器[type=&quot;module&quot;]"]},"679":{"title":"module 行内执行顺序 defer","titles":["浏览器[type=&quot;module&quot;]"]},"680":{"title":"async &amp;&amp; inline module","titles":["浏览器[type=&quot;module&quot;]"]},"681":{"title":"多次加载只加载一次","titles":["浏览器[type=&quot;module&quot;]"]},"682":{"title":"跨域问题","titles":["浏览器[type=&quot;module&quot;]"]},"683":{"title":"自带凭证 crossorigin","titles":["浏览器[type=&quot;module&quot;]"]},"684":{"title":"MIME TYPE","titles":["浏览器[type=&quot;module&quot;]"]},"685":{"title":"SEO语义化","titles":[]},"686":{"title":"aside","titles":["SEO语义化"]},"687":{"title":"article","titles":["SEO语义化"]},"688":{"title":"hgroup h1 h2","titles":["SEO语义化"]},"689":{"title":"abbr","titles":["SEO语义化"]},"690":{"title":"hr","titles":["SEO语义化"]},"691":{"title":"p","titles":["SEO语义化"]},"692":{"title":"strong","titles":["SEO语义化"]},"693":{"title":"blockquote q cite","titles":["SEO语义化"]},"694":{"title":"time","titles":["SEO语义化"]},"695":{"title":"figure figcaption","titles":["SEO语义化"]},"696":{"title":"dfn","titles":["SEO语义化"]},"697":{"title":"nav ol ul","titles":["SEO语义化"]},"698":{"title":"pre samp code","titles":["SEO语义化"]},"699":{"title":"其他","titles":["SEO语义化"]},"700":{"title":"你不知道的 HTML 标签","titles":[]},"701":{"title":"meta","titles":["你不知道的 HTML 标签"]},"702":{"title":"JUST DO IT","titles":[]},"703":{"title":"URI 编码","titles":[]},"704":{"title":"unescape","titles":["URI 编码"]},"705":{"title":"escape","titles":["URI 编码"]},"706":{"title":"encodeURI","titles":["URI 编码"]},"707":{"title":"decodeURI","titles":["URI 编码"]},"708":{"title":"encodeURIComponent","titles":["URI 编码"]},"709":{"title":"decodeURIComponent","titles":["URI 编码"]},"710":{"title":"DOM2 级绑定事件","titles":[]},"711":{"title":"addEventListener","titles":["DOM2 级绑定事件"]},"712":{"title":"API","titles":["DOM2 级绑定事件","addEventListener"]},"713":{"title":"例子","titles":["DOM2 级绑定事件","addEventListener"]},"714":{"title":"DOM 类型","titles":[]},"715":{"title":"DOM 链","titles":["DOM 类型"]},"716":{"title":"DOM 操作","titles":["DOM 类型"]},"717":{"title":"DOM 扩展","titles":["DOM 类型"]},"718":{"title":"DOM2 DOM3","titles":["DOM 类型"]},"719":{"title":"JS 相等性","titles":[]},"720":{"title":"相等 ==","titles":["JS 相等性"]},"721":{"title":"严格相等 ===","titles":["JS 相等性"]},"722":{"title":"判断 if()","titles":["JS 相等性"]},"723":{"title":"比较 &gt; = &lt;","titles":["JS 相等性"]},"724":{"title":"Event Loop","titles":[]},"725":{"title":"CPU、进程、线程之间的关系","titles":["Event Loop"]},"726":{"title":"浏览器是多进程的","titles":["Event Loop"]},"727":{"title":"浏览器包含了哪些进程","titles":["Event Loop"]},"728":{"title":"主进程","titles":["Event Loop","浏览器包含了哪些进程"]},"729":{"title":"第三方插件进程","titles":["Event Loop","浏览器包含了哪些进程"]},"730":{"title":"浏览器内核（渲染进程）","titles":["Event Loop"]},"731":{"title":"JavaScript 单线程？","titles":["Event Loop"]},"732":{"title":"GUI 渲染线程与 JS 引擎线程互斥？","titles":["Event Loop"]},"733":{"title":"Event Loop GO","titles":["Event Loop"]},"734":{"title":"JS 运算符","titles":[]},"735":{"title":"控制合并操作符 ??","titles":["JS 运算符"]},"736":{"title":"赋值","titles":["JS 运算符","控制合并操作符 ??"]},"737":{"title":"短路","titles":["JS 运算符","控制合并操作符 ??"]},"738":{"title":"可选链式操作符 ?.","titles":["JS 运算符"]},"739":{"title":"比较","titles":["JS 运算符","可选链式操作符 ?."]},"740":{"title":"函数调用","titles":["JS 运算符","可选链式操作符 ?."]},"741":{"title":"表达式","titles":["JS 运算符","可选链式操作符 ?."]},"742":{"title":"不能用于赋值","titles":["JS 运算符","可选链式操作符 ?."]},"743":{"title":"访问数组元素","titles":["JS 运算符","可选链式操作符 ?."]},"744":{"title":"运算符优先级","titles":["JS 运算符"]},"745":{"title":"MutationObserver","titles":[]},"746":{"title":"概念","titles":["MutationObserver"]},"747":{"title":"兼容性","titles":["MutationObserver"]},"748":{"title":"用法","titles":["MutationObserver"]},"749":{"title":"API","titles":["MutationObserver"]},"750":{"title":"observe 方法","titles":["MutationObserver","API"]},"751":{"title":"callback mutation records 回调参数属性分析","titles":["MutationObserver","API"]},"752":{"title":"disconnect 关闭连接","titles":["MutationObserver","API"]},"753":{"title":"Multi MutaintionObserver(多监听改变)","titles":["MutationObserver","API"]},"754":{"title":"重新使用 MutationObserver 实例","titles":["MutationObserver","API"]},"755":{"title":"observe 方法第二个参数对象有哪些属性","titles":["MutationObserver","API"]},"756":{"title":"MutationObserver 设计规范","titles":["MutationObserver","API"]},"757":{"title":"异步回调和记录队列","titles":["MutationObserver","API","MutationObserver 设计规范"]},"758":{"title":"takeRecords() 方法","titles":["MutationObserver","API","MutationObserver 设计规范"]},"759":{"title":"性能分析","titles":["MutationObserver","API","MutationObserver 设计规范"]},"760":{"title":"原型","titles":[]},"761":{"title":"创建一个对象","titles":["原型"]},"762":{"title":"继承","titles":["原型"]},"763":{"title":"__proto__","titles":["原型"]},"764":{"title":"constructor","titles":["原型"]},"765":{"title":"JS 作用域","titles":[]},"766":{"title":"编译原理","titles":["JS 作用域"]},"767":{"title":"理解作用域","titles":["JS 作用域"]},"768":{"title":"LHS RHS","titles":["JS 作用域","理解作用域"]},"769":{"title":"异常","titles":["JS 作用域","理解作用域"]},"770":{"title":"总结","titles":["JS 作用域","理解作用域"]},"771":{"title":"词法作用域","titles":["JS 作用域"]},"772":{"title":"闭包","titles":["JS 作用域","词法作用域"]},"773":{"title":"查找作用域","titles":["JS 作用域","词法作用域"]},"774":{"title":"欺骗作用域","titles":["JS 作用域","词法作用域"]},"775":{"title":"eval","titles":["JS 作用域","词法作用域","欺骗作用域"]},"776":{"title":"with","titles":["JS 作用域","词法作用域","欺骗作用域"]},"777":{"title":"性能","titles":["JS 作用域","词法作用域","欺骗作用域"]},"778":{"title":"全局作用域","titles":["JS 作用域","词法作用域"]},"779":{"title":"函数作用域","titles":["JS 作用域","词法作用域"]},"780":{"title":"块级作用域","titles":["JS 作用域","词法作用域"]},"781":{"title":"JS 的存储结构","titles":[]},"782":{"title":"栈结构","titles":["JS 的存储结构"]},"783":{"title":"调用栈","titles":["JS 的存储结构","栈结构"]},"784":{"title":"函数调用","titles":["JS 的存储结构","栈结构"]},"785":{"title":"栈","titles":["JS 的存储结构","栈结构"]},"786":{"title":"总结","titles":["JS 的存储结构","栈结构"]},"787":{"title":"栈溢出","titles":["JS 的存储结构","栈结构"]},"788":{"title":"内存空间","titles":["JS 的存储结构"]},"789":{"title":"代码空间","titles":["JS 的存储结构","内存空间"]},"790":{"title":"栈空间","titles":["JS 的存储结构","内存空间"]},"791":{"title":"堆空间","titles":["JS 的存储结构","内存空间"]},"792":{"title":"JS 内存管理 变量分配","titles":["JS 的存储结构"]},"793":{"title":"静态区","titles":["JS 的存储结构","JS 内存管理 变量分配"]},"794":{"title":"调用栈","titles":["JS 的存储结构","JS 内存管理 变量分配"]},"795":{"title":"堆","titles":["JS 的存储结构","JS 内存管理 变量分配"]},"796":{"title":"关于 this","titles":[]},"797":{"title":"误解","titles":["关于 this"]},"798":{"title":"this 全面解析","titles":["关于 this"]},"799":{"title":"调用位置","titles":["关于 this","this 全面解析"]},"800":{"title":"绑定规则","titles":["关于 this","this 全面解析"]},"801":{"title":"默认绑定","titles":["关于 this","this 全面解析","绑定规则"]},"802":{"title":"隐式绑定","titles":["关于 this","this 全面解析","绑定规则"]},"803":{"title":"显式绑定","titles":["关于 this","this 全面解析","绑定规则"]},"804":{"title":"new 绑定","titles":["关于 this","this 全面解析","绑定规则"]},"805":{"title":"绑定优先级","titles":["关于 this","this 全面解析"]},"806":{"title":"bind","titles":["关于 this","this 全面解析","绑定优先级"]},"807":{"title":"注意点","titles":["关于 this","this 全面解析"]},"808":{"title":"忽略的 this","titles":["关于 this","this 全面解析","注意点"]},"809":{"title":"间接引用","titles":["关于 this","this 全面解析","注意点"]},"810":{"title":"软绑定","titles":["关于 this","this 全面解析","注意点"]},"811":{"title":"es6 箭头函数","titles":["关于 this","this 全面解析"]},"812":{"title":"ANSI escape sequences","titles":[]},"813":{"title":"定义","titles":["ANSI escape sequences"]},"814":{"title":"转义序列","titles":["ANSI escape sequences"]},"815":{"title":"CSI 序列","titles":["ANSI escape sequences"]},"816":{"title":"更多","titles":[]},"817":{"title":"Nodejs 事件循环","titles":[]},"818":{"title":"理解","titles":["Nodejs 事件循环"]},"819":{"title":"非阻塞 I/O 操作的设计机制","titles":["Nodejs 事件循环","理解"]},"820":{"title":"process.nextTick 又是如何执行？","titles":["Nodejs 事件循环","理解"]},"821":{"title":"定时器 timers","titles":["Nodejs 事件循环"]},"822":{"title":"待定的回调 pending callbacks","titles":["Nodejs 事件循环"]},"823":{"title":"idle prepare","titles":["Nodejs 事件循环"]},"824":{"title":"轮询 poll","titles":["Nodejs 事件循环"]},"825":{"title":"检测 check","titles":["Nodejs 事件循环"]},"826":{"title":"关闭的回调函数 close callbacks","titles":["Nodejs 事件循环"]},"827":{"title":"setTimeout() VS setImmediate()","titles":["Nodejs 事件循环"]},"828":{"title":"process.nextTick","titles":["Nodejs 事件循环"]},"829":{"title":"process.nextTick() VS setImmediate()","titles":["Nodejs 事件循环","process.nextTick"]},"830":{"title":"为什么使用 process.nextTick()","titles":["Nodejs 事件循环","process.nextTick"]},"831":{"title":"package.json","titles":[]},"832":{"title":"json 配置","titles":["package.json"]},"833":{"title":"正则表达式","titles":[]},"834":{"title":"你不知道的正则表达式","titles":[]},"835":{"title":"逗号分隔千分位","titles":["你不知道的正则表达式"]},"836":{"title":"Typescript 高级","titles":[]},"837":{"title":"Advanced Type","titles":["Typescript 高级"]},"838":{"title":"Utility types","titles":["Typescript 高级"]},"839":{"title":"Modules","titles":["Typescript 高级"]},"840":{"title":"Import a moudle from side-effects only","titles":["Typescript 高级","Modules"]},"841":{"title":"Importing Types","titles":["Typescript 高级","Modules"]},"842":{"title":"Optional Module Loading","titles":["Typescript 高级","Modules"]},"843":{"title":"Ambient Modules","titles":["Typescript 高级","Modules"]},"844":{"title":"UMD modules","titles":["Typescript 高级","Modules"]},"845":{"title":"Module Resolution","titles":["Typescript 高级"]},"846":{"title":"相对路径 &amp; 非相对路径","titles":["Typescript 高级","Module Resolution"]},"847":{"title":"常见解析 classic","titles":["Typescript 高级","Module Resolution"]},"848":{"title":"Node.js 解析","titles":["Typescript 高级","Module Resolution"]},"849":{"title":"Typescript 解析","titles":["Typescript 高级","Module Resolution"]},"850":{"title":"baseUrl 配置","titles":["Typescript 高级","Module Resolution"]},"851":{"title":"测试解析路径","titles":["Typescript 高级","Module Resolution"]},"852":{"title":"Namespaces","titles":["Typescript 高级"]},"853":{"title":"Namespaces &amp; Modules","titles":["Typescript 高级"]},"854":{"title":"Triple-Slash Directives","titles":["Typescript 高级"]},"855":{"title":"Typescript 基础","titles":[]},"856":{"title":"tsconfig.json/jsconfig.json 文件","titles":["Typescript 基础"]},"857":{"title":"配置参数","titles":["Typescript 基础","tsconfig.json/jsconfig.json 文件"]},"858":{"title":"CLI","titles":["Typescript 基础","tsconfig.json/jsconfig.json 文件"]},"859":{"title":"Basic Type","titles":["Typescript 基础"]},"860":{"title":"Interfaces","titles":["Typescript 基础"]},"861":{"title":"Functions","titles":["Typescript 基础"]},"862":{"title":"Literal Types","titles":["Typescript 基础"]},"863":{"title":"Union and Intersection Types","titles":["Typescript 基础"]},"864":{"title":"Classes","titles":["Typescript 基础"]},"865":{"title":"Enum","titles":["Typescript 基础"]},"866":{"title":"Generics","titles":["Typescript 基础"]},"867":{"title":"Typescript 文件结构定义","titles":[]},"868":{"title":"模块化","titles":["Typescript 文件结构定义"]},"869":{"title":"模块模板","titles":["Typescript 文件结构定义"]},"870":{"title":"module.d.ts","titles":["Typescript 文件结构定义","模块模板"]},"871":{"title":"全局模板","titles":["Typescript 文件结构定义"]},"872":{"title":"DO\'s &amp; DON\'Ts","titles":["Typescript 文件结构定义"]},"873":{"title":"DEEP DIVE","titles":["Typescript 文件结构定义"]},"874":{"title":"高级组合","titles":["Typescript 文件结构定义","DEEP DIVE"]},"875":{"title":"导航","titles":[]},"876":{"title":"Context","titles":[]},"877":{"title":"Ref","titles":[]},"878":{"title":"开始","titles":[]}},"dirtCount":0,"index":[["别用",{"2":{"872":1}}],["别名",{"2":{"852":1}}],["泛型约束条件",{"2":{"866":1}}],["泛型",{"2":{"866":1}}],["抽象方法",{"2":{"864":1}}],["抽象类",{"2":{"864":1}}],["抽象接口不应该依赖于具体实现",{"2":{"35":1}}],["静态属性方法无法引用",{"2":{"866":3}}],["静态属性",{"2":{"864":1}}],["静态方法",{"2":{"864":1}}],["静态区",{"0":{"793":1}}],["联合枚举",{"2":{"865":1}}],["联合交叉类型",{"2":{"863":1}}],["联合类型",{"2":{"863":3}}],["联调",{"2":{"67":1}}],["枚举",{"2":{"859":1,"865":1}}],["极大缩端构建和编辑器的交互时间",{"2":{"857":2}}],["映射源文件",{"2":{"857":2}}],["映射",{"2":{"857":2}}],["映射类型",{"2":{"837":1}}],["很难识别组件依赖性",{"2":{"853":1}}],["很快就会变得不可访问",{"2":{"178":1}}],["虚拟目录",{"2":{"850":1,"857":2}}],["出现以上情形",{"2":{"848":1,"849":1}}],["出现错误",{"2":{"480":1}}],["强绑定",{"2":{"838":1}}],["强调",{"2":{"692":1}}],["去除",{"2":{"838":1}}],["排除哪些文件不被编译或者类型检查",{"2":{"857":2}}],["排除",{"2":{"838":1}}],["排队规则",{"2":{"433":2}}],["集合",{"2":{"838":2}}],["集线器",{"2":{"477":1}}],["索引签名",{"2":{"837":1}}],["索引类型",{"2":{"837":2}}],["逗号分隔千分位",{"0":{"835":1}}],["逗号表达式",{"2":{"744":1}}],["元组",{"2":{"859":1}}],["元字符",{"2":{"833":1}}],["元素上或者",{"2":{"877":1}}],["元素内容的总宽度",{"2":{"718":1}}],["元素内容的总高度",{"2":{"718":1}}],["元素的上外边框至包含元素的上内边框之间的像素距离",{"2":{"718":1}}],["元素的左外边框至包含元素的左内边框之间的像素距离",{"2":{"718":1}}],["元素的子元素不会影响父元素的大小",{"2":{"657":1}}],["元素在水平方向上占用的空间大小",{"2":{"718":1}}],["元素在垂直方向上占用的空间大小",{"2":{"718":1}}],["元素大小",{"2":{"718":1}}],["元素添加了以下",{"2":{"717":1}}],["元素空间显示为空",{"2":{"655":1}}],["元素高度不一致",{"2":{"650":1}}],["元素存在间隙",{"2":{"643":1}}],["元素盒子",{"2":{"628":1}}],["元素选择器",{"0":{"605":1}}],["元素选中的方式",{"2":{"195":2}}],["元素位置如何变化",{"2":{"600":1}}],["元素属性",{"2":{"575":1}}],["元素属性为",{"2":{"575":2}}],["元素设置",{"2":{"326":1}}],["元素",{"2":{"326":1}}],["元素向下偏移",{"2":{"326":1}}],["元素显示成一行时",{"2":{"326":1}}],["元素包含多个",{"2":{"326":1}}],["元素外部移入元素边界之内",{"2":{"226":1}}],["元素移入另一个元素触发",{"2":{"226":1}}],["元素获取焦点时触发",{"2":{"225":2}}],["元素获得焦点时触发",{"2":{"225":1}}],["元素失去焦点时触发",{"2":{"225":2}}],["元素可见性",{"2":{"166":1}}],["入口文件",{"2":{"832":1}}],["入口编译之后文件",{"2":{"143":2}}],["凭证",{"2":{"832":1}}],["日志",{"2":{"832":1}}],["描述",{"2":{"832":1,"833":1}}],["版本",{"2":{"857":4}}],["版本号",{"2":{"832":1}}],["版本控制以及",{"2":{"65":1}}],["让回调在栈展开后",{"2":{"830":1}}],["让我们从最熟悉的的",{"2":{"715":1}}],["阻止事件到达轮询阶段",{"2":{"828":1}}],["阻止默认行为",{"2":{"195":2,"230":1}}],["几乎所有情况下",{"2":{"824":1}}],["待定的回调",{"0":{"822":1}}],["待垃圾回收完毕之后恢复脚本的执行",{"2":{"184":1}}],["阈值",{"2":{"821":2}}],["─────┤",{"2":{"820":1}}],["────────────",{"2":{"294":4}}],["┌───────────────┐",{"2":{"820":1}}],["┌───────────────────────────┐",{"2":{"820":1}}],["┌─────────────┴─────────────┐",{"2":{"820":5}}],["┌─",{"2":{"820":1}}],["造成任务饿死",{"2":{"820":1}}],["造轮子",{"2":{"59":1}}],["阶段继续执行",{"2":{"819":1}}],["阶段操作前",{"2":{"365":1}}],["轮询阶段计算出来的阈值",{"2":{"827":1}}],["轮询阶段变为空闲状态",{"2":{"825":1}}],["轮询阶段完成后立即执行回调",{"2":{"825":1}}],["轮询阶段控制何时定时器执行",{"2":{"821":1}}],["轮询队列不为空",{"2":{"819":1,"824":1}}],["轮询队列为空",{"2":{"819":1,"824":1}}],["轮询",{"0":{"824":1},"2":{"819":1}}],["挂起的回调函数",{"2":{"822":1}}],["挂起的回调",{"2":{"819":1}}],["擦除行",{"2":{"815":1}}],["擦除显示",{"2":{"815":1}}],["格",{"2":{"815":1}}],["格式模型",{"2":{"637":1}}],["格式化上下文",{"0":{"573":1},"1":{"574":1,"575":1,"576":1,"577":1,"578":1,"579":1,"580":1,"581":1,"582":1,"583":1}}],["格式错误的请求语法",{"2":{"528":1}}],["格式支持",{"2":{"339":1}}],["格式",{"0":{"454":1},"2":{"339":3}}],["若干个中间字节",{"2":{"815":1}}],["若干个",{"2":{"815":1}}],["若有回调函数",{"2":{"730":1}}],["箭头函数中",{"2":{"861":1}}],["箭头函数会继承外层函数调用的",{"2":{"811":1}}],["箭头函数",{"0":{"811":1}}],["软绑定",{"0":{"810":1}}],["软链接是一个指向文件的指针",{"2":{"323":1}}],["软链接指向文件名",{"2":{"323":1}}],["软链接将会无效",{"2":{"317":1}}],["软链接也被称为符号链接",{"2":{"316":1}}],["软链接",{"2":{"315":1}}],["间接引用采用的是默认绑定",{"2":{"809":1}}],["间接引用",{"0":{"809":1}}],["间隙间距为4px",{"2":{"647":1}}],["间隙存在",{"2":{"644":1}}],["显式绑定",{"0":{"803":1},"2":{"805":1}}],["显示即可操作",{"2":{"655":1}}],["显示元素属性内容",{"2":{"640":1}}],["显示创建的",{"2":{"322":2}}],["显示",{"2":{"318":2}}],["显示的窗口的值",{"2":{"230":1}}],["隐式丢失",{"2":{"802":2}}],["隐式绑定",{"0":{"802":1},"2":{"805":2}}],["隐藏不可操作",{"2":{"655":1}}],["隐藏元素并保持自身的渲染状态",{"2":{"654":1,"655":1}}],["隐藏",{"2":{"168":2}}],["匿名函数无法调用自身",{"2":{"797":2}}],["❎",{"2":{"797":2}}],["误解",{"0":{"797":1}}],["超出范围安全处理",{"2":{"788":1}}],["超过一定数目",{"2":{"787":1}}],["容量限制",{"2":{"787":1}}],["容器布局下的子元素",{"2":{"575":2}}],["容器",{"2":{"51":1}}],["管理函数调用的关系的一种数据结构",{"2":{"783":1}}],["拥有自己的作用域",{"2":{"775":1}}],["降低性能",{"2":{"774":1}}],["降低资源占用",{"0":{"55":1}}],["欺骗作用域",{"0":{"774":1},"1":{"775":1,"776":1,"777":1}}],["逐级向外或者向上进行",{"2":{"773":1}}],["逐级向上传播到较为不具体的节点",{"2":{"213":1}}],["遮蔽效应",{"2":{"773":1}}],["闭包",{"0":{"772":1}}],["谁是赋值操作的源头",{"2":{"768":1}}],["谁先下载完谁就执行",{"2":{"680":1}}],["程序中定义变量的区域",{"2":{"767":1}}],["词法阶段的作用域",{"2":{"771":1}}],["词法作用域规定",{"2":{"772":1}}],["词法作用域是静态的作用域",{"2":{"771":1}}],["词法作用域",{"0":{"771":1},"1":{"772":1,"773":1,"774":1,"775":1,"776":1,"777":1,"778":1,"779":1,"780":1}}],["词法最小单元",{"2":{"766":1}}],["词法分析",{"2":{"172":1,"766":1}}],["渐渐被定义成规范",{"2":{"763":1}}],["渐进空间复杂度",{"2":{"2":1}}],["渐进时间复杂度",{"2":{"1":1}}],["巧借中间函数",{"2":{"762":2}}],["借用构造函数",{"2":{"762":1}}],["借助",{"2":{"104":2}}],["寄生组合式继承",{"2":{"762":1}}],["寄生式继承",{"2":{"762":1}}],["寄生构造函数模式",{"2":{"761":1}}],["寄语",{"2":{"324":1}}],["认同度最高的一种方法",{"2":{"761":1}}],["认证的根",{"2":{"568":1}}],["认证是电子认证服务行业中唯一的国际性认证标准",{"2":{"568":1}}],["毫无封装性可言",{"2":{"761":1}}],["构造器",{"2":{"864":1}}],["构造一组元组类型或者数组类型使用在构造函数当中",{"2":{"838":1}}],["构造一组元组类型使用在函数参数当中",{"2":{"838":1}}],["构造函数调用指定当前实例类",{"2":{"864":1}}],["构造函数只是一些用",{"2":{"804":1}}],["构造函数",{"2":{"762":1,"864":1}}],["构造函数模式",{"2":{"761":1}}],["构建可选",{"2":{"65":1}}],["括号",{"2":{"744":1}}],["短路",{"0":{"737":1}}],["赋值会更好",{"2":{"876":1}}],["赋值操作的目标是谁",{"2":{"768":1}}],["赋值操作的左侧或右侧",{"2":{"768":1}}],["赋值",{"0":{"736":1}}],["添加",{"2":{"870":2}}],["添加到微任务队列",{"2":{"733":1}}],["添加两次保持两次",{"2":{"668":1}}],["添加两次只有一个",{"2":{"668":1}}],["微任务队列",{"2":{"733":1}}],["微任务",{"2":{"733":1}}],["循环内调用",{"2":{"827":1}}],["循环",{"2":{"733":1}}],["宏任务执行完毕",{"2":{"733":1}}],["宏任务执行完毕后",{"2":{"733":1}}],["宏任务完成立即执行当前一轮的微任务",{"2":{"733":1}}],["宏任务",{"2":{"733":1}}],["销毁",{"2":{"728":1}}],["严格相等",{"0":{"721":1}}],["严格模式与",{"2":{"801":1}}],["严格模式中",{"2":{"775":1}}],["严格模式",{"2":{"237":1,"801":2}}],["被",{"2":{"804":1}}],["被隐藏在内容区域上方的像素数",{"2":{"718":1}}],["被隐藏在内容区域左侧的像素数",{"2":{"718":1}}],["被请求的资源必须通过指定的代理才能被访问",{"2":{"523":1}}],["被请求的资源已永久移动到新位置",{"2":{"519":1}}],["被请求的资源有一系列可供选择的回馈信息",{"2":{"518":1}}],["垂",{"2":{"718":1}}],["垂直方向",{"2":{"594":2}}],["偏移量",{"2":{"718":1}}],["偏移高度",{"2":{"190":2,"191":2}}],["",{"2":{"717":5,"718":31}}],["浅复制",{"2":{"716":1}}],["深复制",{"2":{"716":1}}],["深度优先遍历",{"2":{"14":1}}],["举例",{"2":{"715":1}}],["举例说明",{"2":{"317":1,"321":1}}],["看完",{"2":{"715":1}}],["绑定和显式绑定分析",{"2":{"806":1}}],["绑定和显式绑定无法判定",{"2":{"805":1}}],["绑定优先级",{"0":{"805":1},"1":{"806":1}}],["绑定",{"0":{"804":1},"2":{"805":1,"811":1}}],["绑定的是全局对象",{"2":{"801":2}}],["绑定规则",{"0":{"800":1},"1":{"801":1,"802":1,"803":1,"804":1}}],["绑定事件",{"2":{"713":2}}],["绑定事件接收三个参数",{"2":{"711":1}}],["绑定多个相同的事件",{"2":{"218":1,"219":1}}],["问号",{"2":{"706":1}}],["问题描述",{"0":{"329":1}}],["问题",{"0":{"327":1},"1":{"328":1,"329":1,"330":1}}],["问题解决",{"0":{"330":1}}],["问题解决方式",{"2":{"326":1}}],["问题解答",{"2":{"326":1}}],["问题一",{"0":{"326":1}}],["问题定位效率低",{"0":{"66":1}}],["问题定位困难",{"2":{"65":1}}],["井号",{"2":{"706":1}}],["冒号",{"2":{"706":1}}],["冒泡",{"2":{"221":1,"225":4}}],["码进行编码",{"2":{"703":2}}],["持续连接",{"2":{"822":1}}],["持续学习",{"2":{"702":1}}],["持续成长",{"2":{"702":1}}],["持续集成自动构建",{"2":{"25":1}}],["专注",{"2":{"702":1}}],["秒数",{"2":{"701":1}}],["序列化",{"2":{"859":2}}],["序列在",{"2":{"815":1}}],["序列由",{"2":{"815":1}}],["序列",{"0":{"815":1},"2":{"697":1}}],["段落引述内容",{"2":{"693":3}}],["段落标签",{"2":{"691":1}}],["遵循新规范的新浏览器",{"2":{"683":1}}],["旧浏览器违反当时的规范",{"2":{"683":1}}],["旧浏览器除外",{"2":{"683":2}}],["携带凭证",{"2":{"683":8}}],["携带参数是作为上一个",{"2":{"669":1}}],["携带参数",{"2":{"669":1}}],["导航",{"0":{"875":1}}],["导出的对象",{"2":{"672":2}}],["导出",{"2":{"672":2}}],["导入",{"2":{"672":2}}],["导致",{"2":{"776":2}}],["导致设置的",{"2":{"330":1}}],["导致该元素与父元素之间的基线为底部边沿",{"2":{"326":1}}],["导致页面卡顿",{"2":{"186":1}}],["导致用户体验下降",{"2":{"185":1}}],["导致大对象无法分配一块连续空间的内存",{"2":{"183":1}}],["继承多个逗号隔开",{"2":{"860":1}}],["继承",{"0":{"762":1},"2":{"670":1,"864":1}}],["继续匹配位置",{"2":{"666":1}}],["暂停执行",{"2":{"669":1}}],["暂时行死区",{"2":{"663":1}}],["暂时性的",{"2":{"542":1}}],["订阅",{"2":{"669":1}}],["诞生之前回调函数",{"2":{"669":1}}],["遇到",{"2":{"669":1}}],["遇到的一些问题",{"0":{"494":1}}],["遇到的问题",{"0":{"325":1},"1":{"326":1}}],["放在函数内部",{"2":{"669":1}}],["放弃已提交到工作区的所有文件",{"2":{"263":1}}],["放弃所有更改",{"2":{"263":1}}],["终结",{"2":{"669":1}}],["至少执行一次",{"2":{"669":1}}],["至少要有一个范围",{"2":{"114":1}}],["传值调用",{"2":{"669":1}}],["传名调用",{"2":{"669":2}}],["传统的",{"2":{"668":1}}],["传输自定义应用数据相关协议",{"2":{"569":1}}],["传输音视频数据相关协议",{"2":{"569":1}}],["传输协议",{"2":{"488":1}}],["传输性较差",{"2":{"481":1}}],["传输指定端口",{"2":{"481":1}}],["传输控制协议",{"2":{"478":1,"481":1,"571":1}}],["传输表头包含了所使用的协议等发送信息",{"2":{"474":1}}],["传输层",{"0":{"474":1,"481":1},"2":{"427":1}}],["传输携带",{"2":{"401":1}}],["弱引用",{"2":{"668":1}}],["必须指定",{"2":{"838":1}}],["必须显式指定作为函数还是作为对象使用",{"2":{"670":1}}],["必须放在方括号中",{"2":{"667":1}}],["必须在子类中实现",{"2":{"864":1}}],["必须在事件内进行操作",{"2":{"200":2}}],["必须在一个文档事件",{"2":{"198":1}}],["独一无二",{"2":{"667":1}}],["独立文档之外",{"2":{"653":1}}],["独立于",{"2":{"637":1}}],["具体元素转发一次",{"2":{"877":2}}],["具名函数",{"2":{"797":2}}],["具名组匹配",{"2":{"666":1}}],["具有对数据的分组过滤",{"2":{"466":1}}],["具有副作用",{"2":{"461":1}}],["具有将图转化为一个个栅格组成的图象的作用",{"2":{"364":1}}],["具有",{"2":{"280":1}}],["π",{"2":{"666":2}}],["€90",{"2":{"666":2}}],["𠮷",{"2":{"666":2}}],["充当绝对定位和固定位置元素的包含块",{"2":{"660":1}}],["充当转换重任的计算机系统或设备",{"2":{"465":1}}],["样式更改不会传播回包含元素",{"2":{"659":1}}],["样式信息",{"2":{"357":1}}],["达到优化效果",{"2":{"658":1}}],["推断类型",{"2":{"837":1}}],["推断和设置的尺寸是使用的尺寸",{"2":{"657":1}}],["推荐使用flex布局",{"2":{"651":1}}],["推荐规则只能eslint主要版本上更改",{"2":{"251":1}}],["跳过屏幕之外的元素",{"2":{"655":1}}],["跳到最近的页面",{"2":{"268":1}}],["兼容",{"2":{"655":1,"656":1}}],["兼容性",{"0":{"152":1,"674":1,"747":1},"2":{"112":2,"196":1,"212":1,"218":1,"225":2,"311":1,"312":1}}],["物理上显示空白",{"2":{"654":1}}],["物理层",{"0":{"477":1},"2":{"427":1}}],["破坏渲染状态",{"2":{"653":1}}],["控制序列",{"2":{"815":1}}],["控制字符集的码位范围是",{"2":{"812":2}}],["控制合并操作符",{"0":{"735":1},"1":{"736":1,"737":1}}],["控制元素的显隐",{"2":{"653":1}}],["控制展示以及具体功能",{"2":{"38":1}}],["忽略",{"2":{"854":1}}],["忽略的",{"0":{"808":1}}],["忽略闭合标签",{"0":{"648":1}}],["忽略规则",{"2":{"246":2}}],["压缩代码",{"2":{"646":1}}],["压缩方式",{"0":{"646":1}}],["压缩及防护墙等各项功能",{"2":{"466":1}}],["理论上支持属性值为",{"2":{"641":1}}],["理解作用域",{"0":{"767":1},"1":{"768":1,"769":1,"770":1}}],["理解",{"0":{"257":1,"260":1,"263":1,"266":1,"818":1},"1":{"819":1,"820":1},"2":{"506":1}}],["增加去除引号",{"2":{"640":1}}],["增量标记",{"0":{"185":1}}],["某个节点是不是另一个节点的后代",{"2":{"717":1}}],["某个组的机器都能收到",{"2":{"429":1}}],["某些特殊情况下",{"2":{"638":1}}],["某些替换元素具有固有尺寸或定义的基线",{"2":{"637":1}}],["他们是外部对象",{"2":{"637":1}}],["替换元素",{"0":{"638":1}}],["替换元素是表示形式超出",{"2":{"637":1}}],["替换值",{"2":{"156":1,"751":1}}],["列",{"2":{"815":2}}],["列举",{"0":{"633":1,"635":1}}],["列组合选择器",{"2":{"616":1}}],["名词",{"2":{"627":1}}],["名称",{"2":{"323":1,"815":1}}],["符号的选择器",{"0":{"617":1},"1":{"618":1,"619":1,"620":1,"621":1,"622":1,"623":1,"624":1,"625":1,"626":1}}],["符号位不变",{"2":{"293":1}}],["符号位加上真值的绝对值",{"2":{"292":1}}],["带",{"0":{"617":1},"1":{"618":1,"619":1,"620":1,"621":1,"622":1,"623":1,"624":1,"625":1,"626":1}}],["带有",{"2":{"394":1}}],["兄弟选择器",{"2":{"615":1}}],["兄弟元素组合选择器",{"2":{"613":1}}],["伪元素中插入内容",{"2":{"639":1}}],["伪元素必须跟在普通选择器和基础选择器之后",{"2":{"632":1}}],["伪元素是一个附加至选择器末的关键词",{"2":{"632":1}}],["伪元素",{"0":{"631":1,"632":1},"1":{"632":1,"633":2,"634":1,"635":1},"2":{"609":1}}],["伪类是添加到选择器的关键词",{"2":{"634":1}}],["伪类",{"0":{"631":1,"634":1},"1":{"632":1,"633":1,"634":1,"635":2},"2":{"609":1,"632":1,"635":2}}],["伪类选择器",{"0":{"609":1}}],["粘性布局",{"0":{"595":1}}],["粘贴",{"2":{"113":1}}],["居右依次布局",{"2":{"594":2}}],["居左",{"2":{"594":2}}],["居中",{"2":{"113":1}}],["水平滚动条的高度",{"2":{"718":1}}],["水平方向",{"2":{"594":2}}],["水平垂直居中",{"2":{"591":2}}],["水平写入模式",{"2":{"579":1}}],["盒子",{"2":{"587":1}}],["盒模型",{"0":{"584":1},"1":{"585":1,"586":1,"587":1}}],["父元素设置font",{"2":{"649":1}}],["父元素后第一代子元素选择器",{"2":{"614":1}}],["父级",{"2":{"583":2}}],["父容器高度塌陷",{"2":{"576":1}}],["情形",{"0":{"583":1}}],["块容器盒子",{"2":{"587":1}}],["块盒子",{"2":{"587":1}}],["块",{"2":{"587":1}}],["块的上外边距和下外边距有时合并",{"2":{"582":1}}],["块元素中文字",{"2":{"629":1}}],["块元素在确定宽度元素下",{"2":{"590":1}}],["块元素",{"2":{"583":1}}],["块元素不发生旋转",{"2":{"581":1}}],["块元素应用书写模式",{"2":{"581":1}}],["块级作用域是通过词法环境的栈结构实现的",{"2":{"780":1}}],["块级作用域",{"0":{"780":1}}],["块级盒子",{"2":{"587":1}}],["块级元素",{"2":{"587":1,"643":1}}],["块级元素的",{"2":{"575":1}}],["块级格式化上下文",{"2":{"574":1}}],["书写模式",{"2":{"580":2}}],["浮动区间内的元素",{"2":{"600":1}}],["浮动区间元素依次排列",{"2":{"599":1}}],["浮动元素的高度",{"2":{"600":1}}],["浮动元素的实际",{"2":{"600":1}}],["浮动元素与非浮动元素可视",{"2":{"599":1}}],["浮动元素表示使用块布局",{"2":{"597":1}}],["浮动元素",{"2":{"596":1}}],["浮动不会影响其他",{"2":{"575":1}}],["浮点数以大字节序形式表示",{"2":{"281":1}}],["浮点数范围",{"0":{"280":1},"1":{"281":1,"282":1}}],["脱离文档流",{"2":{"575":1}}],["布局和绘制",{"2":{"730":1}}],["布局方式",{"0":{"651":1}}],["布局下的元素",{"2":{"590":1}}],["布局容器下的项目属性",{"2":{"590":1}}],["布局容器下的项目使用",{"2":{"589":1}}],["布局中项目属性的同等效果",{"2":{"589":1}}],["布局",{"2":{"575":1}}],["布尔值",{"2":{"114":1}}],["绝对值最大的负边距",{"2":{"583":1}}],["绝对定位的元素",{"2":{"575":1}}],["绝对路径",{"2":{"857":2}}],["绝对路径icon地址",{"2":{"134":2}}],["绝对路径地址",{"2":{"134":2}}],["适用于让事件循环继续之前",{"2":{"828":1}}],["适用",{"2":{"628":1,"629":1}}],["适用以下的方法可以创建一个新的",{"2":{"575":1}}],["适合自己的数据结构与算法的记忆方法",{"2":{"10":1}}],["流式布局",{"2":{"579":1}}],["流控制传输协议",{"2":{"572":1}}],["流程",{"2":{"356":1}}],["银行",{"2":{"568":1}}],["金融机构",{"2":{"568":1}}],["普通方法",{"2":{"864":1}}],["普通公司申请的证书属于",{"2":{"568":1}}],["普通文字",{"2":{"342":1}}],["否则",{"2":{"826":1}}],["否则报错",{"2":{"761":1}}],["否则返回左侧操作数",{"2":{"735":1}}],["否则不会执行",{"2":{"684":1}}],["否则会报错",{"2":{"670":1}}],["否则视为不合法",{"2":{"566":1}}],["否则无效",{"2":{"218":1}}],["验证数字证书",{"0":{"566":1}}],["签发数字证书",{"2":{"564":1}}],["信息摘要",{"2":{"566":2}}],["信息审核通过",{"2":{"564":1}}],["信号转发的网络设备",{"2":{"464":1}}],["机构的权威性",{"2":{"568":1}}],["机构链查找",{"2":{"566":1}}],["机构验证信息是否合理合法",{"2":{"564":1}}],["机构提交公钥以及相关信息",{"2":{"564":1}}],["机器存储一个具体数字的编码方式",{"2":{"291":1}}],["准备一套公钥和私钥",{"2":{"564":1}}],["申请数字证书是不需要提供私钥的",{"2":{"567":1}}],["申请数字证书",{"0":{"564":1}}],["申请协议升级",{"2":{"490":1}}],["劫持替换",{"2":{"562":1}}],["证书序列号等明文信息",{"2":{"564":1}}],["证书",{"0":{"562":1},"1":{"563":1,"564":1,"565":1,"566":1,"567":1}}],["影响数据传输速率",{"2":{"558":1}}],["私钥永远只能存在于服务器上",{"2":{"567":1}}],["私钥留着自己使用",{"2":{"564":1}}],["私钥只有服务器存在",{"2":{"557":1}}],["私钥只有公钥能解密",{"2":{"556":1}}],["私有属性",{"2":{"864":1}}],["私有地址",{"0":{"439":1}}],["私有",{"2":{"429":1,"440":1}}],["拿到随机数和加密方式",{"2":{"555":1}}],["混合类型",{"2":{"860":1,"865":1}}],["混合起来生成密钥",{"2":{"554":1}}],["混杂模式",{"2":{"224":1,"715":1,"718":1}}],["密钥都能用来解密",{"2":{"554":1}}],["随机数",{"2":{"553":2,"559":2,"561":1,"563":2}}],["便于管理",{"2":{"549":1}}],["便于隔离更新",{"2":{"362":1}}],["划分子网",{"0":{"549":1}}],["运行在",{"2":{"827":1}}],["运行一个函数",{"2":{"784":1}}],["运行速度",{"2":{"463":1}}],["运算符优先级",{"0":{"744":1}}],["运算符",{"0":{"734":1},"1":{"735":1,"736":1,"737":1,"738":1,"739":1,"740":1,"741":1,"742":1,"743":1,"744":1}}],["运算",{"2":{"548":1}}],["声明网络地址与主机地址",{"0":{"548":1}}],["背景",{"0":{"546":1}}],["背景文字",{"2":{"342":1}}],["又可以表现为对象形式",{"2":{"860":1}}],["又是如何执行",{"0":{"820":1}}],["又叫网络掩码",{"2":{"545":1}}],["又想处理没有结束",{"2":{"163":1,"758":1}}],["热点",{"2":{"544":1}}],["热键",{"2":{"226":1}}],["旨在限制用户群访问特定网络",{"2":{"544":1}}],["身份验证并不能提供任何帮助",{"2":{"531":1}}],["域中指明",{"2":{"517":1}}],["域名下访问不到",{"2":{"196":1}}],["断点续传",{"2":{"513":1}}],["且不覆盖",{"2":{"861":1}}],["且不能越界方位",{"2":{"859":2}}],["且默认为",{"2":{"815":1}}],["且其",{"2":{"508":1}}],["且每个节点一般需要一个",{"2":{"447":1}}],["临时响应",{"2":{"501":1}}],["消息发出重定向",{"2":{"521":1}}],["消息",{"2":{"514":1}}],["消息之前返回一些响应头",{"2":{"505":1}}],["消息头通知客户端采用不同的协议来完成这个请求",{"2":{"503":1}}],["消息类型",{"2":{"501":1}}],["消息包",{"2":{"422":1}}],["五类状态码",{"2":{"500":1}}],["占满剩余空间",{"2":{"594":2}}],["占位符",{"2":{"496":1}}],["占用",{"2":{"48":1,"274":1,"275":1}}],["握手不会产生无用的缓存",{"2":{"493":1}}],["长时间保持会浪费连接资源",{"2":{"491":1}}],["长时间没有数据往来的连接",{"2":{"491":1}}],["长乘法",{"2":{"288":1}}],["较少的控制开销",{"2":{"489":1}}],["优点",{"0":{"489":1}}],["优化关键渲染路径",{"2":{"381":1}}],["优化资源大小数量",{"2":{"376":1}}],["优化资源加载的顺序和粒度",{"2":{"51":1}}],["优化",{"0":{"376":1},"2":{"381":2}}],["优化处理",{"2":{"132":3}}],["试试监控网络状态",{"2":{"487":1}}],["试验用处",{"2":{"445":1}}],["处于等待连接的状态",{"2":{"487":1}}],["处理轮询队列里的事件",{"2":{"824":1}}],["处理轮询队列中的事件",{"2":{"819":1}}],["处理不可见操作",{"2":{"728":1}}],["处理接收包",{"2":{"479":1}}],["处理元素的几何属性",{"2":{"358":1}}],["处理entries",{"2":{"143":2}}],["处理之后",{"2":{"143":2}}],["处理",{"2":{"137":2}}],["套接字或处理函数关闭",{"2":{"826":1}}],["套接字在尝试连接时接收到",{"2":{"822":1}}],["套接字上联应用进程",{"2":{"485":1}}],["套接字",{"2":{"485":1}}],["缺陷",{"0":{"483":1,"555":1,"558":1}}],["缺点",{"2":{"65":2}}],["首部",{"2":{"481":1}}],["首屏加载优化",{"0":{"51":1}}],["检查",{"2":{"854":1}}],["检查是否执行",{"2":{"819":1}}],["检查网络是否通畅",{"2":{"480":1}}],["检索新的",{"2":{"819":1,"824":1}}],["检测",{"0":{"825":1}}],["检测到方向变化触发此事件",{"2":{"233":1}}],["检测图是否存在环",{"2":{"17":1}}],["寻址",{"2":{"480":1}}],["制定了一套新地址",{"2":{"480":1}}],["线缆规范",{"2":{"477":1}}],["线程控制",{"2":{"795":1}}],["线程继续接管",{"2":{"733":1}}],["线程接管渲染",{"2":{"733":1}}],["线程是建立在进程的基础上的一次程序运行单位",{"2":{"725":1}}],["线程是",{"2":{"725":1}}],["线程之间的关系",{"0":{"725":1}}],["线程处理",{"2":{"363":1}}],["线程",{"2":{"350":2,"356":1,"357":1,"358":1,"359":1,"360":1,"361":3,"362":2,"363":2,"364":2,"365":2,"366":2,"367":1,"368":1,"669":1,"724":1}}],["针脚",{"2":{"477":1}}],["针对场景",{"2":{"186":1}}],["针对线上发布的流程规范",{"2":{"23":1}}],["针对通用组件变更的版本变更报警",{"2":{"23":1}}],["针对基础框架和通用组件的单元测试",{"2":{"23":1}}],["针对",{"2":{"23":2,"666":1}}],["针对整个业务层的",{"2":{"23":1}}],["介质访问控制子层",{"2":{"476":1}}],["介绍",{"2":{"154":1,"749":1}}],["决定数据的路径选择和转寄",{"2":{"475":1}}],["媒体响应式布局",{"2":{"621":1}}],["媒体存取控制位址",{"2":{"467":1}}],["媒体类型",{"2":{"205":1}}],["起网关作用",{"2":{"466":1}}],["起一个",{"2":{"354":1}}],["翻译器",{"2":{"465":1}}],["局域网地址",{"2":{"467":1}}],["局域网互连",{"2":{"465":1}}],["局限性",{"2":{"188":1}}],["广域网",{"2":{"547":1}}],["广域网互连",{"2":{"465":1}}],["广播返回给客户机一个",{"2":{"422":1}}],["广播包封装了",{"2":{"422":1}}],["广播包分配一个地址",{"2":{"422":1}}],["广播",{"2":{"422":4,"480":1}}],["广播地址",{"2":{"421":1,"429":1}}],["光标位置",{"2":{"815":1}}],["光标移动到第",{"2":{"815":2}}],["光标移动到上面第",{"2":{"815":1}}],["光标移动到下面第",{"2":{"815":1}}],["光标移到上一行",{"2":{"815":1}}],["光标移到下一行",{"2":{"815":1}}],["光标后移",{"2":{"815":2}}],["光标前移",{"2":{"815":1}}],["光标下移",{"2":{"815":1}}],["光标在屏幕边缘",{"2":{"815":1}}],["光标向指定的方向移动",{"2":{"815":1}}],["光标上移",{"2":{"815":1}}],["光",{"2":{"464":1}}],["光栅化",{"2":{"364":2}}],["光栅化任务",{"2":{"352":1}}],["光栅化线程",{"2":{"350":1}}],["经典以太网",{"2":{"463":1}}],["经历多一点你以后的路就好走一点",{"2":{"324":1}}],["电商平台申请的证书属于",{"2":{"568":1}}],["电压",{"2":{"477":1}}],["电子信号和介质访问层协议的内容",{"2":{"463":1}}],["电脑桌面",{"2":{"226":1}}],["拓扑结构",{"2":{"463":1}}],["涉及到资源的修改和创建都是不安全的",{"2":{"461":1}}],["响应值",{"2":{"494":2}}],["响应协议升级",{"2":{"490":1}}],["响应客户端套接字的请求",{"2":{"487":1}}],["响应体",{"2":{"461":1}}],["响应头",{"0":{"492":1},"1":{"493":1},"2":{"461":1}}],["幂等",{"2":{"461":1}}],["隧道",{"2":{"459":1}}],["直接在元素上使用回调函数",{"2":{"877":2}}],["直接创建",{"2":{"877":2}}],["直接返回这个",{"2":{"761":1}}],["直接修改",{"2":{"455":1}}],["直滚动条的宽度",{"2":{"718":1}}],["直到队列为空",{"2":{"824":1}}],["直到队列用尽",{"2":{"819":1}}],["直到遇见第一个匹配的标识符为止",{"2":{"773":1}}],["直到根证书机构为止",{"2":{"566":1}}],["直到堆为空",{"2":{"12":1}}],["种方法",{"2":{"450":1}}],["该位置决定了变量的生命周期",{"2":{"767":1}}],["该线程就会执行",{"2":{"730":1}}],["该数组的成员是一个个表示键值对的数组",{"2":{"668":1}}],["该ip地址属于192",{"2":{"548":2}}],["该",{"2":{"547":1}}],["该请求不可接受",{"2":{"534":1}}],["该类地址中数字",{"2":{"446":1}}],["该如何处理",{"2":{"168":1}}],["特性",{"2":{"718":6}}],["特定地址被拒绝访问网站",{"2":{"529":1}}],["特殊字符",{"2":{"706":1}}],["特殊字符进行编码",{"2":{"706":1}}],["特殊地址",{"0":{"495":1},"1":{"496":1,"497":1,"498":1,"499":1}}],["特殊的网址",{"0":{"446":1}}],["特点是每个元素对应帧缓冲区中的一像素",{"2":{"364":1}}],["特点",{"0":{"7":1}}],["权威机构",{"2":{"438":1}}],["公钥",{"2":{"564":1}}],["公钥是可以被拦截获取的",{"2":{"558":1}}],["公钥只有私钥能解密",{"2":{"556":1}}],["公有地址",{"0":{"438":1}}],["公共组件",{"2":{"33":1}}],["唯一地址",{"2":{"436":1}}],["互联网协议地址",{"2":{"434":1}}],["就执行脚本",{"2":{"827":1}}],["就无法绑定其他",{"2":{"803":2}}],["就会栈溢出",{"2":{"787":1}}],["就会使用",{"2":{"770":1}}],["就会创建一个prototype对象",{"2":{"761":1}}],["就是记录其中的一个属性",{"2":{"796":1}}],["就是一个独立的进程",{"2":{"726":1}}],["就是你现在付出的",{"2":{"324":1}}],["就可以使用对称加密方式传输数据",{"2":{"560":1}}],["就可以测试本机中配置的",{"2":{"446":1}}],["就需要分片来传输",{"2":{"433":1}}],["作用域中",{"2":{"776":2}}],["作用域泄露",{"2":{"776":1}}],["作用域查找始终从运行时所处的最内部作用域开始",{"2":{"773":1}}],["作用域查找会在找到第一个匹配的标识符停止",{"2":{"773":1}}],["作用域是由代码中函数声明的位置来决定的",{"2":{"771":1}}],["作用域是一套规则",{"2":{"770":1}}],["作用域链保证对执行环境有权访问",{"2":{"770":1}}],["作用域链",{"2":{"770":1,"794":1}}],["作用域控制着变量的可见性与生命周期",{"2":{"767":1}}],["作用域",{"0":{"765":1},"1":{"766":1,"767":1,"768":1,"769":1,"770":1,"771":1,"772":1,"773":1,"774":1,"775":1,"776":1,"777":1,"778":1,"779":1,"780":1}}],["作用",{"2":{"433":1,"815":1}}],["作为函数参数时使用",{"2":{"838":1}}],["作为函数调用时",{"2":{"670":1,"864":1}}],["作为对象时",{"2":{"670":1,"864":1}}],["作为父类的构造对象",{"2":{"670":1}}],["作为构造函数",{"2":{"668":1}}],["作为属性名",{"2":{"667":1}}],["作为网关或者代理工作的服务器尝试执行请求时",{"2":{"541":1,"543":1}}],["作为开头",{"2":{"446":1}}],["作为",{"2":{"104":1}}],["除了关闭的回调函数",{"2":{"824":1}}],["除了要有确定的地址",{"2":{"432":1}}],["除",{"2":{"814":1}}],["除非指定",{"2":{"866":1}}],["除非后一个元素加上",{"2":{"583":1}}],["除非没有流入流线框",{"2":{"326":1}}],["环回地址",{"2":{"499":1}}],["环回接口",{"2":{"429":1}}],["环境变量长度太大",{"2":{"330":1}}],["环境变量配置",{"2":{"330":1}}],["环境准备",{"0":{"107":1}}],["组成部分",{"2":{"815":1}}],["组合类型的值",{"2":{"838":1}}],["组合继承",{"2":{"762":1}}],["组合使用构造函数和原型模式",{"2":{"761":1}}],["组合使用",{"0":{"661":1}}],["组名",{"2":{"666":2}}],["组织信息",{"2":{"564":1}}],["组播地址",{"2":{"429":1}}],["组件上",{"2":{"877":1}}],["组件内维护自身的事件",{"2":{"38":1}}],["组件内维护自身的数据和状态",{"2":{"38":1}}],["组件封装",{"0":{"38":1}}],["组件划分",{"0":{"37":1}}],["组件化设计",{"0":{"36":1},"1":{"37":1,"38":1}}],["组件化与模块化设计",{"0":{"31":1},"1":{"32":1,"33":1,"34":1,"35":1,"36":1,"37":1,"38":1}}],["留待后用",{"2":{"429":1}}],["另外要配置初始启动文件",{"2":{"424":1}}],["租期",{"2":{"424":1}}],["租给你",{"2":{"422":1}}],["租房",{"2":{"422":1}}],["源端口",{"2":{"422":2}}],["源码",{"2":{"147":1,"191":1,"715":2}}],["源码移步这里",{"2":{"142":1}}],["源码可以点击下方链接",{"2":{"142":1}}],["源码分析",{"0":{"130":1},"1":{"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1}}],["源码实现",{"0":{"98":1,"133":1},"1":{"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1}}],["退租",{"2":{"422":1}}],["都会生成一个",{"2":{"764":1}}],["都会执行",{"2":{"737":2}}],["都是指在一个进程内的单和多",{"2":{"725":1}}],["都是明文的",{"2":{"555":1}}],["都不是幂等",{"2":{"461":1}}],["都相同的话",{"2":{"416":1}}],["都有一套完整的统一流程",{"2":{"181":1}}],["告知服务器正式请求会使用哪一种",{"2":{"414":1}}],["告知服务器正式请求会使用哪些",{"2":{"413":1}}],["告诉开发人员设备什么时候开始移动",{"2":{"233":1}}],["哪些域名可以被允许发送消息",{"2":{"419":1}}],["哪些",{"2":{"410":1}}],["给用户分配",{"2":{"551":1}}],["给",{"2":{"406":1}}],["给选中的文本加上背景颜色",{"2":{"114":1}}],["头部开始",{"2":{"666":1}}],["头信息返回",{"2":{"508":1}}],["头带正文合起来不允许超过",{"2":{"433":1}}],["头的名称能在响应中列出",{"2":{"411":1}}],["头",{"2":{"409":1,"413":1,"422":6}}],["头决定浏览器是否阻止前端",{"2":{"405":1}}],["头组成",{"2":{"405":1}}],["跨域问题",{"0":{"682":1}}],["跨域访问的几种方式",{"0":{"418":1},"1":{"419":1}}],["跨域资源共享",{"2":{"405":1}}],["跨站攻击",{"2":{"402":1}}],["跨站",{"0":{"72":1}}],["跨站脚本攻击",{"2":{"68":1}}],["黑名单不被允许",{"2":{"404":1}}],["仅在需要时加载模块",{"2":{"842":1}}],["仅在内部使用",{"2":{"819":1}}],["仅适用于同一格式上下文中的项目",{"2":{"575":1}}],["仅用于两个高层协议不同的网络互连",{"2":{"465":1}}],["仅属于当前域名和当前页",{"2":{"404":1}}],["仅加载需要的资源",{"2":{"51":1}}],["过后运行脚本",{"2":{"827":1}}],["过几秒刷新跳转",{"2":{"701":1}}],["过期时间",{"0":{"398":1},"1":{"399":1,"400":1}}],["过滤那些节点的属性不被监听改变",{"2":{"160":1,"755":1}}],["隔开",{"2":{"395":1}}],["隔开document",{"2":{"395":1}}],["由单独的",{"2":{"795":1}}],["由于",{"2":{"776":2}}],["由一系列传输的",{"2":{"405":1}}],["由一系列字符串组成",{"2":{"393":1}}],["由观察者实例决定",{"2":{"161":1,"756":1}}],["累计布局偏移",{"2":{"391":1}}],["测量工具",{"0":{"382":1}}],["测试包",{"2":{"870":1}}],["测试解析路径",{"0":{"851":1}}],["测试",{"2":{"61":1}}],["测试数据",{"2":{"42":1}}],["网际协议",{"2":{"478":1}}],["网际协议地址",{"2":{"434":1}}],["网间连接器",{"2":{"465":1}}],["网关在网络层以上实现网络互连",{"2":{"465":1}}],["网关",{"0":{"465":1}}],["网关地址",{"2":{"421":1,"424":1}}],["网线插着",{"2":{"433":1}}],["网卡可以发送多播包",{"2":{"433":1}}],["网卡有广播地址",{"2":{"433":1}}],["网卡处于启动状态",{"2":{"433":1}}],["网卡生产出来就带着这个地址",{"2":{"432":1}}],["网卡的物理地址",{"2":{"432":1}}],["网卡",{"2":{"429":1,"477":1,"479":1}}],["网页速度测量工具",{"2":{"382":1}}],["网页字体",{"2":{"381":1}}],["网络操作",{"2":{"728":1}}],["网络信任",{"2":{"568":1}}],["网络中编号为11的主机",{"2":{"548":2}}],["网络划分为若干个小的子网络",{"2":{"547":1}}],["网络加速器",{"2":{"510":1}}],["网络地址",{"2":{"480":1}}],["网络地址的最高位必须为",{"2":{"441":1,"442":1,"443":1}}],["网络表头包含了网络数据",{"2":{"475":1}}],["网络传输协议",{"0":{"469":1}}],["网络模型",{"0":{"468":1,"470":1},"1":{"469":1,"470":1,"471":2,"472":2,"473":2,"474":2,"475":2,"476":2,"477":2,"478":1,"479":1,"480":1,"481":1,"482":1,"483":1}}],["网络分层",{"0":{"448":1},"1":{"449":1}}],["网络",{"2":{"446":1}}],["网络设备的状态标识",{"0":{"433":1},"2":{"433":1}}],["网络号的计算",{"2":{"429":1}}],["网络号",{"2":{"429":1}}],["网络跳线",{"2":{"427":1}}],["网络协议例子",{"2":{"427":1}}],["网络协议",{"0":{"426":1},"1":{"427":1,"428":1,"429":1,"430":1,"431":1,"432":1,"433":1}}],["网络资源请求时间",{"2":{"56":1}}],["网络请求优化",{"0":{"50":1}}],["网络耗时",{"2":{"48":1}}],["网络层设备",{"2":{"466":1}}],["网络层",{"0":{"475":1,"480":1},"2":{"33":1,"427":1}}],["改进",{"0":{"381":1}}],["改变了全局作用域function",{"2":{"776":1}}],["改变了全局作用域",{"2":{"775":2,"776":1}}],["改变大小",{"2":{"718":2}}],["改变文字方向",{"2":{"581":1}}],["改变不会重载",{"2":{"271":1}}],["改变的目标结点",{"2":{"156":1,"751":1}}],["改变生成标签组",{"2":{"139":2}}],["改变",{"2":{"139":2,"156":4,"158":2,"159":1,"672":2,"751":4,"753":2,"754":1}}],["子类静态方法中",{"2":{"670":1}}],["子类普通方法中",{"2":{"670":1}}],["子元素将根据新的上下文堆叠",{"2":{"660":1}}],["子元素",{"2":{"649":1}}],["子元素的float",{"2":{"651":1}}],["子元素的",{"2":{"583":2}}],["子元素设置",{"2":{"576":1}}],["子网络遮罩",{"2":{"545":1}}],["子网内",{"2":{"480":1}}],["子网掩码的十进制数值",{"2":{"548":1}}],["子网掩码的二进制数值",{"2":{"548":1}}],["子网掩码和",{"2":{"429":1}}],["子网掩码",{"0":{"431":1,"545":1},"1":{"546":1,"547":1,"548":1,"549":1,"550":1,"551":1},"2":{"421":1,"424":1,"429":1,"545":1}}],["子框架可以使用",{"2":{"380":1}}],["子文件夹",{"2":{"309":1}}],["您应该考虑这些元素",{"2":{"380":1}}],["真正计算的指标存在差异",{"2":{"380":1}}],["面向链接的",{"2":{"481":1}}],["面向用户",{"2":{"59":1}}],["面试",{"0":{"377":1}}],["供",{"2":{"359":1}}],["职责",{"2":{"356":1,"357":1,"358":1,"359":1,"360":1,"361":1,"362":1,"363":1,"364":1,"365":1,"366":1,"367":1,"368":1}}],["职责驱动设计",{"2":{"34":1}}],["老版本的默认策略",{"2":{"354":1}}],["老生代",{"0":{"180":1}}],["绘制等",{"2":{"729":1}}],["绘制到用户界面上",{"2":{"728":1}}],["绘制",{"2":{"352":1}}],["生命周期",{"2":{"351":1}}],["生成的文本是具有给定名称的所有计数器的值",{"2":{"641":1}}],["生成的签名",{"2":{"564":1}}],["生成以太网数据包",{"2":{"480":1}}],["生成位图",{"2":{"364":1}}],["生成",{"2":{"357":1,"359":1,"368":1}}],["生成字节码",{"0":{"173":1}}],["生成抽象语法树和执行上下文",{"0":{"172":1}}],["生成抽象语法树",{"2":{"170":1}}],["生成访问的html文件",{"2":{"104":1}}],["k",{"2":{"666":6,"815":1,"866":4}}],["khtml",{"2":{"347":1}}],["keep",{"2":{"256":2,"265":2,"266":1}}],["keyof",{"2":{"837":1,"866":2}}],["keywords",{"2":{"701":1,"832":1}}],["keyfor",{"2":{"667":3}}],["key",{"0":{"493":1,"624":1},"2":{"490":2,"494":7,"668":2,"865":1,"866":4}}],["keyid",{"2":{"259":2}}],["keycode",{"2":{"227":1}}],["keypress按下能够影响文本显示的键",{"2":{"227":1}}],["keypress",{"2":{"227":3}}],["keypress用户按下任意键触发",{"2":{"227":1}}],["keyup",{"2":{"227":3}}],["keydown",{"2":{"227":3}}],["keys",{"2":{"13":2,"309":3,"668":2,"838":6}}],["→",{"2":{"347":7,"356":4}}],["安装时会在",{"2":{"832":1}}],["安装所需要的依赖包",{"2":{"107":1}}],["安排回调在轮询阶段完成后立即执行",{"2":{"825":1}}],["安全的",{"2":{"808":1}}],["安全性",{"0":{"561":1}}],["安全",{"2":{"461":1}}],["安全浏览器",{"2":{"347":1}}],["库",{"2":{"347":2,"382":1}}],["⚠️⚠️⚠️",{"2":{"672":2}}],["⚠️super",{"2":{"670":1}}],["⚠️反斜杠与通常的顺序相反",{"2":{"666":2}}],["⚠️",{"2":{"345":1}}],["za",{"2":{"852":2}}],["zone",{"2":{"808":1}}],["z",{"2":{"660":1,"666":6,"814":1,"815":2,"852":2,"864":4}}],["zzz",{"2":{"345":1}}],["zero",{"2":{"345":1,"641":1}}],["⌚",{"2":{"345":1}}],["❌",{"2":{"345":1,"762":2}}],["☕",{"2":{"345":1}}],["危险",{"2":{"343":3}}],["警告用户发生错误的情况",{"2":{"828":1}}],["警告",{"2":{"343":3,"777":1}}],["轻提示",{"2":{"343":3}}],["风格类",{"0":{"342":1}}],["百度一下",{"2":{"341":2}}],["部分属性",{"2":{"838":1}}],["部分",{"2":{"336":1,"345":1,"815":1}}],["腾讯云",{"0":{"334":1}}],["阿里云服务器",{"0":{"332":1},"1":{"333":1}}],["云服务器ecs",{"0":{"331":1},"1":{"332":1,"333":1,"334":1}}],["命名空间",{"2":{"618":1}}],["命名的文件",{"2":{"330":1}}],["命令空间",{"2":{"852":1}}],["命令使用",{"2":{"669":1}}],["命令可以使得",{"2":{"257":1}}],["命令的结果相同",{"2":{"114":1}}],["命令",{"2":{"113":1,"254":1}}],["规定了包括物理层的连线",{"2":{"463":1}}],["规定",{"2":{"326":1,"590":1}}],["规范主要对属性变化的是操作",{"2":{"672":2}}],["规范中建议使用",{"2":{"196":1}}],["规范中表示",{"2":{"194":1}}],["规范是为性能而设计的",{"2":{"161":1,"756":1}}],["向下滚动",{"2":{"815":1}}],["向下偏移一点了",{"2":{"326":2}}],["向上滚动",{"2":{"815":1}}],["向服务器发出预请求",{"2":{"458":1}}],["向服务器发出指定资源的请求",{"2":{"452":1}}],["向指定资源位置上传其最新内容",{"2":{"455":1}}],["向指定资源提交数据",{"2":{"453":1}}],["向指定的资源发起请求",{"2":{"451":1}}],["向",{"2":{"425":1,"564":1}}],["向着自己的目标进发",{"2":{"324":1}}],["努力下去",{"2":{"324":1}}],["走下去",{"2":{"324":1}}],["走入社会",{"2":{"324":1}}],["慢慢积累自己的经历",{"2":{"324":1}}],["往后的路还长",{"2":{"324":1}}],["～",{"2":{"324":3}}],["社会中面对着不同的层次",{"2":{"324":1}}],["学校中身边的都是你的同龄人",{"2":{"324":1}}],["靠着自己的一分热血",{"2":{"324":1}}],["靠着校招拿到一个",{"2":{"324":1}}],["沾沾自喜的我开始了第一份自己的工作",{"2":{"324":1}}],["路径目录",{"2":{"857":2}}],["路径不报错",{"2":{"857":2}}],["路径支持",{"0":{"676":1}}],["路从现在开始",{"2":{"324":1}}],["路途未知",{"2":{"324":1}}],["路由是否可用",{"2":{"480":1}}],["路由协议",{"2":{"480":1}}],["路由器",{"0":{"466":1}}],["路由",{"2":{"349":1}}],["路由url加上",{"2":{"270":1}}],["路由管理工具",{"2":{"58":1}}],["迈出校门",{"2":{"324":1}}],["年初",{"2":{"324":1}}],["毕业",{"2":{"324":1}}],["确认机制的",{"2":{"481":1}}],["确认是否租用",{"2":{"422":1}}],["确保服务端理解",{"2":{"493":1}}],["确保",{"2":{"365":1}}],["确切位置",{"2":{"323":1}}],["确定元素大小",{"2":{"718":1}}],["确定",{"2":{"480":1}}],["确定指定的节点是否包含在选区中",{"2":{"114":1}}],["确定各个模块间的边界和调用方式",{"2":{"63":1}}],["完整路径",{"2":{"676":1}}],["完全可行",{"2":{"321":1}}],["完成之前执行",{"2":{"138":1}}],["完成一次通信",{"2":{"106":1}}],["虽然是独立的文件",{"2":{"321":1}}],["更强的隔离性以及对捆绑的更好工具支持",{"2":{"853":1}}],["更好的代码重用性",{"2":{"853":1}}],["更好的二进制支持",{"2":{"489":1}}],["更多阅读",{"2":{"816":1}}],["更多",{"0":{"816":1}}],["更改元素的布局",{"2":{"658":1}}],["更改硬盘驱动器上的数据",{"2":{"321":1}}],["更新日志信息",{"2":{"832":1}}],["更新文件或文档的一部分来节省带宽",{"2":{"460":1}}],["更新配置",{"2":{"422":1}}],["更新当前页面的历史状态",{"2":{"268":1}}],["硬绑定",{"2":{"803":1}}],["硬盘中存在一个文件为",{"2":{"321":1}}],["硬链接依然占据空间",{"2":{"323":1}}],["硬链接指向文件本身",{"2":{"323":1}}],["硬链接是原始文件的镜像副本",{"2":{"320":1}}],["硬链接相当于存储在硬盘驱动器中的文件",{"2":{"320":1}}],["硬链接",{"2":{"319":1}}],["连接保持+心跳",{"0":{"491":1}}],["连接建立",{"2":{"487":1}}],["连接确认",{"2":{"487":1}}],["连接",{"0":{"487":1},"2":{"493":2,"499":1,"804":1}}],["连接两个或多个网络的硬件设备",{"2":{"466":1}}],["连接是逻辑连接",{"2":{"316":1}}],["连续点击了多次",{"2":{"168":1}}],["链",{"0":{"715":1},"2":{"715":1}}],["链路层不是通常意义的一层",{"2":{"483":1}}],["链路层",{"0":{"479":1},"2":{"427":1}}],["链接类",{"0":{"341":1}}],["链接",{"0":{"314":1},"1":{"315":1,"316":1,"317":1,"318":1,"319":1,"320":1,"321":1,"322":1,"323":1},"2":{"402":1}}],["链表倒转",{"0":{"19":1}}],["链表",{"0":{"18":1},"1":{"19":1},"2":{"13":1,"15":1}}],["也称组播地址",{"2":{"444":1}}],["也称符号链接",{"2":{"315":1}}],["也会启动一个新的",{"2":{"354":1}}],["也不一定会在",{"2":{"311":1}}],["也可以不指定参数类型",{"2":{"860":2}}],["也可以指定值",{"2":{"859":2}}],["也可以接受一个数组作为参数",{"2":{"668":1}}],["也可以生成密钥来解析数据",{"2":{"555":1}}],["也可以全称配置",{"2":{"242":1}}],["也可以转换位",{"2":{"206":1}}],["延迟脚本",{"2":{"311":1}}],["延期风险",{"2":{"67":1}}],["匹配模式对比",{"2":{"666":1}}],["匹配",{"2":{"396":2}}],["匹配文件",{"2":{"309":1}}],["匹配媒体属性相关的信息",{"2":{"149":1}}],["已遗弃",{"2":{"854":1}}],["已经被弃用",{"2":{"797":2}}],["已经随",{"2":{"508":1}}],["已经存在的",{"2":{"395":1}}],["已经定义好的模块",{"2":{"303":1}}],["已否有异常涨跌",{"2":{"47":1}}],["函数能一个定义完",{"2":{"872":1}}],["函数返回",{"2":{"872":1}}],["函数返回不要使用",{"2":{"872":1}}],["函数泛型",{"2":{"866":1}}],["函数可以重复定义类型",{"2":{"861":1}}],["函数类型",{"2":{"860":1}}],["函数本身",{"2":{"802":2}}],["函数被调用的位置",{"2":{"799":1}}],["函数都可以看成对象",{"2":{"797":1}}],["函数都在构造函数中定义",{"2":{"762":1}}],["函数的参数等信息",{"2":{"796":1}}],["函数的调用",{"2":{"796":1}}],["函数名称跟着一对小括号执行",{"2":{"784":1}}],["函数作用域",{"0":{"779":1}}],["函数复用性问题与构造函数模式相似",{"2":{"762":1}}],["函数复用无从谈起",{"2":{"762":1}}],["函数调用",{"0":{"740":1,"784":1}}],["函数执行完毕之后",{"2":{"786":1}}],["函数执行",{"2":{"669":1}}],["函数执行上下文",{"2":{"176":1}}],["函数参数默认值",{"2":{"664":2}}],["函数算法计算明文信息",{"2":{"565":1}}],["函数",{"0":{"303":1,"304":1},"2":{"642":1,"669":1,"795":1,"806":2,"828":1}}],["例子",{"0":{"644":1,"713":1},"2":{"295":1}}],["例如队列长度为",{"2":{"162":1,"757":1}}],["←",{"2":{"294":6}}],["扩充了负数的最小值",{"2":{"294":1}}],["扩展配置",{"2":{"857":2}}],["扩展",{"0":{"204":1,"251":1,"307":1,"588":1,"717":1},"1":{"205":1,"206":1,"308":1,"309":1,"589":1,"590":1,"591":1,"592":1,"593":1,"594":1,"595":1},"2":{"643":1,"718":1}}],["补码具有两种表示形式",{"2":{"294":1}}],["补码",{"0":{"294":1}}],["补充",{"2":{"191":1}}],["减法",{"2":{"293":1}}],["减少访问的次数",{"2":{"716":1}}],["减少网络上的通信量",{"2":{"549":1}}],["减少关键资源的请求数量以及大小",{"2":{"376":1}}],["减少缩进",{"2":{"113":1}}],["减少对象的创建",{"2":{"55":1}}],["减少运行次数",{"2":{"53":1}}],["减少计算等待时长",{"2":{"53":1}}],["减少计算耗时",{"2":{"53":1}}],["减少浏览器渲染过程中的计算耗时",{"2":{"52":1}}],["减少页面二次请求和渲染的耗时",{"2":{"51":1}}],["减少白屏时间",{"2":{"51":1}}],["减少通信次数",{"2":{"50":1}}],["减少传输数据大小",{"2":{"50":1}}],["减少请求资源的体积",{"2":{"50":1}}],["减少",{"2":{"50":1,"52":2}}],["减少耗时",{"2":{"49":1}}],["八进制",{"2":{"290":1}}],["八进制转换",{"0":{"290":1}}],["依次累加",{"2":{"865":1}}],["依次类推",{"2":{"288":1,"296":1}}],["依然有效",{"2":{"666":2}}],["依据路由表的信息",{"2":{"466":1}}],["依旧存在",{"2":{"322":2}}],["依赖于模块加载器",{"2":{"853":1}}],["依赖于其他的分支可以回基到想要的分支上",{"2":{"257":1}}],["依赖的上游",{"2":{"255":1}}],["依赖倒置",{"2":{"35":1,"63":1}}],["余",{"2":{"287":3}}],["舍入为",{"2":{"282":1}}],["偶数",{"2":{"282":1}}],["之外的其他",{"2":{"814":1}}],["之间由指定字符串分隔",{"2":{"641":1}}],["之间的整数=",{"2":{"282":2}}],["之一",{"2":{"519":1}}],["之内",{"2":{"379":1}}],["之后各个组成部分的字符范围",{"2":{"815":1}}],["之后",{"2":{"368":1,"422":1}}],["之后再计算当前位置偏移高度",{"2":{"191":2}}],["−9007199254740992",{"2":{"282":1}}],["≈",{"2":{"280":2}}],["半精度",{"0":{"279":1}}],["十进制",{"2":{"287":1}}],["十进制舍入",{"2":{"278":1}}],["十六进制",{"2":{"289":1,"432":1,"814":1}}],["十六进制转换",{"0":{"289":1}}],["十六进制转换成",{"0":{"208":1}}],["十六进制颜色带透明度的颜色值",{"2":{"208":2}}],["四倍精度",{"0":{"277":1}}],["四种情况",{"2":{"8":1}}],["双重扩展",{"0":{"276":1}}],["双精度浮点数",{"2":{"295":1}}],["双精度",{"0":{"275":1}}],["双击鼠标按钮",{"2":{"226":1}}],["约",{"2":{"274":1,"275":1,"276":1,"277":1}}],["约定规范",{"0":{"30":1}}],["基本类型",{"2":{"793":1}}],["基本原始类型数据存放与栈空间中",{"2":{"790":1}}],["基本原始类型",{"2":{"788":1}}],["基本别废弃",{"2":{"703":1}}],["基本使用",{"0":{"675":1}}],["基本格式",{"0":{"273":1},"1":{"274":1,"275":1,"276":1,"277":1,"278":1,"279":1}}],["基于可变长子网掩码",{"2":{"551":1}}],["基于字节流的通信协议",{"2":{"481":1}}],["基于",{"2":{"393":1,"464":1}}],["基线自动设置为",{"2":{"326":1}}],["基线是底部边沿",{"2":{"326":1}}],["基础",{"0":{"855":1},"1":{"856":1,"857":1,"858":1,"859":1,"860":1,"861":1,"862":1,"863":1,"864":1,"865":1,"866":1}}],["基础盒模型",{"0":{"585":1}}],["基础库变更报警",{"0":{"27":1}}],["基础服务组件",{"2":{"23":1}}],["基础框架层",{"2":{"23":1}}],["现实当中",{"2":{"311":1}}],["现代计算机中的浮点",{"2":{"272":1}}],["现有框架",{"2":{"59":1}}],["打开",{"2":{"321":2}}],["打开显示错误",{"2":{"318":2}}],["打开新的",{"2":{"271":1}}],["打印情况",{"2":{"158":2,"753":2}}],["打印出来",{"2":{"157":2,"752":2}}],["端口号",{"2":{"271":2,"486":1}}],["则事件循环可能继续到检查阶段而不是等待",{"2":{"825":1}}],["则事件循环将绕回计时器阶段以执行计时器回调",{"2":{"824":1}}],["则事件循环将结束轮询阶段",{"2":{"824":1}}],["则事件循环将等待回调被添加到队列中",{"2":{"819":1,"824":1}}],["则事件结束轮询阶段",{"2":{"819":1}}],["则需要用",{"2":{"718":1}}],["则这两个",{"2":{"416":1}}],["则将下边距边缘与父对象的基线对齐",{"2":{"326":1}}],["则返回空字符串",{"2":{"271":1}}],["则不会",{"2":{"268":1}}],["个属性",{"2":{"717":1}}],["个内置的",{"2":{"667":1}}],["个人申请的证书属于",{"2":{"568":1}}],["个",{"2":{"283":5,"348":4,"432":1,"815":1}}],["个指数位的系数",{"2":{"280":1}}],["个符号位",{"2":{"280":1}}],["个十进制数",{"2":{"274":1,"275":1,"276":1,"277":1}}],["个或者多个字符",{"2":{"271":1}}],["个版本以前",{"2":{"263":1}}],["哈希路由",{"0":{"270":1}}],["应用的是默认绑定",{"2":{"808":1}}],["应用的模块与层级划分",{"0":{"33":1}}],["应用了默认绑定",{"2":{"802":2}}],["应用程序与网络协议栈进行交互的接口",{"2":{"485":1}}],["应用程序通过网络协议进行通信的接口",{"2":{"485":1}}],["应用程序访问通信协议的操作系统调用套接字",{"2":{"485":1}}],["应用层",{"0":{"471":1,"482":1},"2":{"427":1}}],["应用在历史记录导航上设置默认滚动行为",{"2":{"268":1}}],["允许使用",{"2":{"857":2}}],["允许用户处理错误",{"2":{"830":1}}],["允许在调用回调之前初始化所有的变量",{"2":{"828":1}}],["允许通过递归调用来阻止i",{"2":{"828":1}}],["允许同源访问",{"2":{"683":1}}],["允许跨域就可以访问",{"2":{"682":1}}],["允许跨域",{"2":{"682":2}}],["允许跨域请求访问到它们的资源",{"2":{"406":1}}],["允许限制元素的渲染范围",{"2":{"656":1}}],["允许对被选择元素的特定部分修改样式",{"2":{"632":1}}],["允许获取当前页面的域名以及设置域名下的子域名",{"2":{"417":1}}],["允许",{"2":{"268":1}}],["允许全局使用return语句",{"2":{"237":1}}],["手册帮助",{"2":{"832":1}}],["手动遍历",{"2":{"669":1}}],["手动配置",{"2":{"421":1}}],["手动调用",{"2":{"268":1}}],["手势事件",{"2":{"234":1}}],["状态码的第一个数字代表了响应的五种状态之一",{"2":{"500":1}}],["状态码",{"0":{"500":1},"1":{"501":1,"502":1,"503":1,"504":1,"505":1,"506":1,"507":1,"508":1,"509":1,"510":1,"511":1,"512":1,"513":1,"514":1,"515":1,"516":1,"517":1,"518":1,"519":1,"520":1,"521":1,"522":1,"523":1,"524":1,"525":1,"526":1,"527":1,"528":1,"529":1,"530":1,"531":1,"532":1,"533":1,"534":1,"535":1,"536":1,"537":1,"538":1,"539":1,"540":1,"541":1,"542":1,"543":1,"544":1},"2":{"501":1}}],["状态代码",{"2":{"490":1}}],["状态",{"2":{"268":1}}],["状态对象",{"2":{"268":2}}],["状态管理工具",{"2":{"58":1}}],["负载定义注意声明的顺序",{"2":{"872":1}}],["负载",{"2":{"861":1}}],["负责收据并维护所有声明的标识符",{"2":{"766":1}}],["负责处理解析和执行",{"2":{"730":1}}],["负责渲染页面",{"2":{"730":1}}],["负责页面渲染",{"2":{"729":1}}],["负责管理计算机通信设备和网络媒体之间的互通",{"2":{"477":1}}],["负责网络寻址",{"2":{"476":1}}],["负责单个",{"2":{"350":1}}],["负责",{"2":{"349":1}}],["负数二进制可以用补码表示",{"2":{"294":1}}],["负数的反码是在其原码的基础上",{"2":{"293":1}}],["负数",{"2":{"268":1}}],["负值表示逆时针旋转",{"2":{"234":1}}],["区分",{"2":{"618":2}}],["区分网段",{"2":{"480":1}}],["区分两台主机是否属于同一网络",{"2":{"480":1}}],["区别",{"0":{"323":1},"2":{"266":1}}],["区间为",{"2":{"210":2}}],["恢复",{"2":{"860":2}}],["恢复执行",{"2":{"669":1}}],["恢复工作区的文件",{"2":{"261":1}}],["恢复存在的提交记录",{"2":{"258":1}}],["​",{"2":{"259":2,"262":4,"265":4}}],["精简分支树",{"2":{"257":1}}],["精简提交记录",{"2":{"257":1}}],["报错",{"2":{"664":3,"669":1}}],["报",{"2":{"329":1}}],["报告核心常见问题的规则子集",{"2":{"251":1}}],["报警",{"0":{"28":1},"2":{"23":1}}],["└─┬",{"2":{"250":1,"857":2}}],["└──┤",{"2":{"820":1}}],["└───────────────────────────┘",{"2":{"820":1}}],["└───────────────┘",{"2":{"820":1}}],["└─────────────┬─────────────┘",{"2":{"820":5}}],["└──",{"2":{"250":2,"850":22,"857":6}}],["│",{"2":{"250":1,"820":30,"850":18,"857":4}}],["├──",{"2":{"250":3,"850":18,"857":6}}],["层次结构",{"2":{"250":1}}],["层的概念",{"2":{"433":1}}],["层的接口测试",{"2":{"23":1}}],["层的",{"2":{"23":1}}],["级绑定事件",{"0":{"710":1},"1":{"711":1,"712":1,"713":1}}],["级联",{"2":{"250":1}}],["级事件处理程序",{"0":{"217":1,"218":1}}],["共享配置",{"0":{"249":1}}],["共同加入到",{"2":{"106":1}}],["禁止使用",{"0":{"248":1},"2":{"761":1}}],["行",{"2":{"815":3}}],["行的开头",{"2":{"815":2}}],["行框内的高度",{"2":{"630":1}}],["行框内文字",{"2":{"629":1}}],["行框元素",{"2":{"627":1}}],["行内样式",{"2":{"718":2}}],["行内引述内容",{"2":{"693":3}}],["行内执行顺序",{"0":{"679":1}}],["行内块级元素",{"2":{"643":1}}],["行内元素",{"0":{"627":1},"1":{"628":1,"629":1,"630":1},"2":{"599":1,"627":1,"643":1}}],["行内元素设置垂直间距不适用",{"2":{"578":1}}],["行内元素设置水平间距可以适用",{"2":{"578":1}}],["行内盒子",{"2":{"587":1}}],["行内级盒子",{"2":{"587":1}}],["行内级元素",{"2":{"587":1}}],["行内内容",{"2":{"583":3}}],["行内格式化上下文填充和边框不会将行框撑开",{"2":{"578":1}}],["行内格式化上下文",{"2":{"577":1}}],["行内注释",{"0":{"246":1}}],["行走",{"2":{"233":1}}],["顺序不绝对先后",{"2":{"680":1}}],["顺序",{"2":{"234":1}}],["触摸事件",{"2":{"234":1}}],["触摸与手势事件",{"0":{"234":1}}],["触发顺序",{"2":{"225":1}}],["触发条件",{"2":{"224":1}}],["触发",{"2":{"224":1}}],["掉下",{"2":{"233":1}}],["号后面的所有字符串",{"2":{"232":1}}],["及",{"2":{"232":1}}],["及时解除引用",{"2":{"55":1}}],["及时进行缓存清理",{"2":{"55":1}}],["下联网络协议栈",{"2":{"485":1}}],["下载完毕",{"2":{"425":1}}],["下一行",{"2":{"246":2}}],["下运行",{"2":{"232":2}}],["下划线",{"2":{"113":1,"690":1}}],["稳妥构造函数模式",{"2":{"761":1}}],["稳妥",{"2":{"232":1}}],["指针指向这个函数",{"2":{"761":1}}],["指明一个",{"2":{"545":1}}],["指示获取资源的请求是从什么域发起的",{"2":{"415":1}}],["指示预请求的结果能被缓存多久",{"2":{"412":1}}],["指示哪些",{"2":{"411":1}}],["指示实际的请求中可以使用哪些",{"2":{"409":1}}],["指示当请求的凭证标记为",{"2":{"408":1}}],["指示请求的资源能共享给哪些域",{"2":{"407":1}}],["指令把",{"2":{"368":1}}],["指向当前子类",{"2":{"864":1}}],["指向当前类的实例对象",{"2":{"864":1}}],["指向当前的子类实例",{"2":{"670":1}}],["指向函数的作用域",{"2":{"797":1}}],["指向函数",{"2":{"797":1}}],["指向环境",{"2":{"794":1}}],["指向变量对象",{"2":{"770":1}}],["指向后一个同辈元素",{"2":{"717":1}}],["指向前一个同辈元素",{"2":{"717":1}}],["指向最后一个子元素",{"2":{"717":1}}],["指向第一个子元素",{"2":{"717":1}}],["指向子类",{"2":{"670":1}}],["指向父类",{"2":{"670":1,"864":1}}],["指向父类的原型对象",{"2":{"670":1,"864":1}}],["指向语言内部使用的方法",{"2":{"667":1}}],["指向",{"2":{"424":1}}],["指向硬盘驱动器上完全相同的位置",{"2":{"321":1}}],["指向不能认为始终等于事件目标",{"2":{"222":1}}],["指数对齐相加",{"0":{"298":1}}],["指数对齐",{"2":{"297":1}}],["指数表示法",{"2":{"296":1}}],["指数偏差",{"2":{"283":1}}],["指数",{"2":{"283":1}}],["指数可以表示的数",{"2":{"280":1}}],["指定下标元素类型",{"2":{"859":2}}],["指定输出文件",{"2":{"857":2}}],["指定输出目录",{"2":{"857":2}}],["指定哪些包使用",{"2":{"857":2}}],["指定哪些文件需要上传到包中",{"2":{"832":1}}],["指定",{"2":{"857":2}}],["指定插件",{"2":{"857":2}}],["指定了",{"2":{"857":2}}],["指定了unload事件处理程序的页面会被排除在bfcache之外",{"2":{"231":1}}],["指定为",{"2":{"837":1,"863":1}}],["指定运行环境变量",{"2":{"832":1}}],["指定运行环境",{"2":{"832":1}}],["指定边框",{"2":{"718":2}}],["指定允许的服务器元和脚本端点",{"2":{"701":1}}],["指定编码集",{"2":{"701":1}}],["指定要选择的元素的特殊状态",{"2":{"634":1}}],["指定对预请求的响应中",{"2":{"410":1}}],["指定规则",{"2":{"246":8}}],["指定全局环境",{"0":{"241":1}}],["指定预处理器",{"0":{"239":1}}],["指定解析环境",{"0":{"240":1}}],["指定解析",{"0":{"238":1}}],["指定解析选项",{"0":{"237":1}}],["形成一个执行栈",{"2":{"733":1}}],["形成一个新的格式化上下文",{"2":{"660":1}}],["形成堆叠上下文",{"2":{"660":1}}],["形成完整的dom树之后触发",{"2":{"230":1}}],["形象举例",{"2":{"422":1}}],["形式",{"2":{"208":4,"209":2}}],["形式是",{"2":{"208":2}}],["95ca",{"2":{"494":1}}],["9f78",{"2":{"428":2}}],["9f49",{"2":{"428":4}}],["9f",{"2":{"428":4,"812":1}}],["98",{"2":{"428":2}}],["9",{"0":{"295":1},"1":{"296":1,"297":1,"298":1,"299":1},"2":{"283":1,"344":2,"450":1,"815":1}}],["9007199254740992",{"2":{"282":1}}],["900px",{"2":{"188":2}}],["90右旋转的横向模式",{"2":{"233":1}}],["90左旋转的横向模式",{"2":{"233":1}}],["9脚本输入",{"2":{"227":1}}],["什么位置上的键",{"2":{"227":1}}],["转义序列",{"0":{"814":1},"2":{"812":1}}],["转义标签",{"2":{"698":3}}],["转交到协程",{"2":{"669":1}}],["转成",{"2":{"356":1}}],["转换位可执行代码",{"2":{"766":1}}],["转换为屏幕上的像素所执行的一系列步骤",{"2":{"369":1}}],["转换为二进制为",{"2":{"287":1}}],["转换成",{"0":{"210":1,"211":1}}],["转换成十六进制",{"0":{"209":1}}],["转换成一个链接",{"2":{"113":1}}],["转为实际字符",{"2":{"227":1}}],["键值字符串",{"2":{"865":1}}],["键值数字类型依次类推",{"2":{"865":1}}],["键码",{"2":{"227":1}}],["键盘与文本事件",{"0":{"227":1}}],["释放键触发",{"2":{"227":1}}],["释放鼠标",{"2":{"226":1}}],["计时器回调尽可能早的运行",{"2":{"821":1}}],["计时器和",{"2":{"819":1,"824":1}}],["计时完毕后",{"2":{"730":1}}],["计数器的使用",{"2":{"659":1}}],["计数",{"2":{"226":1,"640":1}}],["计算应该阻塞和轮询",{"2":{"819":1,"824":1}}],["计算密钥",{"0":{"554":1}}],["计算开始位置",{"2":{"191":1}}],["计算开始位置滚动条高度",{"2":{"190":2}}],["计算可视区域数据",{"2":{"190":2}}],["计算样式",{"2":{"188":2}}],["计算当前页数",{"2":{"188":2}}],["计算当前节点的高度",{"2":{"21":1}}],["计算滚动之后的需要替换的节点个数",{"2":{"188":2}}],["计算",{"0":{"53":1},"2":{"352":1}}],["计算机通信或网上设备的共同语言",{"2":{"469":1}}],["计算机局域网技术",{"2":{"463":1}}],["计算机网络名词",{"0":{"462":1},"1":{"463":1,"464":1,"465":1,"466":1,"467":1}}],["计算机网络相互连接进行通信而设计的协议",{"2":{"435":1}}],["计算机专业什么都学",{"2":{"324":1}}],["计算机编码方式",{"0":{"291":1},"1":{"292":1,"293":1,"294":1}}],["计算机",{"2":{"50":1}}],["计算内存中二进制处理运算",{"2":{"3":1}}],["78f8",{"2":{"428":4}}],["70ff",{"2":{"428":4}}],["70",{"2":{"428":4}}],["7a",{"2":{"428":4}}],["79",{"2":{"276":1}}],["754",{"0":{"272":1},"1":{"273":1,"274":1,"275":1,"276":1,"277":1,"278":1,"279":1,"280":1,"281":1,"282":1,"283":1,"284":1,"285":1,"286":1,"287":1,"288":1,"289":1,"290":1,"291":1,"292":1,"293":1,"294":1,"295":1,"296":1,"297":1,"298":1,"299":1},"2":{"283":1}}],["7语音输入",{"2":{"227":1}}],["7",{"2":{"226":1,"232":2,"274":1,"283":1,"344":2,"428":2,"429":1,"761":1}}],["次鼠标按钮",{"2":{"226":1}}],["位于底部",{"2":{"595":2}}],["位于数据链路层",{"2":{"467":1}}],["位主机号",{"2":{"550":1}}],["位地址",{"2":{"547":1}}],["位组也不能全置为",{"2":{"446":1}}],["位是主机号",{"2":{"429":1}}],["位是网络号",{"2":{"429":1}}],["位中",{"2":{"429":1}}],["位的",{"2":{"429":1}}],["位有效域",{"2":{"284":1}}],["位指数位",{"2":{"284":1}}],["位表示标志位",{"2":{"284":1}}],["位浮点数标准",{"2":{"284":1}}],["位浮点值",{"2":{"279":1}}],["位精度",{"2":{"283":1}}],["位双精度",{"2":{"280":1}}],["位",{"2":{"274":2,"275":2,"276":1,"277":1,"280":1,"284":1,"429":10,"430":1}}],["位置",{"2":{"226":1}}],["位运算",{"0":{"3":1},"1":{"4":1,"5":1}}],["客户区大小",{"2":{"718":1}}],["客户区坐标位置",{"2":{"226":1}}],["客户端需要进行身份验证才能获得网络访问权限",{"2":{"544":1}}],["客户端需要有个",{"2":{"424":1}}],["客户端必须在代理服务器上进行身份验证",{"2":{"535":1}}],["客户端错误",{"2":{"527":1}}],["客户端应该假定服务器已经收到数据",{"2":{"521":1}}],["客户端确认了此描述",{"2":{"487":1}}],["客户端的套接字提出连接请求",{"2":{"487":1}}],["客户端请求",{"2":{"487":1}}],["客户端会请求这些文件",{"2":{"425":1}}],["客户端一个配置文件包括内核",{"2":{"425":1}}],["客户端向",{"2":{"425":1}}],["客户端调入内存",{"2":{"423":1}}],["客户端在",{"2":{"423":1}}],["客户端和服务端建立安全通信验证",{"2":{"393":1}}],["客户端渲染",{"2":{"381":1}}],["客户端",{"0":{"498":1},"2":{"108":1,"425":2,"490":1}}],["点击两次触发顺序",{"2":{"226":1}}],["点我显示",{"2":{"168":2}}],["任何时候再给定的阶段中调用",{"2":{"820":1}}],["任何子元素都基于元素定位",{"2":{"660":1}}],["任何外部都不能影响内部布局",{"2":{"658":1}}],["任何获得焦点的元素都能触发keypress事件",{"2":{"227":1}}],["任意鼠标按钮",{"2":{"226":1}}],["任务中",{"2":{"185":1}}],["鼠标点击",{"2":{"730":1}}],["鼠标滚轮事件",{"2":{"226":1}}],["鼠标按钮",{"2":{"226":1}}],["鼠标光标在页面中的位置",{"2":{"226":1}}],["鼠标在元素内部移动触发",{"2":{"226":1}}],["鼠标从元素内部移动到外部触发",{"2":{"226":1}}],["鼠标移动从元素外部首次移动到元素范围之内触发",{"2":{"226":1}}],["鼠标与滚轮事件",{"0":{"226":1}}],["鼠标和键盘",{"2":{"224":1}}],["失去焦点时触发",{"2":{"225":1}}],["焦点事件",{"0":{"225":1}}],["窗口或者框架的大小变化时触发",{"2":{"224":1}}],["嵌套计数器",{"2":{"641":1}}],["嵌套计数",{"2":{"640":1}}],["嵌套代码的复杂度等于嵌套内外复杂度的乘积",{"2":{"1":1}}],["嵌入的内容触发",{"2":{"224":1}}],["包的目录以及文件",{"2":{"870":1}}],["包结构",{"2":{"870":1}}],["包名",{"2":{"832":1}}],["包含",{"2":{"863":2}}],["包含自身",{"2":{"717":1}}],["包含元素的后代不会显示在其边界之外",{"2":{"660":1}}],["包含元素相对于布局来说是完全透明的",{"2":{"658":1}}],["包含固有的大小",{"2":{"655":1}}],["包含块",{"2":{"587":1}}],["包含了其内部所有的内容",{"2":{"575":1}}],["包含一位隐含位",{"2":{"284":1}}],["包含一个隐含位",{"2":{"280":1}}],["包含滚动距离",{"2":{"226":1}}],["包含图像文件",{"2":{"224":1}}],["包括文字颜色",{"2":{"815":1}}],["包括",{"2":{"815":1}}],["包括元素的宽度",{"2":{"718":1}}],["包括元素的高度",{"2":{"718":1}}],["包括位置信息",{"2":{"666":1}}],["包括使用所有",{"2":{"575":1}}],["包括渲染",{"2":{"349":1}}],["包括鼠标",{"2":{"234":1}}],["包括技术储备",{"2":{"128":1}}],["包括页面加载耗时",{"2":{"41":1}}],["包括常见的",{"2":{"41":1}}],["激活",{"2":{"224":1}}],["捕获所有",{"2":{"810":2}}],["捕获外部",{"2":{"669":1}}],["捕获内部",{"2":{"669":1}}],["捕获错误",{"2":{"669":1}}],["捕获",{"2":{"221":1}}],["说明浮点数相加之后的偏差原因",{"2":{"295":1}}],["说明",{"0":{"578":1,"581":1},"2":{"221":1,"222":1,"548":2,"650":1}}],["始终等于",{"2":{"221":1}}],["始终为false",{"2":{"112":2}}],["倒序执行",{"2":{"219":1}}],["支持扩展",{"2":{"489":1}}],["支持双向通信",{"2":{"489":1}}],["支持热键",{"2":{"227":1}}],["支持捕获",{"2":{"225":2}}],["支持",{"2":{"212":1}}],["567",{"2":{"835":2}}],["511",{"0":{"544":1}}],["504",{"0":{"543":1}}],["503",{"0":{"542":1}}],["502",{"0":{"541":1}}],["501",{"0":{"540":1}}],["500",{"0":{"539":1}}],["5xx",{"0":{"538":1},"1":{"539":1,"540":1,"541":1,"542":1,"543":1,"544":1}}],["52+",{"2":{"656":1}}],["5234",{"2":{"428":2}}],["52位尾数",{"2":{"295":1}}],["52",{"2":{"283":1,"284":1,"298":1}}],["53",{"2":{"275":1,"280":1,"283":1,"284":1}}],["5个状态",{"2":{"230":1}}],["5表单中选择某一项输入",{"2":{"227":1}}],["5表示手柄",{"2":{"227":1}}],["5+和",{"2":{"225":2}}],["5+",{"2":{"225":2}}],["5",{"2":{"210":2,"211":2,"225":2,"226":1,"237":2,"283":1,"311":2,"312":1,"344":2,"429":1,"666":1,"668":6,"717":1,"761":1,"762":1,"806":2,"860":2}}],["5s",{"2":{"168":2,"379":1}}],["qdisc",{"2":{"433":3}}],["q",{"0":{"693":1},"2":{"210":18,"265":6,"294":1,"693":4}}],["queryselectorall",{"2":{"717":1}}],["queryselector",{"2":{"717":1}}],["querycommandstate",{"2":{"113":1}}],["querycommandenabled",{"2":{"113":1}}],["queueing",{"2":{"433":1}}],["quads",{"2":{"366":1,"368":1}}],["quit",{"2":{"256":2,"259":2}}],["quiet",{"2":{"253":2}}],["quote",{"2":{"640":4}}],["quotes",{"2":{"245":2}}],["quot",{"0":{"673":2},"1":{"674":2,"675":2,"676":2,"677":2,"678":2,"679":2,"680":2,"681":2,"682":2,"683":2,"684":2},"2":{"104":8,"114":2,"131":20,"134":4,"146":20,"147":40,"156":8,"168":4,"188":32,"195":8,"216":4,"217":4,"218":4,"219":4,"239":44,"241":20,"242":24,"244":8,"245":20,"247":14,"249":12,"326":14,"328":4,"339":4,"402":18,"424":4,"591":8,"592":16,"593":16,"594":36,"595":12,"608":2,"646":64,"666":20,"667":4,"675":4,"677":12,"678":16,"679":20,"680":12,"681":32,"682":24,"683":40,"684":8,"689":4,"694":4,"701":2,"713":12,"715":4,"717":16,"718":10,"751":8,"815":1,"843":4,"848":6,"849":12,"850":48,"852":4,"854":20,"857":16,"870":4,"871":4,"876":12}}],["亮度",{"2":{"210":1}}],["饱和度",{"2":{"210":1}}],["色调",{"2":{"210":1}}],["$100",{"2":{"666":2}}],["$uri",{"2":{"269":4}}],["$",{"2":{"208":6,"209":6,"402":1,"666":12,"815":1}}],["44",{"2":{"666":4}}],["4px",{"2":{"647":2}}],["415",{"0":{"537":1}}],["40+",{"2":{"656":1}}],["40px",{"2":{"618":2}}],["408",{"0":{"536":1}}],["407",{"0":{"535":1}}],["406",{"0":{"534":1}}],["405",{"0":{"533":1}}],["404",{"0":{"532":1}}],["403",{"0":{"531":1}}],["402",{"0":{"530":1}}],["401",{"0":{"529":1}}],["400",{"0":{"528":1}}],["4xx",{"0":{"527":1},"1":{"528":1,"529":1,"530":1,"531":1,"532":1,"533":1,"534":1,"535":1,"536":1,"537":1}}],["47da",{"2":{"494":1}}],["49",{"2":{"428":4}}],["43200",{"2":{"424":2}}],["4kb",{"2":{"393":1}}],["4️⃣",{"2":{"345":1}}],["4使用ime输入",{"2":{"227":1}}],["4表示移动设备键盘",{"2":{"227":1}}],["4",{"2":{"208":8,"211":2,"226":1,"237":1,"274":1,"282":1,"287":2,"288":3,"289":1,"296":2,"297":2,"344":2,"594":2,"666":3,"668":8,"761":1,"762":1,"859":4,"860":2}}],["4位",{"2":{"208":4}}],["60",{"2":{"674":1}}],["60fps",{"2":{"52":1}}],["61",{"2":{"674":1}}],["63",{"2":{"428":4}}],["67",{"2":{"422":2}}],["68",{"2":{"422":2}}],["65534",{"2":{"429":1,"440":1}}],["65",{"2":{"290":1}}],["64",{"2":{"275":1,"280":1,"283":4,"284":1,"428":12}}],["6手写输入",{"2":{"227":1}}],["6",{"0":{"295":1,"296":1},"1":{"296":1,"297":1,"298":1,"299":1},"2":{"208":4,"210":6,"211":4,"226":1,"237":1,"288":2,"296":4,"297":4,"298":1,"312":1,"344":2,"428":2,"432":1,"446":1,"666":1,"668":6,"762":1}}],["6位",{"2":{"208":4}}],["颜色输出不一样的信息",{"2":{"858":1}}],["颜色和其他选项",{"2":{"813":1}}],["颜色值变换",{"0":{"207":1},"1":{"208":1,"209":1,"210":1,"211":1}}],["颜色字符串",{"2":{"113":2}}],["二层",{"2":{"433":1}}],["二级域名",{"2":{"397":1}}],["二级标题名称",{"2":{"337":2}}],["二级标题",{"2":{"337":2,"688":1}}],["二进制正数转换负数",{"2":{"294":1}}],["二进制十进制",{"2":{"294":1}}],["二进制",{"2":{"289":1,"290":1}}],["二进制转换",{"0":{"286":1},"1":{"287":1,"288":1}}],["二进制格式至少占用",{"2":{"276":1}}],["二进制数据",{"2":{"206":1}}],["二叉树",{"2":{"20":1}}],["读取访问",{"2":{"403":1}}],["读取",{"0":{"394":1}}],["读取了",{"2":{"330":1}}],["读取的流",{"2":{"206":1}}],["读取失败",{"2":{"202":2,"203":2}}],["读取成功",{"2":{"202":2,"203":2}}],["读写分离",{"2":{"51":1,"65":1}}],["非相对路径会根据",{"2":{"846":1}}],["非相对路径",{"0":{"846":1},"2":{"848":1,"849":1}}],["非确定性",{"2":{"827":1}}],["非阻塞",{"0":{"819":1}}],["非军事区",{"2":{"808":1}}],["非严格模式",{"2":{"801":2}}],["非浮动元素与非浮动元素之间正常定位",{"2":{"600":1}}],["非浮动元素设置",{"2":{"600":1}}],["非对称",{"2":{"556":1}}],["非对称加密套件列表以及",{"2":{"559":1,"563":1}}],["非对称加密算法效率太慢",{"2":{"558":1}}],["非对称加密",{"0":{"556":1,"559":1},"1":{"557":1,"558":1,"560":1,"561":1}}],["非安全模式下不支持",{"2":{"200":2}}],["非活动对象",{"2":{"181":1}}],["此后再调用",{"2":{"669":1}}],["此方式为了规范不推荐",{"2":{"648":1}}],["此代码在全局无法运行",{"2":{"200":2}}],["此时运行代码会发现还是没有过渡效果",{"2":{"168":2}}],["内存管理",{"0":{"792":1},"1":{"793":1,"794":1,"795":1}}],["内存空间",{"0":{"788":1},"1":{"789":1,"790":1,"791":1}}],["内存整理",{"2":{"181":1,"182":1}}],["内部函数可以访问外部函数声明中的变量",{"2":{"772":1}}],["内部",{"2":{"669":1,"806":2}}],["内部表示",{"0":{"283":1}}],["内联样式",{"2":{"718":2}}],["内联元素",{"2":{"627":1}}],["内联格式上下文存在于其他格式上下文中",{"2":{"577":1}}],["内容格式",{"2":{"701":1}}],["内容不存在遮盖",{"2":{"599":1}}],["内容流",{"2":{"586":1}}],["内容边界",{"2":{"585":1}}],["内边距边界",{"2":{"585":1}}],["内边距",{"2":{"583":3,"586":1}}],["内置",{"2":{"567":1}}],["内核如果需要通过某个网络接口发送数据包",{"2":{"433":1}}],["内核",{"2":{"425":1}}],["内核启动",{"2":{"423":1}}],["内单个站点",{"2":{"350":1}}],["内触发",{"2":{"198":1}}],["态的",{"2":{"198":1}}],["相反",{"2":{"838":1}}],["相当于增加新的属性类型定义",{"2":{"837":1}}],["相等",{"0":{"720":1}}],["相等性",{"0":{"719":1},"1":{"720":1,"721":1,"722":1,"723":1},"2":{"719":1}}],["相邻的两个元素之间的外边距重叠",{"2":{"583":1}}],["相对",{"2":{"857":2}}],["相对于",{"2":{"857":2}}],["相对于文字的",{"2":{"630":2}}],["相对路径",{"0":{"846":1},"2":{"848":1,"849":1}}],["相对上一个非浮动元素的位置",{"2":{"600":1}}],["相对地址",{"2":{"268":2}}],["相对屏幕",{"2":{"226":1}}],["相关的回调",{"2":{"819":1,"824":1}}],["相关的读取权限操作可以查看",{"2":{"198":1}}],["相关的",{"2":{"198":1}}],["相关的操作",{"2":{"196":1}}],["相关操作",{"2":{"197":1}}],["相关",{"2":{"196":1}}],["相同则返回",{"2":{"480":1}}],["相同",{"2":{"321":1}}],["相同实例还可以重新唤起",{"2":{"159":1,"754":1}}],["相同的元素",{"2":{"12":1}}],["还需要有定位功能",{"2":{"432":1}}],["还没完全加载",{"2":{"230":1}}],["还可以采用",{"2":{"195":2}}],["还请多多指点",{"2":{"192":1}}],["还有一个作用就是解释执行字节码",{"2":{"174":1}}],["初始位置",{"2":{"191":2}}],["初始的高度",{"2":{"188":2}}],["项",{"2":{"190":2}}],["项目文件目录依赖关系",{"2":{"857":2}}],["项目",{"2":{"857":2}}],["项目启动",{"0":{"109":1}}],["项目入口",{"2":{"106":1}}],["项目目录",{"2":{"102":2,"104":2}}],["项目利用",{"2":{"101":1}}],["项目地址",{"2":{"99":1}}],["项目前期准备与复盘",{"0":{"67":1}}],["项目管理",{"2":{"65":1}}],["项目代码量过大",{"0":{"65":1}}],["项目复杂熟悉成本过高",{"0":{"64":1}}],["项目质量",{"2":{"61":1}}],["项目规模调整后",{"2":{"63":1}}],["项目规模",{"2":{"59":1}}],["项目设计",{"0":{"57":1},"1":{"58":1,"59":1,"60":1,"61":1,"62":1,"63":1,"64":1,"65":1,"66":1,"67":1}}],["保护属性",{"2":{"864":1}}],["保证",{"2":{"857":2}}],["保证文件的相对应用不报错",{"2":{"857":2}}],["保证相对引用正确",{"2":{"850":1}}],["保证用户代码的其余部分之后在让事件循环继续进行之前",{"2":{"828":1}}],["保证计算的开始位置",{"2":{"191":1}}],["保证计算的开始位置和结束位置都在可视区域",{"2":{"190":1}}],["保存页面的状态",{"2":{"231":1}}],["保存代码",{"2":{"100":1}}],["等价于",{"2":{"718":6}}],["等信息",{"2":{"683":2}}],["等网络的互连",{"2":{"466":1}}],["等式要必须成立",{"2":{"188":2}}],["等等",{"2":{"168":1}}],["取决于函数在哪调用",{"2":{"799":1}}],["取得自定义属性的值",{"2":{"717":2}}],["取其中一个",{"2":{"582":1}}],["取出",{"2":{"480":1}}],["取反",{"2":{"294":1}}],["取消事件冒泡",{"2":{"222":1}}],["取消事件的冒泡行为",{"2":{"221":1}}],["取消事件的进一步冒泡或捕获",{"2":{"221":1}}],["取消事件的默认行为",{"2":{"221":1,"222":1}}],["取消执行",{"2":{"95":1}}],["取值0开始",{"2":{"859":2}}],["取值",{"0":{"630":1,"640":1},"2":{"198":1,"268":1,"815":2}}],["取整为",{"2":{"282":1}}],["取整",{"2":{"188":2}}],["按下非字符键触发顺序",{"2":{"227":1}}],["按下字符键触发顺序",{"2":{"227":1}}],["按住不放时",{"2":{"227":2}}],["按先后顺序执行",{"2":{"218":1}}],["按顺序",{"2":{"188":2}}],["按需加载",{"2":{"51":1}}],["页一个渲染进程",{"2":{"729":1}}],["页",{"2":{"726":1}}],["页边距仅在同一格式上下文中的元素之间折叠",{"2":{"575":1}}],["页数对应替换节点高度的基准",{"2":{"188":2}}],["页的大小10",{"2":{"188":2}}],["页面需要重绘和回流时",{"2":{"730":1}}],["页面需要渲染上千个上万个节点甚至更多",{"2":{"186":1}}],["页面描述",{"2":{"701":1}}],["页面作者",{"2":{"701":1}}],["页面应用名",{"2":{"701":1}}],["页面卸载前阻止这一操作",{"2":{"230":1}}],["页面完全卸载或者嵌入的内容完全卸载",{"2":{"224":1}}],["页面完全加载",{"2":{"224":1}}],["页面会出现卡顿现象",{"2":{"185":1}}],["页面目录",{"2":{"108":1}}],["页面可交互时间",{"2":{"56":1}}],["页面解析完成的时间",{"2":{"56":1}}],["页面性能优化",{"2":{"42":1}}],["页面性能",{"2":{"42":1}}],["页面稳定性",{"2":{"42":2}}],["页面访问速度",{"2":{"42":1}}],["页面的",{"2":{"268":1}}],["页面的性能情况",{"2":{"41":1}}],["页面的整体访问情况",{"2":{"41":1}}],["页面检测",{"2":{"23":1}}],["才开始替换操作",{"2":{"188":2}}],["滚动大小",{"2":{"718":1}}],["滚动",{"2":{"350":1}}],["滚动元素触发",{"2":{"224":1}}],["滚动预留",{"2":{"188":2}}],["滚动高度",{"2":{"188":2,"190":2,"191":2}}],["滚动到底部加载",{"2":{"187":1}}],["演示代码",{"2":{"188":1,"189":1}}],["演示地址",{"2":{"188":1,"189":1}}],["条件加载模块",{"2":{"842":1}}],["条件类型",{"2":{"837":1}}],["条目报告给父框架来进行聚合",{"2":{"380":1}}],["条目",{"2":{"380":3}}],["条",{"2":{"188":1}}],["固定渲染每页大小",{"2":{"188":1}}],["或一个八进制转义符",{"2":{"833":1}}],["或一个向后引用",{"2":{"833":1}}],["或",{"2":{"521":1,"522":1,"575":1,"718":1,"737":3,"738":1,"769":1}}],["或二者都可",{"2":{"453":1}}],["或者根据定义的",{"2":{"846":1}}],["或者在事件循环继续之前重试请求",{"2":{"830":1}}],["或者在package",{"2":{"236":1}}],["或者达到了与系统相关的硬性限制",{"2":{"819":1,"824":1}}],["或者一个空字符串",{"2":{"718":1}}],["或者是命名过或数值索引的",{"2":{"419":1}}],["或者如果",{"2":{"326":1}}],["或者覆盖建议的规则",{"2":{"251":1}}],["或者enter",{"2":{"226":1}}],["或者",{"0":{"188":1},"2":{"735":1,"853":1,"857":2,"872":1}}],["或分配",{"2":{"64":1}}],["照样会造成页面节点太多卡顿的问题",{"2":{"187":1}}],["穿插在",{"2":{"185":1}}],["小端字节序",{"2":{"671":1}}],["小数",{"0":{"288":1}}],["小数位数",{"2":{"283":1}}],["小任务执行时间很短",{"2":{"185":1}}],["小顶堆",{"2":{"12":1}}],["能一次性使用可选参数",{"2":{"872":1}}],["能不使用",{"2":{"872":1}}],["能执行",{"2":{"682":2}}],["能够在多个不同网络间实现信息传输的协议簇",{"2":{"478":1}}],["能完成封装转发数据帧功能的网络设备",{"2":{"464":1}}],["能访问到的元素为活动对象",{"2":{"183":1}}],["能跑一次绝不多跑",{"2":{"147":1}}],["主页",{"2":{"832":1}}],["主模块中运行",{"2":{"827":1}}],["主进程",{"0":{"728":1}}],["主题相关",{"2":{"695":1}}],["主布局中创造了一个小布局",{"2":{"575":1}}],["主机是否可达",{"2":{"480":1}}],["主机与路由器之间进行控制信息传递",{"2":{"480":1}}],["主机收到数据包",{"2":{"480":1}}],["主机读取",{"2":{"479":1}}],["主机适配器",{"2":{"477":1}}],["主机号",{"2":{"429":1}}],["主线程",{"0":{"351":1},"2":{"350":1,"356":1,"357":1,"358":1,"359":1,"360":1,"368":1}}],["主中次",{"2":{"226":1}}],["主中",{"2":{"226":1}}],["主鼠标按钮",{"2":{"226":1}}],["主要负责老生代区间的垃圾回收",{"2":{"183":1}}],["主要负责新生代区间的垃圾回收",{"2":{"182":1}}],["主垃圾回收器",{"0":{"183":1}}],["副垃圾回收器会对没有进行标记的对象进行复制",{"2":{"182":1}}],["副垃圾回收器",{"0":{"182":1}}],["整页向下滚动",{"2":{"815":1}}],["整页向上滚动",{"2":{"815":1}}],["整数除余法",{"2":{"287":1}}],["整数",{"0":{"287":1}}],["整数值的精度限制",{"0":{"282":1}}],["整数以小字节序表示",{"2":{"281":1}}],["整个文件",{"2":{"246":2}}],["整理",{"2":{"183":1}}],["整理内存碎片",{"2":{"181":1}}],["整体的功能点覆盖曲线是否正常",{"2":{"47":1}}],["整体访问",{"2":{"42":2}}],["统一清理内存中所有被标记为可回收的对象",{"2":{"181":1}}],["正确",{"2":{"737":2}}],["正确答案",{"2":{"294":2}}],["正斜杠",{"2":{"706":1}}],["正文里面有",{"2":{"433":1}}],["正则的扩展",{"0":{"665":1},"1":{"666":1}}],["正则表达式",{"0":{"833":1},"2":{"309":1}}],["正则匹配",{"2":{"252":1,"857":2}}],["正数的二进制取反+1",{"2":{"294":1}}],["正数的反码是其本身",{"2":{"293":1}}],["正数",{"2":{"268":1}}],["正值表示顺时针旋转",{"2":{"234":1}}],["正常流",{"2":{"579":1}}],["正常情况",{"2":{"402":1}}],["正常",{"2":{"208":2}}],["正常防抖",{"0":{"75":1},"1":{"76":1,"77":1}}],["正在使用中的对象",{"2":{"181":1}}],["活动对象",{"2":{"181":1}}],["标识符",{"2":{"770":1,"837":1}}],["标准",{"2":{"716":1}}],["标准的鼠标事件",{"2":{"234":1}}],["标题类",{"0":{"337":1}}],["标志",{"2":{"283":1}}],["标志符",{"2":{"270":1}}],["标记清除算法会产生大量的不连续内存碎片",{"2":{"183":1}}],["标记",{"2":{"183":2}}],["标记完毕",{"2":{"182":1}}],["标记空间中的活动对象和非活动对象",{"2":{"181":1}}],["标签设置成",{"2":{"643":1}}],["标签元素设置高度或者单行",{"2":{"650":1}}],["标签元素",{"2":{"643":1}}],["标签类",{"0":{"338":1}}],["标签｜资源文件｜favicon",{"2":{"139":2}}],["标签插入位置",{"2":{"134":2}}],["标签",{"0":{"310":1,"700":1},"1":{"311":1,"312":1,"313":1,"701":1},"2":{"113":2,"139":2,"618":2}}],["栈溢出",{"0":{"787":1}}],["栈",{"0":{"785":1}}],["栈结构",{"0":{"782":1},"1":{"783":1,"784":1,"785":1,"786":1,"787":1}}],["栈中执行上下文",{"2":{"794":1}}],["栈中没有从事件队列中获取",{"2":{"733":1}}],["栈中存储的是引用地址",{"2":{"177":1}}],["栈空间",{"0":{"176":1,"790":1},"2":{"788":1}}],["采用混合加密方式进行数据的加密",{"2":{"559":1}}],["采用新的",{"2":{"494":1}}],["采用心跳实现",{"2":{"491":1}}],["采用的是二分查找的方式来确定偏移量最接近滚动偏移位置",{"2":{"191":1}}],["采用调用栈的形式记录数据",{"2":{"176":1}}],["采用异步加载的方式加载其他资源",{"2":{"51":1}}],["原型式继承",{"2":{"762":1}}],["原型链",{"2":{"762":1}}],["原型模式",{"2":{"761":1}}],["原型",{"0":{"760":1},"1":{"761":1,"762":1,"763":1,"764":1},"2":{"804":1}}],["原子行内级盒子",{"2":{"587":1}}],["原理",{"0":{"424":1}}],["原始文件",{"2":{"317":1,"321":1}}],["原始数据类型存放与栈空间中",{"2":{"176":1}}],["原码",{"0":{"292":1}}],["原文阅读",{"2":{"110":1}}],["垃圾回收流程",{"0":{"181":1}}],["垃圾回收",{"0":{"175":1},"1":{"176":1,"177":1,"178":1,"179":1,"180":1,"181":1,"182":1,"183":1,"184":1,"185":1}}],["收藏",{"2":{"728":1}}],["收费",{"2":{"564":1}}],["收发数据包",{"2":{"466":1}}],["收集代码信息",{"2":{"174":1}}],["收到信号",{"2":{"106":1}}],["那么这两个页面会共用一个",{"2":{"354":1}}],["那么编译器就会抛出异常",{"2":{"170":1}}],["那如何在中间这段时间加上动画呢",{"2":{"168":1}}],["但其实是",{"2":{"802":2}}],["但允许用户的后续请求",{"2":{"532":1}}],["但无响应可用",{"2":{"504":1}}],["但要想正确测量",{"2":{"380":1}}],["但在事件循环继续之前运行的必要",{"2":{"830":1}}],["但在这些情况下应该测量",{"2":{"380":1}}],["但在计算",{"2":{"380":2}}],["但注意站点内部的跨站",{"2":{"354":1}}],["但指向硬盘驱动器上完全相同的位置",{"2":{"321":1}}],["但会导致软链接无法操作",{"2":{"320":1}}],["但仍会生成新的历史记录",{"2":{"271":1}}],["但只有编辑区域才能触发textinput事件",{"2":{"227":1}}],["但如果编译过程发生了语法或者其他的错误",{"2":{"170":1}}],["但是操作系统调度或其它正在运行的回调可能会存在延迟",{"2":{"821":1}}],["但是内部函数引用外部函数的变量依然保存在内存中",{"2":{"772":1}}],["但是是经过公钥加密过的",{"2":{"561":1}}],["但是拒绝执行",{"2":{"531":1}}],["但是没有响应头",{"2":{"452":1}}],["但是有些浏览器还是可以继续支持",{"2":{"194":1}}],["但是与特定类型的机器码无关",{"2":{"173":1}}],["但是",{"2":{"168":1}}],["但是代码放在settimeout中",{"2":{"157":2,"752":2}}],["但是前端文档非常值得思考",{"2":{"128":1}}],["然后立即执行",{"2":{"819":1,"824":1}}],["然后",{"2":{"733":1}}],["然后附加",{"2":{"494":1}}],["然后以广播的形式通过物理介质发送给接收方",{"2":{"479":1}}],["然后逐级向下传播的到最具体元素接收事件",{"2":{"214":1}}],["然后直接清理掉端边界以外的内存",{"2":{"183":1}}],["然后是优化代码",{"2":{"170":1}}],["然后被记录到一个记录队列中",{"2":{"161":1,"756":1}}],["语言",{"2":{"765":1}}],["语法",{"2":{"844":1}}],["语法上不能再分的",{"2":{"172":1}}],["语法分析",{"2":{"170":2,"172":1,"766":1}}],["语雀自研之路",{"2":{"123":1}}],["语雀",{"0":{"123":1}}],["🌹",{"2":{"345":1}}],["🏈",{"2":{"345":1}}],["🍎",{"2":{"345":1}}],["🎉",{"2":{"345":1}}],["🆚",{"2":{"168":1,"345":1,"669":1}}],["🏀",{"2":{"168":1,"345":1}}],["🏀加入",{"2":{"168":1}}],["🍵",{"2":{"132":3}}],["引述作品名",{"2":{"693":3}}],["引用一个词法作用域内部的东西",{"2":{"797":2}}],["引用会导致",{"2":{"770":1}}],["引用值",{"2":{"769":1}}],["引用上面的object方法",{"2":{"762":2}}],["引用类型存放与堆空间中",{"2":{"791":1}}],["引用类型",{"2":{"788":1,"795":1,"859":1}}],["引用类型共享值问题",{"2":{"762":1}}],["引用类型使用堆空间存储",{"2":{"177":1}}],["引用对象",{"2":{"761":1}}],["引用",{"2":{"693":1,"762":1}}],["引擎会将函数的上下文出栈",{"2":{"786":1}}],["引擎会将执行上下文压入栈中",{"2":{"786":1}}],["引擎计时的",{"2":{"730":1}}],["引擎所在的执行队列中",{"2":{"730":1}}],["引擎线程空闲",{"2":{"733":1}}],["引擎线程上执行",{"2":{"733":1}}],["引擎线程互斥",{"0":{"732":1}}],["引擎线程",{"2":{"730":2}}],["引擎互斥",{"2":{"730":1}}],["引擎",{"2":{"347":1}}],["引发回流的方法有",{"2":{"168":1}}],["引入全局依赖",{"2":{"871":1}}],["引入系统声明文件",{"2":{"854":1}}],["引入声明的文件",{"2":{"854":1}}],["引入一个文件夹匹配的所有文件",{"2":{"309":1}}],["引入最好使用绝对地址",{"2":{"144":2}}],["引入其他第三方插件",{"2":{"139":1}}],["引入",{"2":{"132":2,"139":1,"305":2,"306":2,"480":1,"843":1,"854":1}}],["难道就没有办法了吗",{"2":{"168":2}}],["上触发",{"2":{"829":1}}],["上边框高度和下边框高度",{"2":{"718":1}}],["上被找到",{"2":{"521":1}}],["上",{"2":{"257":1}}],["上述是不是没有看到过渡效果呢",{"2":{"168":2}}],["上线",{"2":{"61":1}}],["片段三",{"2":{"168":2}}],["片段2",{"2":{"168":2}}],["片段一",{"2":{"168":2}}],["想实现点动画过渡效果",{"2":{"168":1}}],["切换",{"2":{"168":1}}],["我会飘在哪里",{"2":{"599":2}}],["我分配了这个",{"2":{"422":1}}],["我还没有",{"2":{"422":1}}],["我的",{"2":{"422":1}}],["我是浮动元素",{"2":{"599":2}}],["我是危险",{"2":{"343":2}}],["我是警告",{"2":{"343":2}}],["我是轻提示",{"2":{"343":2}}],["我是一名前端开发者",{"2":{"324":1}}],["我们并没有触发",{"2":{"168":2}}],["我们思考一下",{"2":{"168":2}}],["我们介入三种状态",{"2":{"168":2}}],["我们重新写一下",{"2":{"168":2}}],["我们一般控制显示隐藏的操作",{"2":{"168":2}}],["我们是否用过",{"2":{"168":1}}],["我作为一个普通开发者来说",{"2":{"128":1}}],["抛出问题",{"2":{"168":1}}],["抛出想法",{"2":{"100":1}}],["^",{"2":{"167":1,"289":1,"290":1,"666":8,"814":1,"815":1,"852":2,"865":2}}],["先执行",{"2":{"669":1}}],["先回顾一下",{"2":{"167":1}}],["先来了解一下重绘与回流",{"2":{"165":1}}],["外层函数或全局作用域",{"2":{"811":1}}],["外边距",{"2":{"586":1}}],["外边距边界",{"2":{"585":1}}],["外边距为负值",{"2":{"583":1}}],["外边距重叠",{"0":{"582":1},"1":{"583":1}}],["外边距重叠问题",{"2":{"576":1}}],["外观发生变化",{"2":{"166":1}}],["外部",{"2":{"669":1}}],["外部内部都存在",{"2":{"669":1}}],["外部服务调用",{"2":{"42":1}}],["外部调用服务情况",{"2":{"42":1}}],["重置",{"2":{"815":1}}],["重写需要小心",{"2":{"762":1}}],["重写需要小心function",{"2":{"762":1}}],["重写",{"2":{"761":1}}],["重定向目标在本次响应的",{"2":{"517":1}}],["重定向类型",{"2":{"517":1}}],["重复引用一个对象的多个属性的快捷方式",{"2":{"776":1}}],["重复",{"2":{"525":1,"526":1}}],["重复触发",{"2":{"227":2}}],["重复执行多次",{"2":{"174":1}}],["重绘",{"2":{"166":1}}],["重绘不一定回流",{"2":{"166":1}}],["重新发送数据包",{"2":{"481":1}}],["重新加载方式",{"2":{"271":1}}],["重新加载页面",{"2":{"271":1}}],["重新设置提交记录",{"2":{"266":1}}],["重新设置当前",{"2":{"264":1}}],["重新恢复某个已经存在的提交",{"2":{"260":1}}],["重新",{"2":{"255":1}}],["重新计算元素的位置和几何形状",{"2":{"166":1}}],["重新使用",{"0":{"159":1,"754":1}}],["重新向下建堆",{"2":{"12":1}}],["重新建堆",{"2":{"12":1}}],["回显服务器收到的请求",{"2":{"457":1}}],["回环地址除外",{"2":{"196":1}}],["回收非活动对象占用的空间",{"2":{"181":1}}],["回流",{"2":{"166":1}}],["回流必将引起重绘",{"2":{"166":1}}],["回流与重绘",{"0":{"166":1}}],["回调置于",{"2":{"828":1}}],["回调函数在这里执行",{"2":{"825":1}}],["回调函数负责完整地处理数组中的每个实例",{"2":{"162":1,"757":1}}],["回调",{"2":{"819":1,"822":1}}],["回调参数属性分析",{"0":{"156":1,"751":1}}],["动态的读写",{"2":{"795":1}}],["动态生成的函数代码",{"2":{"775":1}}],["动态",{"2":{"765":1}}],["动态原型模式",{"2":{"761":1}}],["动态主机配置协议",{"0":{"422":1},"2":{"420":1}}],["动画",{"0":{"167":1,"168":1},"2":{"349":1,"350":1}}],["动画那些事",{"0":{"165":1},"1":{"166":1,"167":1,"168":1}}],["动手实现一个",{"0":{"142":1},"1":{"143":1,"144":1,"145":1,"146":1,"147":1}}],["调度的之外",{"2":{"824":1}}],["调度的脚本",{"2":{"819":1}}],["调度的最小单位",{"2":{"725":1}}],["调度",{"2":{"819":2,"824":2}}],["调度之外",{"2":{"819":1}}],["调用的普通函数",{"2":{"804":1}}],["调用位置如何决定",{"2":{"800":1}}],["调用位置",{"0":{"799":1}}],["调用栈调用结束自然销毁",{"2":{"794":1}}],["调用栈是有大小的",{"2":{"787":1}}],["调用栈",{"0":{"783":1,"794":1},"2":{"790":1}}],["调用了两次",{"2":{"762":1}}],["调用函数不存在时返回",{"2":{"738":1}}],["调用父类的方法是",{"2":{"864":1}}],["调用父类的方法时",{"2":{"670":2}}],["调用父类的静态属性和方法",{"2":{"670":1}}],["调用另一个generate函数",{"2":{"669":1}}],["调用",{"2":{"368":1}}],["调用事件处理程序的阶段",{"2":{"221":1}}],["调用takerecords",{"2":{"163":1,"758":1}}],["调整",{"2":{"59":1}}],["因特网控制报文协议",{"2":{"480":1}}],["因素",{"2":{"381":1}}],["因此无法生成相应实体",{"2":{"534":1}}],["因此最好包含一个延迟脚本",{"2":{"311":1}}],["因此经过两次垃圾回收的活动对象依然存在",{"2":{"182":1}}],["因此记录队列被清空",{"2":{"162":1,"757":1}}],["因为这对用户来说是多次不同的页面访问体验",{"2":{"380":1}}],["因为高度未固定",{"2":{"191":2}}],["因为它们不会在函数之后持久存在退出",{"2":{"162":1,"757":1}}],["因为选区中",{"2":{"114":1}}],["会两次渲染",{"2":{"877":2}}],["会产生一些副作用",{"2":{"808":1}}],["会在函数执行的过程中调用",{"2":{"796":1}}],["会在左侧操作数为假值时返回右侧操作数",{"2":{"736":1}}],["会创建一个活动记录",{"2":{"796":1}}],["会创建新的历史状态",{"2":{"268":1}}],["会干扰作用域",{"2":{"774":1}}],["会导致标识符的位置是无效的",{"2":{"777":1}}],["会导致不同的作用域链和标识符解析",{"2":{"761":1}}],["会导致对不齐",{"2":{"650":1}}],["会改变引号层级",{"2":{"640":1}}],["会发生重叠",{"2":{"583":1}}],["会发现",{"2":{"326":2}}],["会与父元素重叠",{"2":{"583":2}}],["会沿着",{"2":{"566":1}}],["会形成帧",{"2":{"476":1}}],["会话层",{"0":{"473":1}}],["会继续分发",{"2":{"380":1}}],["会为在后台选项卡中加载的页面分发",{"2":{"380":1}}],["会被放入到老生代区间中",{"2":{"182":1}}],["会执行一次垃圾回收操作",{"2":{"182":1}}],["会终止抛出错误",{"2":{"172":1}}],["会向被调用的回调传递一个数组",{"2":{"162":1,"757":1}}],["会打造出越来越完美的前端文档",{"2":{"129":1}}],["观察者回调",{"2":{"162":1,"757":1}}],["它们会随时更新",{"2":{"716":1}}],["它只对",{"2":{"703":1}}],["它都需要按照为这个接口配置的",{"2":{"433":1}}],["它表示每个dom突变的有序记录",{"2":{"161":1,"756":1}}],["它的细腻程度非常之细",{"2":{"128":1}}],["其大小为单个边距的最大值",{"2":{"582":1}}],["其主机号为11",{"2":{"548":2}}],["其余情况",{"2":{"824":1}}],["其余各个位取反",{"2":{"293":1}}],["其余位表示值",{"2":{"292":1}}],["其有效数字为",{"2":{"274":1,"275":1}}],["其他方法不可缓存",{"2":{"461":1}}],["其他请求方法相对安全",{"2":{"461":1}}],["其他请求方法都可以有响应体",{"2":{"461":1}}],["其他请求方法可选",{"2":{"461":1}}],["其他窗口的一个引用",{"2":{"419":1}}],["其他组件",{"2":{"347":2}}],["其他",{"0":{"699":1},"2":{"236":1,"347":1,"586":1}}],["其他开发可通过开启断点方式来直接定位问题",{"2":{"66":1}}],["其实会发现问题",{"2":{"168":1}}],["其实上述代码的关键在于切换不同的状态类名",{"2":{"168":1}}],["其内容被丢弃",{"2":{"162":1,"757":1}}],["其设计的核心是异步回调和记录队列模型",{"2":{"161":1,"756":1}}],["节省",{"2":{"549":1}}],["节点",{"2":{"160":1,"755":1}}],["节点的属性改变时",{"2":{"160":1,"755":1}}],["节流最终执行",{"0":{"91":1},"1":{"92":1,"93":1}}],["节流定时器版",{"0":{"88":1},"1":{"89":1,"90":1}}],["节流非定时器版",{"0":{"85":1},"1":{"86":1,"87":1}}],["节流",{"0":{"84":1},"1":{"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1,"92":1,"93":1}}],["目前记住规则",{"2":{"719":1}}],["目前有",{"2":{"568":1}}],["目前在杭州就业",{"2":{"324":1}}],["目录的测试文件",{"2":{"857":2}}],["目录下的文件先编译再进行编译测试",{"2":{"857":2}}],["目录下",{"2":{"857":2}}],["目录下面的文件输出到",{"2":{"857":2}}],["目录中的",{"2":{"857":2}}],["目录类",{"0":{"340":1}}],["目录搭建",{"0":{"108":1}}],["目标端口",{"2":{"422":2}}],["目标展望",{"2":{"324":1}}],["目标",{"2":{"221":1}}],["目标元素",{"2":{"188":2}}],["目标元素以及整个结点子树都将被监听改变",{"2":{"160":1,"755":1}}],["只读属性",{"2":{"838":1,"860":1}}],["只取决函数的调用方式",{"2":{"796":1}}],["只能用于子类的构造函数中",{"2":{"864":1}}],["只能用于子类",{"2":{"864":1}}],["只能用字符串作为键值",{"2":{"668":1}}],["只能为",{"2":{"837":1}}],["只能读写自己栈帧的内存",{"2":{"794":1}}],["只执行一次",{"2":{"681":2}}],["只允许一个module",{"2":{"672":2}}],["只接受回调函数作为单参数",{"2":{"669":1}}],["只接受键名为对象",{"2":{"668":1}}],["只适用",{"2":{"650":1}}],["只适用于外部脚本中",{"2":{"310":1}}],["只有一个",{"2":{"730":1}}],["只有可替换的元素才能具有固有尺寸",{"2":{"637":1}}],["只有私钥才能解密",{"2":{"561":1}}],["只有",{"2":{"461":1}}],["只有当页面始终处于前台时才考虑元素",{"2":{"380":1}}],["只有在操作系统中能追溯到数字证书链才能验证证书合法",{"2":{"568":1}}],["只有在事件处理程序执行期间",{"2":{"221":1}}],["只有在没有已经调度的回调微任务时才被调度为微任务",{"2":{"162":1,"757":1}}],["只指向",{"2":{"317":1}}],["只包含事件的目标",{"2":{"221":1}}],["只针对计算代码的书写",{"2":{"190":2,"191":2}}],["只监听目标元素的改变",{"2":{"160":1,"755":1}}],["只关注循环最多的那一段代码",{"2":{"1":1}}],["仍然可以监听改变",{"2":{"157":2,"752":2}}],["立即关闭",{"2":{"157":2,"752":2}}],["立即执行当前微任务队列的所有微任务",{"2":{"733":1}}],["立即执行函数",{"2":{"301":2}}],["立即执行",{"2":{"79":2,"82":2,"85":2,"88":2,"91":2,"95":1}}],["立即执行防抖函数ii",{"0":{"81":1},"1":{"82":1,"83":1},"2":{"80":1}}],["立即执行防抖函数i",{"0":{"78":1},"1":{"79":1,"80":1}}],["第",{"2":{"815":1}}],["第四种",{"2":{"646":2}}],["第三种",{"2":{"646":2}}],["第三方插件进程",{"0":{"729":1}}],["第三方",{"0":{"404":1}}],["第三个字符串",{"2":{"113":1}}],["第二次",{"2":{"877":2}}],["第二次调用supertype",{"2":{"762":2}}],["第二个字节则是",{"2":{"814":1}}],["第二个参数允许使用类似",{"2":{"762":1}}],["第二种",{"2":{"646":2}}],["第二种情况",{"2":{"157":2,"752":2}}],["第二份工作进行中",{"2":{"324":1}}],["第一个参数为一个对象",{"2":{"762":1}}],["第一次调用supertype",{"2":{"762":2}}],["第一次传参数无效",{"2":{"669":1}}],["第一次执行的字节码",{"2":{"174":1}}],["第一种",{"2":{"646":2}}],["第一种情况",{"2":{"157":2,"752":2}}],["第一份工作",{"2":{"324":1}}],["默认命令为包名",{"2":{"832":1}}],["默认绑定指定一个全局对象和",{"2":{"810":1}}],["默认绑定",{"0":{"801":1},"2":{"805":1}}],["默认情况下会将凭据发送到同源url",{"2":{"683":1}}],["默认情况下不将凭据发送到同源url",{"2":{"683":1}}],["默认情况下",{"2":{"683":1}}],["默认行为是否立即执行",{"2":{"712":1}}],["默认行为",{"2":{"661":1}}],["默认格式",{"2":{"339":1}}],["默认导出",{"2":{"305":2,"306":2}}],["默认值生效的条件",{"2":{"664":1}}],["默认值为",{"2":{"268":1}}],["默认值",{"2":{"237":2,"238":1,"402":1,"640":1}}],["默认观察为所有属性",{"2":{"160":1,"755":1}}],["默认为text",{"2":{"684":1}}],["默认为十进制",{"2":{"641":1}}],["默认为当前的",{"2":{"396":1}}],["默认为",{"2":{"160":6,"303":1,"590":1,"755":6}}],["默认",{"2":{"156":4,"751":4,"815":5}}],["默认调用",{"0":{"96":1,"97":1}}],["变通",{"2":{"669":1}}],["变长子网掩码",{"0":{"550":1}}],["变化触发事件",{"2":{"270":1}}],["变化时",{"2":{"151":1,"746":1}}],["变动事件",{"0":{"229":1}}],["变量对象",{"2":{"794":1}}],["变量对象包含执行环境所有变量和函数的对象",{"2":{"770":1}}],["变量分配",{"0":{"792":1},"1":{"793":1,"794":1,"795":1}}],["变量函数的有序访问",{"2":{"770":1}}],["变量和函数的可访问范围",{"2":{"767":1}}],["变量",{"2":{"766":1}}],["变量为",{"2":{"95":1}}],["变量含义",{"2":{"16":1}}],["当提供的值是一个对象时",{"2":{"876":1}}],["当不使用",{"2":{"861":1}}],["当一个函数调用时",{"2":{"796":1}}],["当通过调用一个外部函数返回内部函数后",{"2":{"772":1}}],["当左表达式不为",{"2":{"737":1}}],["当左侧的操作数为",{"2":{"735":1}}],["当js引擎线程执行时",{"2":{"732":1}}],["当请求完成时",{"2":{"730":1}}],["当事件满足触发条件时",{"2":{"730":1}}],["当为对象时",{"2":{"712":1}}],["当为",{"2":{"712":1}}],["当时遵循规范的浏览器",{"2":{"683":1}}],["当隐藏时仍然保有设置的大小的空间",{"2":{"655":1}}],["当服务器无法识别请求的方法",{"2":{"540":1}}],["当响应于",{"2":{"521":1}}],["当表头和表尾被加至数据包时",{"2":{"476":1}}],["当页面通过往返缓存恢复时",{"2":{"380":1}}],["当焦点从页面中的一个元素移动到另一个元素",{"2":{"225":1}}],["当前执行上下文的变量对象",{"2":{"770":1}}],["当前设置的",{"2":{"396":1}}],["当前页面完整",{"2":{"271":1}}],["当前正在处理事件的元素",{"2":{"221":1}}],["当前偏移高度",{"2":{"191":2}}],["当前顶点值",{"2":{"15":1}}],["当我们加入enter",{"2":{"168":2}}],["当你想调用disconnect",{"2":{"163":1,"758":1}}],["当mutationrecord实例出现在记录队列中时",{"2":{"162":1,"757":1}}],["当",{"2":{"151":1,"422":1,"746":1}}],["概念",{"0":{"151":1,"746":1},"2":{"574":1,"577":1,"582":1}}],["比如",{"2":{"149":1,"808":1}}],["比较",{"0":{"723":1,"739":1},"2":{"115":1}}],["你以后得到的",{"2":{"324":1}}],["你所想的永远是太天真",{"2":{"324":1}}],["你可能会想到用",{"2":{"168":1}}],["你不知道的正则表达式",{"0":{"834":1},"1":{"835":1}}],["你不知道的",{"0":{"148":1,"700":1},"1":{"149":1,"701":1}}],["你知道的节流又是怎样呢",{"2":{"84":1}}],["你知道的防抖是怎样呢",{"2":{"74":1}}],["是两种不同的类型",{"2":{"837":1}}],["是对象",{"2":{"802":2}}],["是在调用时绑定的",{"2":{"799":1}}],["是由定时触发线程来计时的",{"2":{"730":1}}],["是能拥有资源和独立运行的最小单位",{"2":{"725":1}}],["是标题组",{"2":{"688":1}}],["是机构",{"2":{"566":1}}],["是无法确定哪个应用程序要接收这个包",{"2":{"481":1}}],["是包含了物理地址和错误侦测及改错的方法",{"2":{"476":1}}],["是读取每一个数据包中的地址然后决定如何传送的专用智能性的网络设备",{"2":{"466":1}}],["是复杂的网络互连设备",{"2":{"465":1}}],["是当前子网的广播地址",{"2":{"446":1}}],["是",{"2":{"422":1,"718":1,"812":1}}],["是这个",{"2":{"422":1}}],["是把顶点数据转换为片元的过程",{"2":{"364":1}}],["是一串指示数据包末端的字符串",{"2":{"476":1}}],["是一个不带任何修饰符的函数调用",{"2":{"802":2}}],["是一个隐式引用",{"2":{"763":1}}],["是一个逻辑操作符",{"2":{"735":1}}],["是一个唯一的表示",{"2":{"432":1}}],["是一个函数",{"2":{"144":2}}],["是一种指向不同文件的特殊文件",{"2":{"316":1}}],["是运行在主线程之上",{"2":{"184":1}}],["是立即消失立即隐藏",{"2":{"168":1}}],["是否保留命令行",{"2":{"858":1}}],["是否存在",{"2":{"848":1}}],["是否优先其他事件执行",{"2":{"712":1}}],["是否执行一次即销毁",{"2":{"712":1}}],["是否设置",{"0":{"600":1}}],["是否设置宽度",{"0":{"599":1}}],["是否响应该请求",{"2":{"408":1}}],["是否允许第三方网站设置",{"2":{"404":1}}],["是否可以取消事件的默认行为",{"2":{"221":1}}],["是否可以访问",{"2":{"196":1}}],["是否在设置的时间未执行时",{"2":{"95":1}}],["是否立即执行",{"2":{"95":1}}],["请求线程",{"2":{"730":1}}],["请求的编码类型",{"2":{"718":1}}],["请求的资源的内容特性无法满足请求头中的条件",{"2":{"534":1}}],["请求中提交的媒体类型不支持",{"2":{"537":1}}],["请求中介建立到请求目标表示的源服务器的",{"2":{"459":1}}],["请求超时",{"2":{"536":1}}],["请求行中指定的请求方法不能被用于请求相应的资源",{"2":{"533":1}}],["请求所希望得到的资源未被在服务器上发现",{"2":{"532":1}}],["请求所希望的响应头或数据体将随此响应返回",{"2":{"507":1}}],["请求失败",{"2":{"532":1}}],["请求不应该被重复提交",{"2":{"531":1}}],["请求限制",{"2":{"530":1}}],["请求和所有将来的请求应该使用另一个",{"2":{"526":1}}],["请求应该与另一个",{"2":{"525":1}}],["请求已经被实现",{"2":{"508":1}}],["请求已成功",{"2":{"507":1}}],["请求已被接受",{"2":{"501":1}}],["请求包含许多涉及文件操作的自请求",{"2":{"504":1}}],["请求设置",{"2":{"493":1}}],["请求头",{"0":{"492":1},"1":{"493":1}}],["请求数据包",{"2":{"480":1}}],["请求多次",{"2":{"461":1}}],["请求体",{"2":{"461":1}}],["请求目标资源根据请求中包含的表示中定义的部分更新来修改其状态",{"2":{"460":1}}],["请求目标资源在响应正文中传输收到的请求",{"2":{"457":1}}],["请求服务删除",{"2":{"456":1}}],["请求服务器进行处理",{"2":{"453":1}}],["请求",{"0":{"454":1},"2":{"482":1,"513":1,"730":1}}],["请求方法",{"0":{"450":1},"1":{"451":1,"452":1,"453":1,"454":1,"455":1,"456":1,"457":1,"458":1,"459":1,"460":1,"461":1},"2":{"414":1,"461":1}}],["请求类型",{"2":{"402":1,"718":1}}],["请求进行域名拆分",{"2":{"50":1}}],["请移步hwp源码",{"2":{"143":2}}],["得到信息摘要",{"2":{"566":2}}],["得到的是主机地址",{"2":{"548":1}}],["得到近似结果",{"2":{"298":1}}],["得到结果",{"2":{"147":2,"296":1,"297":1}}],["得到entries编译结果",{"2":{"143":2}}],["得到最低位的",{"2":{"4":1}}],["错误侦测和改错",{"2":{"476":1}}],["错误",{"2":{"143":2,"329":1,"737":2}}],["错误告警是否有新增错误",{"2":{"47":1}}],["假设数据格式为",{"2":{"191":2}}],["假设",{"2":{"143":2,"188":1}}],["🦐🦐🦐",{"2":{"142":1}}],["🔥事件队列",{"2":{"724":1}}],["😃",{"2":{"706":1}}],["😱",{"2":{"345":1}}],["😭",{"2":{"345":1}}],["👋",{"2":{"345":1}}],["💤",{"2":{"345":1}}],["🔧",{"2":{"345":1,"763":1}}],["👣",{"2":{"345":1}}],["🚶",{"2":{"345":1}}],["😟",{"2":{"345":1}}],["😒",{"2":{"345":1}}],["😳",{"2":{"345":1}}],["👏",{"2":{"345":1}}],["👊",{"2":{"345":1,"702":1}}],["🕐",{"2":{"345":1}}],["👎",{"2":{"345":1,"761":5}}],["👍",{"2":{"345":1,"761":5}}],["😧",{"2":{"345":1}}],["💯",{"2":{"345":1,"764":1}}],["😠",{"2":{"345":1}}],["👀createchildcompiler",{"2":{"141":1}}],["😡emit",{"2":{"139":1}}],["😡make",{"2":{"138":1}}],["😡",{"2":{"137":4,"138":1,"139":1}}],["😡thiscompilation",{"2":{"137":1}}],["产生值的类型",{"2":{"842":1}}],["产生默认绑定",{"2":{"808":1}}],["产生的",{"2":{"353":1}}],["产生之前",{"2":{"139":2}}],["产品体验",{"2":{"67":1}}],["资源分配的最小单元",{"2":{"725":1}}],["资源不需要重新传输资源",{"2":{"522":1}}],["资源在有请求头的",{"2":{"522":1}}],["资源已创建",{"2":{"455":1}}],["资源加载时间",{"2":{"381":1}}],["资源指标是否允许跨域收集",{"2":{"380":1}}],["资源文件",{"2":{"139":2}}],["资源占用",{"2":{"48":1}}],["为单个边距",{"2":{"582":1}}],["为网络号",{"2":{"550":1}}],["为应用程序标识身份",{"2":{"481":1}}],["为接入交换机的任意两个网络节点提供独享的电信号通路",{"2":{"464":1}}],["为调用",{"2":{"268":1}}],["为",{"2":{"221":1,"303":1,"326":1,"433":1,"590":1,"701":2,"717":1,"857":2}}],["为了配合",{"2":{"841":1}}],["为了执行效率",{"2":{"182":1}}],["为了允许在不降低性能的情况下注册大量的突变",{"2":{"161":1,"756":1}}],["为了",{"2":{"139":1}}],["为什么使用",{"0":{"830":1}}],["为什么",{"0":{"40":1}}],["到达当前执行位置所调用的所有函数",{"2":{"799":1}}],["到某个提交记录",{"2":{"264":1}}],["到",{"2":{"139":1,"282":2,"446":1}}],["到浏览器响应的时间",{"2":{"56":1}}],["把这种管理执行上下文称为执行上下文栈",{"2":{"786":1}}],["把这些变量的集合成为闭包",{"2":{"772":1}}],["把这段代码编译成机器码",{"2":{"174":1}}],["把传输表头",{"2":{"474":1}}],["把数据转换为能与接收者的系统格式兼容并适合传输的格式",{"2":{"472":1}}],["把数据包加入队列",{"2":{"433":1}}],["把不需要的提交记录修剪掉",{"2":{"257":1}}],["把处理封装成一个函数",{"2":{"168":2}}],["把模板文件加入到compiler编译文件队列中",{"2":{"143":2}}],["把模板文件加入进去",{"2":{"132":1}}],["把",{"2":{"137":1,"423":1}}],["地址进行归类的方法",{"2":{"551":1}}],["地址以及在互联网上有效的路由",{"2":{"551":1}}],["地址二进制进行逻辑与",{"2":{"548":1}}],["地址是在局域网上还是在远程网",{"2":{"547":1}}],["地址分配而产生的虚拟",{"2":{"546":1}}],["地址分配地址",{"2":{"429":1}}],["地址资源紧缺",{"2":{"546":1}}],["地址划分成网络地址和主机地址",{"2":{"545":1}}],["地址使用不同长度的子网掩码",{"2":{"550":1}}],["地址使用",{"2":{"545":1}}],["地址掩码",{"2":{"545":1}}],["地址完成这个路由协议的物理设备就是路由器",{"2":{"480":1}}],["地址对应保留一定时间",{"2":{"480":1}}],["地址对比",{"2":{"480":1}}],["地址获取",{"2":{"480":1}}],["地址缓存",{"2":{"464":1}}],["地址识别",{"2":{"464":1}}],["地址都保留用于将来和实验使用",{"2":{"446":1}}],["地址中不能以十进制",{"2":{"446":1}}],["地址中凡是以",{"2":{"446":1}}],["地址中的每一个字节都为",{"2":{"446":1}}],["地址编址方式",{"0":{"440":1},"1":{"441":1,"442":1,"443":1,"444":1,"445":1,"446":1}}],["地址类型",{"0":{"437":1},"1":{"438":1,"439":1}}],["地址有一定定位功能的",{"2":{"432":1}}],["地址像是身份证",{"2":{"432":1}}],["地址才有远程定位功能",{"2":{"432":1}}],["地址号全局唯一",{"2":{"432":1}}],["地址如何计算广播地址",{"0":{"431":1}}],["地址按位计算",{"2":{"429":1}}],["地址范围",{"2":{"429":2,"440":2}}],["地址段",{"2":{"424":1}}],["地址的一部分以区别网络标识和主机标识",{"2":{"547":1}}],["地址的一个网络层协议",{"2":{"480":1}}],["地址的哪些位标识的是主机所在的子网以及哪些位标识的是主机的位掩码",{"2":{"545":1}}],["地址的分配效率",{"2":{"546":1}}],["地址的分配",{"0":{"447":1}}],["地址的收回和续租",{"2":{"422":1}}],["地址的合法租用信息和其他配置的信息放入广播包",{"2":{"422":1}}],["地址并生成一条新的历史记录",{"2":{"271":1}}],["地址",{"0":{"421":1,"428":1,"432":1,"434":1,"436":1,"467":1},"1":{"429":1,"430":1,"431":1,"435":1,"436":1,"437":1,"438":1,"439":1,"440":1,"441":1,"442":1,"443":1,"444":1,"445":1,"446":1,"447":1},"2":{"137":1,"424":1,"425":1,"446":2,"447":1,"465":1,"479":1,"480":6,"486":1,"497":1,"498":1,"548":2,"549":1,"562":1}}],["做了以下操作",{"2":{"137":1,"138":1,"139":1}}],["写入",{"0":{"395":1}}],["写在最后",{"0":{"192":1}}],["写了",{"2":{"137":1}}],["写插件",{"2":{"135":1}}],["写一个",{"0":{"135":1}}],["|",{"2":{"134":2,"167":14,"198":2,"223":6,"226":7,"227":14,"229":3,"230":2,"237":8,"238":3,"250":1,"251":1,"256":16,"259":6,"265":10,"268":1,"271":1,"344":30,"598":4,"603":3,"837":1,"850":10,"862":8,"863":3,"865":2}}],["||",{"0":{"616":1},"2":{"98":10,"114":1,"195":2,"200":2,"222":1,"227":1,"232":2,"344":1,"718":2,"736":4,"737":8,"744":1,"810":4}}],["输出",{"2":{"775":2,"809":2,"858":1}}],["输出的结果都是一样的",{"2":{"461":1}}],["输出类",{"0":{"339":1}}],["输出结果",{"2":{"170":1}}],["输出文件名",{"2":{"134":2}}],["输入",{"2":{"775":2}}],["输入字段中插入新字符",{"2":{"228":1}}],["输入立即执行",{"2":{"81":1}}],["输入直接执行",{"2":{"78":1}}],["未被",{"2":{"819":1}}],["未查询到作用域",{"2":{"769":1}}],["未定义",{"2":{"737":1}}],["未能及时从上游服务器收到响应",{"2":{"543":1}}],["未能实时监听模板文件的改变",{"2":{"132":1}}],["未认证",{"2":{"529":1}}],["未曾被修改",{"2":{"522":1}}],["未知或不适用的目标",{"2":{"496":1}}],["未来",{"0":{"129":1}}],["钩子中实现",{"2":{"132":1}}],["钩子中的",{"2":{"132":1}}],["钩子",{"2":{"132":1}}],["890",{"2":{"835":2}}],["8999999999999999",{"2":{"298":1}}],["8c",{"2":{"428":6}}],["82",{"2":{"428":6}}],["83",{"2":{"428":2}}],["8a3c",{"2":{"428":2}}],["86400e3",{"2":{"399":2}}],["8080",{"2":{"419":8,"490":2}}],["80",{"2":{"283":1}}],["8组合输入",{"2":{"227":1}}],["8m",{"2":{"179":1}}],["8字符串",{"2":{"144":2}}],["8",{"2":{"131":2,"146":2,"147":4,"206":1,"275":1,"283":1,"287":2,"288":2,"290":3,"296":2,"297":2,"344":2,"429":3,"550":1,"761":1,"841":1}}],["`a",{"2":{"815":1}}],["`hello",{"2":{"342":1}}],["```js",{"2":{"339":1}}],["```md",{"2":{"339":1}}],["```html",{"2":{"339":1}}],["``````js",{"2":{"339":1}}],["``````md",{"2":{"339":1}}],["``````html",{"2":{"339":1}}],["``````",{"2":{"339":1}}],["```",{"2":{"339":5}}],["`",{"2":{"131":4,"208":4,"209":4}}],["关键词",{"2":{"832":1}}],["关键字配合",{"2":{"837":1}}],["关键字时被调用的函数",{"2":{"804":1}}],["关键字",{"2":{"701":1,"837":3,"864":1}}],["关键路径渲染",{"0":{"369":1},"1":{"370":1,"371":1,"372":1,"373":1,"374":1,"375":1,"376":1}}],["关键生命周期上报",{"2":{"46":1}}],["关闭的回调函数",{"0":{"826":1},"2":{"819":1}}],["关闭时触发",{"2":{"228":1}}],["关闭监听",{"2":{"158":2,"753":2}}],["关闭监听改变",{"2":{"157":1,"752":1}}],["关闭连接",{"0":{"157":1,"752":1}}],["关于原型的学习记录",{"2":{"760":1}}],["关于许多细节点没有处理",{"2":{"147":1}}],["关于",{"0":{"796":1},"1":{"797":1,"798":1,"799":1,"800":1,"801":1,"802":1,"803":1,"804":1,"805":1,"806":1,"807":1,"808":1,"809":1,"810":1,"811":1},"2":{"147":1}}],["关于如何把webpack的输出文件注入到模板文件当中",{"2":{"131":2}}],["简介",{"2":{"324":1}}],["简易实现问题",{"0":{"132":1}}],["简易的写一个",{"0":{"131":1},"1":{"132":1}}],["简单选择",{"2":{"115":1}}],["缩短文件目录路径",{"2":{"857":2}}],["缩写",{"2":{"130":1,"689":1}}],["缩进文本",{"2":{"113":1}}],["即返回这个新对象",{"2":{"804":1}}],["即调用栈",{"2":{"786":1}}],["即使该外部函数执行结束了",{"2":{"772":1}}],["即位置与尺寸",{"2":{"358":1}}],["即用第一位表示符号",{"2":{"292":1}}],["即时编译",{"2":{"174":1}}],["即配置匹配的文件返回的utf",{"2":{"144":2}}],["即",{"2":{"130":1}}],["本阶段执行已经被",{"2":{"821":1}}],["本身和子类可以访问",{"2":{"864":1}}],["本身引用",{"2":{"864":1}}],["本身",{"2":{"797":1}}],["本地机器上的所有",{"2":{"498":1}}],["本地缓存占用",{"2":{"48":1}}],["本机相互通信",{"2":{"429":1}}],["本文引用地址",{"2":{"346":1}}],["本文中",{"2":{"130":1}}],["本质上是在硬盘驱动器上引用文件的两种不同方式",{"2":{"323":1}}],["注释文本",{"2":{"716":1}}],["注释",{"2":{"160":1,"236":1,"755":1}}],["注",{"2":{"130":1}}],["注意基本类型小写",{"2":{"872":1}}],["注意顺序覆盖",{"2":{"761":1}}],["注意跨站点",{"2":{"350":1}}],["注意",{"2":{"137":1,"196":1,"198":1,"218":1,"404":1,"632":1,"662":1,"777":1,"877":2}}],["注意点",{"0":{"21":1,"807":1},"1":{"808":1,"809":1,"810":1}}],["注意判断成环的条件",{"2":{"16":1}}],["考虑的问题很多",{"2":{"128":1}}],["像语雀这种在线表格自研之路",{"2":{"128":1}}],["\\b复杂度",{"0":{"128":1}}],["成功类型",{"2":{"506":1}}],["成熟下去",{"2":{"324":1}}],["成千上百万的节点不可能一次性渲染出来",{"2":{"125":1}}],["成正比",{"2":{"0":1}}],["菜鸟业务webexcel",{"2":{"122":1}}],["钉钉",{"0":{"122":1}}],["来查找",{"2":{"846":1}}],["来寻找",{"2":{"846":1}}],["来调用函数",{"2":{"804":1}}],["来进行显式绑定",{"2":{"803":1}}],["来进行任意长度的前缀的分配",{"2":{"551":1}}],["来看看",{"2":{"715":1}}],["来看看一些用过的在线文档编辑设计思路以及架构模式",{"2":{"121":1}}],["来确定结束位置",{"2":{"191":2}}],["来确定初始位置",{"2":{"191":2}}],["来渲染出数据",{"2":{"189":1}}],["来说",{"2":{"159":1,"754":1}}],["来自",{"2":{"112":1}}],["同步任务在",{"2":{"733":1}}],["同步任务和异步任务",{"2":{"733":1}}],["同下document",{"2":{"715":1}}],["同下",{"2":{"715":2}}],["同一层相邻元素",{"2":{"583":1}}],["同一个主机上的每个应用程序都需要指定唯一的端口号",{"2":{"481":1}}],["同一网络号里面的机器都能收到",{"2":{"429":1}}],["同源",{"2":{"416":1,"417":1}}],["同源策略",{"0":{"416":1},"1":{"417":1}}],["同样解释器也会对源代码进行词法分析",{"2":{"170":1}}],["同理",{"2":{"168":2}}],["同时保留隐式绑定或显示绑定修改",{"2":{"810":1}}],["同时操作dom",{"2":{"731":1}}],["同时使用",{"2":{"666":2}}],["同时支持传输音视频数据",{"2":{"569":1}}],["同时主次",{"2":{"226":1}}],["同时阻止任何事件处理程序被调用",{"2":{"221":1}}],["同时还会排列起来",{"2":{"182":1}}],["同时添加",{"2":{"168":2}}],["同时返回编译模板返回的资源内容",{"2":{"138":1}}],["同构表vs异构表",{"0":{"118":1}}],["同上document",{"2":{"715":1}}],["同上",{"2":{"90":1,"715":3}}],["折叠后的外边距的值为最小的负边距的值",{"2":{"583":1}}],["折叠后的外边距的最大的正边距与最小的负边距",{"2":{"583":1}}],["折叠",{"2":{"115":1,"582":1}}],["示例2",{"2":{"144":2}}],["示例1",{"2":{"144":2}}],["示例",{"2":{"114":1,"402":1}}],["清屏",{"2":{"858":1}}],["清理任何不需要的资源",{"2":{"830":1}}],["清除行内的部分区域",{"2":{"815":1}}],["清除屏幕的部分区域",{"2":{"815":1}}],["清除浮动让文档布局正常化",{"2":{"601":1}}],["清除浮动元素或非浮动元素",{"2":{"601":1}}],["清除浮动",{"2":{"583":2,"596":1}}],["清除",{"2":{"183":1}}],["清除选区并选择指定节点的所有子节点",{"2":{"114":1}}],["清零最低位的",{"2":{"4":1}}],["这是你的",{"2":{"422":1}}],["这是一种实现方式",{"2":{"195":2}}],["这是一种配置",{"2":{"144":2}}],["这些",{"2":{"405":1}}],["这时就要移除事件绑定",{"2":{"168":1}}],["这时候你会发现效果大有不同",{"2":{"168":2}}],["这就达到了关闭的效果",{"2":{"163":1,"758":1}}],["这将返回队列中存在的mutationrecord实例数组",{"2":{"163":1,"758":1}}],["这确保记录队列的内容没有双重回调处理",{"2":{"162":1,"757":1}}],["这个记录会包含函数在哪里被调用",{"2":{"796":1}}],["这个属性",{"2":{"763":1}}],["这个可以使文件回到",{"2":{"263":1}}],["这个队列对于每个mutationobserver实例是惟一的",{"2":{"161":1,"756":1}}],["这个在",{"2":{"132":1}}],["这种情况下",{"2":{"326":1}}],["这种方式不会重新加载",{"2":{"271":1}}],["这种方法webpack会解析入口文件中的loader并解析",{"2":{"144":2}}],["这种形式可以通过自定义的",{"2":{"137":1}}],["这也是必须值得思考的地方",{"2":{"126":1}}],["这样会移除选区",{"2":{"114":1}}],["这里就拿",{"2":{"715":1}}],["这里会导出一个对象",{"2":{"672":2}}],["这里会触发文档的",{"2":{"195":2}}],["这里结果就是",{"2":{"494":2}}],["这里将开始自己的写作之旅",{"2":{"324":1}}],["这里返回的是",{"2":{"202":2,"203":2}}],["这里要保证可视区域必定要有数据展示",{"2":{"190":2}}],["这里只针对于计算部分的代码",{"2":{"188":2}}],["这里强制触发一下回流",{"2":{"168":2}}],["这里得到一个函数",{"2":{"147":2}}],["这里loader参照html",{"2":{"147":2}}],["这里为了配置部分代码展示",{"2":{"143":2}}],["这里处理输出文件到",{"2":{"139":1}}],["这里把模板文件",{"2":{"137":1}}],["这里需要把浏览器端需要创建的",{"2":{"106":1}}],["这里通过服务端",{"2":{"106":2}}],["这里是你要创建的",{"2":{"106":2}}],["这里",{"2":{"104":2,"188":2}}],["移动到指定的值来扩展选区",{"2":{"114":1}}],["移除绑定事件",{"2":{"195":2}}],["移除文本的链接",{"2":{"113":1}}],["移除不必要的代码",{"2":{"65":1}}],["与逻辑或操作符",{"2":{"736":1}}],["与盒模型相关的css属性",{"0":{"586":1}}],["与自己的",{"2":{"480":1}}],["与事件关联的抽象视图",{"2":{"221":1}}],["与事件相关的细节信息",{"2":{"221":1}}],["与主compiler类似相同的api",{"2":{"141":1}}],["与",{"2":{"114":1,"512":1,"626":1,"730":3,"737":1,"806":2,"812":1,"838":1,"870":1}}],["与每行代码执行次数",{"2":{"0":1}}],["范围内的字符",{"2":{"814":1}}],["范围的元素",{"2":{"637":1}}],["范围的数量",{"2":{"114":1}}],["范围非常有限",{"2":{"432":1}}],["范围中的内容",{"2":{"115":2}}],["范围",{"2":{"114":3,"115":4}}],["范围添加到选区中",{"2":{"114":1}}],["获取类型",{"2":{"857":2}}],["获取变量的值",{"2":{"770":1}}],["获取到",{"2":{"561":1}}],["获取每一项的偏移高度",{"2":{"191":2}}],["获取结束位置",{"2":{"190":2,"191":2}}],["获取开始位置",{"2":{"190":2,"191":2}}],["获取",{"2":{"168":1,"268":1,"480":1}}],["获取系统主题",{"2":{"149":2}}],["获取选区范围",{"2":{"114":2}}],["获取选区文本",{"2":{"114":2}}],["获取选择文本",{"2":{"114":1}}],["获取组件的状态和数据",{"2":{"38":1}}],["方式定义值",{"2":{"762":1}}],["方式",{"0":{"647":1,"649":1,"650":1}}],["方向",{"2":{"580":1}}],["方案",{"0":{"188":1}}],["方法能对所有的",{"2":{"703":1}}],["方法内部的",{"2":{"670":2}}],["方法允许访问请求的资源",{"2":{"410":1}}],["方法也返回完整",{"2":{"271":1}}],["方法来耗尽mutationobserver实例的记录队列",{"2":{"163":1,"758":1}}],["方法第二个参数对象有哪些属性",{"0":{"160":1,"755":1}}],["方法",{"0":{"155":1,"163":1,"750":1,"758":1},"2":{"132":1,"163":1,"221":1,"222":1,"668":4,"671":1,"758":1,"762":1,"763":1}}],["方法可以检测当前文本是否执行过某个命令",{"2":{"113":1}}],["方法可以检测当前位置是否可以执行某个命令",{"2":{"113":1}}],["方便调试以及修复",{"2":{"65":1}}],["选项",{"2":{"857":2}}],["选择",{"2":{"838":1}}],["选择图形再现",{"2":{"815":1}}],["选择框脚本",{"2":{"718":1}}],["选择器组合",{"0":{"610":1},"1":{"611":1,"612":1,"613":1,"614":1,"615":1,"616":1}}],["选择器",{"0":{"604":1,"606":1},"1":{"605":1,"606":1,"607":1,"608":1,"609":1,"610":1,"611":1,"612":1,"613":1,"614":1,"615":1,"616":1,"617":1,"618":1,"619":1,"620":1,"621":1,"622":1,"623":1,"624":1,"625":1,"626":1}}],["选择加密方式以及返回数字证书和",{"2":{"563":1}}],["选择加密方式以及生成公钥和",{"2":{"559":1}}],["选择加密方式和",{"2":{"553":1}}],["选择适合团队的技术栈",{"2":{"59":1}}],["选区中包含的",{"2":{"114":1}}],["选区终点所在的节点",{"2":{"114":1}}],["选区起点所在的节点",{"2":{"114":1}}],["选中所有文本",{"2":{"113":1}}],["撤销",{"2":{"113":1}}],["斜体",{"2":{"113":1}}],["插画",{"2":{"695":1}}],["插入节点",{"2":{"229":1}}],["插入文档或之后触发",{"2":{"229":1}}],["插入",{"2":{"115":1}}],["插入一张图片",{"2":{"113":1}}],["插入一个",{"2":{"113":1}}],["插件进程",{"2":{"348":1}}],["插件扩展",{"2":{"251":1}}],["插件规则",{"2":{"246":2}}],["插件名",{"2":{"242":2}}],["插件如何处理favicon",{"2":{"145":2}}],["插件",{"0":{"131":1,"135":1,"142":1},"1":{"132":1,"143":1,"144":1,"145":1,"146":1,"147":1},"2":{"104":1}}],["~~~",{"2":{"643":1}}],["~",{"0":{"615":1},"2":{"113":1,"688":1,"865":2,"876":1}}],["要发送的",{"2":{"718":1}}],["要求客户端执行临时重定向",{"2":{"520":1}}],["要求请求者重置文档视图",{"2":{"512":1}}],["要连接的目标是服务器端的套接字",{"2":{"487":1}}],["要使用",{"2":{"424":1}}],["要处理的事件名函数",{"2":{"218":1}}],["要处理的事件名",{"2":{"218":1}}],["要包围当前文本块的",{"2":{"113":1}}],["要执行的命令名称",{"2":{"112":2}}],["修饰符",{"2":{"666":2}}],["修改字体",{"2":{"113":1}}],["修复",{"2":{"64":1}}],["剪切板事件对象",{"2":{"197":1}}],["剪切",{"2":{"113":1}}],["字面类型",{"2":{"862":1}}],["字符范围",{"2":{"815":1}}],["字符",{"2":{"814":1}}],["字符编码",{"2":{"619":1}}],["字符串",{"2":{"113":2,"303":1}}],["字节的掩码",{"2":{"489":1}}],["字节的主机地址",{"2":{"443":1}}],["字节的网络地址",{"2":{"441":1,"442":1,"443":1}}],["字节主机地址",{"2":{"441":1,"442":1}}],["字节序",{"0":{"281":1}}],["字节",{"2":{"274":1,"275":1,"277":1,"433":1}}],["字节码需要通过解释器将其转换为机器码后才能执行",{"2":{"173":1}}],["字节码是介于",{"2":{"173":1}}],["字体颜色",{"2":{"113":1}}],["字体大小",{"2":{"113":1}}],["字体名称",{"2":{"113":1}}],["字典树",{"0":{"14":1}}],["设备事件",{"0":{"233":1}}],["设置背景颜色",{"2":{"718":2}}],["设置html字符串",{"2":{"717":1}}],["设置值",{"2":{"717":2}}],["设置默认css样式表集的名称",{"2":{"701":1}}],["设置flex布局后",{"2":{"651":1}}],["设置高度有效",{"2":{"643":2}}],["设置高度无效",{"2":{"643":1}}],["设置宽度的情况",{"2":{"599":1}}],["设置宽度",{"2":{"599":2}}],["设置的",{"2":{"404":1}}],["设置300s",{"2":{"400":2}}],["设置一天",{"2":{"399":2}}],["设置一个时间来控制显示隐藏",{"2":{"168":1}}],["设置哪些域名可以访问",{"2":{"397":1}}],["设置多个",{"2":{"395":2}}],["设置关键资源的优先级",{"2":{"376":1}}],["设置",{"2":{"268":1,"326":2,"402":1,"403":1,"815":1}}],["设置元素样式",{"2":{"188":2}}],["设置文档的背景颜色",{"2":{"113":1}}],["设计规范",{"0":{"161":1,"756":1},"1":{"162":1,"163":1,"164":1,"757":1,"758":1,"759":1}}],["设计",{"2":{"13":1,"67":1}}],["值从",{"2":{"815":1}}],["值时",{"2":{"712":1}}],["值不在遍历值当中",{"2":{"669":1}}],["值形式",{"2":{"668":1}}],["值必须为对象",{"2":{"668":1}}],["值",{"2":{"113":1,"218":1,"494":1,"667":2,"668":1,"761":1}}],["无效function",{"2":{"803":1}}],["无效",{"2":{"717":2,"803":1,"811":1,"815":1}}],["无效的请求消息或欺骗性路由请求",{"2":{"528":1}}],["无作用域的元素",{"2":{"717":1}}],["无类别域间路由",{"0":{"551":1}}],["无类型域间选路",{"2":{"429":1}}],["无法与",{"2":{"874":1}}],["无法使用",{"2":{"777":1}}],["无法改变所在的作用域",{"2":{"775":3}}],["无法确定优先级",{"2":{"737":1}}],["无法通过",{"2":{"670":1}}],["无法实现垂直居中",{"2":{"590":1}}],["无法保证服务器发送给浏览器的数据安全",{"2":{"558":1}}],["无法完成对请求的处理",{"2":{"539":1}}],["无法收到确认",{"2":{"481":1}}],["无需验证返回",{"2":{"511":1}}],["无需服务端配置",{"2":{"270":1}}],["无特定地址",{"2":{"496":1}}],["无任何副作用",{"2":{"131":2}}],["无",{"2":{"112":2}}],["无向图探测",{"2":{"16":1}}],["无向图",{"2":{"15":1}}],["富文本选区",{"0":{"114":1}}],["富文本编辑",{"0":{"112":1},"1":{"113":1,"114":1,"115":1,"116":1}}],["富文本可编辑属性",{"2":{"111":1}}],["以外的值",{"2":{"810":1}}],["以这种方式创建函数",{"2":{"761":1}}],["以像素计",{"2":{"718":2}}],["以",{"2":{"676":3}}],["以便区分伪元素",{"2":{"632":1}}],["以便最有效的利用现有的地址空间",{"2":{"550":1}}],["以便其方法可以可用于处理数据",{"2":{"206":1}}],["以空行结束",{"2":{"501":1}}],["以防下次请求",{"2":{"480":1}}],["以形成分组",{"2":{"475":1}}],["以设置与另一应用软件之间的通信",{"2":{"471":1}}],["以太网",{"0":{"463":1},"2":{"476":1}}],["以太网规定",{"2":{"433":1}}],["以太网的默认值",{"2":{"433":1}}],["以此类推",{"2":{"297":1}}],["以8位二进制为例",{"2":{"294":1}}],["以上方式如果不指定高度",{"2":{"650":1}}],["以上方式都会生成浏览器新的历史记录",{"2":{"271":1}}],["以上三种方式同样效果",{"2":{"271":1}}],["以及一个最终字节组成",{"2":{"815":1}}],["以及一个",{"2":{"564":1}}],["以及",{"2":{"560":1}}],["以及利用随机数的生成密钥的算法都是公开的",{"2":{"555":1}}],["以及冷门的api学习都要串联起来",{"2":{"128":1}}],["以及各个顶点对应的前一个顶点",{"2":{"16":1}}],["以下优先级从高到底",{"2":{"744":1}}],["以下截图来源",{"2":{"719":1}}],["以下元素也可以是替换元素",{"2":{"638":1}}],["以下代码片段在两个连续异步代码块中重新连接",{"2":{"159":1,"754":1}}],["以下",{"2":{"112":1}}],["以下图片失效",{"2":{"110":1}}],["yield",{"2":{"669":11}}],["yellow",{"2":{"859":2}}],["yeild",{"2":{"669":1}}],["year",{"2":{"666":4}}],["yes",{"2":{"461":25,"761":5,"762":6}}],["y",{"2":{"586":1,"666":3,"861":4,"864":4,"866":2,"874":10}}],["yandex",{"2":{"347":2}}],["yarn",{"0":{"327":1},"1":{"328":1,"329":1,"330":1},"2":{"109":2,"329":1,"330":1}}],["your",{"2":{"250":1,"677":2,"857":2}}],["y距离",{"2":{"226":1}}],["yz",{"0":{"23":1},"1":{"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1}}],["建议使用",{"2":{"859":1}}],["建立新的线程",{"2":{"487":1}}],["建立连接",{"0":{"490":1},"2":{"106":1}}],["建堆",{"2":{"12":3}}],["刷新页面",{"2":{"106":1}}],["文字代码html",{"2":{"698":1}}],["文字特性的",{"2":{"643":1}}],["文字特性",{"0":{"643":1},"1":{"644":1,"645":1,"646":1,"647":1,"648":1,"649":1,"650":1,"651":1}}],["文章",{"2":{"324":1,"687":1}}],["文本内容",{"2":{"640":1}}],["文本和行内元素围绕着浮动元素",{"2":{"597":1}}],["文本方向属性决定",{"2":{"580":1}}],["文本框输入文本时最长用到",{"2":{"227":1}}],["文本",{"2":{"160":1,"755":1}}],["文件结构定义",{"0":{"867":1},"1":{"868":1,"869":1,"870":1,"871":1,"872":1,"873":1,"874":1}}],["文件绝对路经",{"2":{"857":2}}],["文件定义中多个",{"2":{"852":1}}],["文件开头加入以下代码",{"2":{"832":1}}],["文件访问",{"2":{"728":1}}],["文件会指向",{"2":{"425":1}}],["文件编写格式",{"2":{"336":1}}],["文件作为",{"2":{"330":1}}],["文件的硬链接",{"2":{"321":1}}],["文件也会更改",{"2":{"321":1}}],["文件名",{"2":{"263":1}}],["文件夹",{"2":{"139":1,"309":1}}],["文件",{"0":{"145":1,"856":1},"1":{"857":1,"858":1},"2":{"137":1,"322":2,"423":1,"620":1,"854":2,"857":4,"871":1}}],["文件中",{"2":{"106":1}}],["文档片段",{"2":{"716":1}}],["文档结构发生变化时",{"2":{"716":1}}],["文档最外层元素使用块布局规则称为初始块格式上下文",{"2":{"574":1}}],["文档编辑",{"0":{"335":1}}],["文档在",{"2":{"232":2}}],["文档接收到事件",{"2":{"214":1}}],["文档中嵌套层次最深的那个节点",{"2":{"213":1}}],["文档标题",{"2":{"134":2}}],["文档技术",{"0":{"119":1}}],["文档执行预定义命令",{"2":{"112":2}}],["文档",{"2":{"110":1,"213":1}}],["文档桌面应用客户端",{"2":{"110":1}}],["文档对象模型",{"2":{"72":1}}],["和函数如何调用的没关系",{"2":{"771":1}}],["和原型有关的几个",{"2":{"762":1}}],["和根",{"2":{"568":1}}],["和响应数据格式",{"2":{"482":1}}],["和样式重算",{"2":{"357":1}}],["和结束位置",{"2":{"189":1,"191":1}}],["和机器码之间的一种代码",{"2":{"173":1}}],["和",{"0":{"231":1},"2":{"106":1,"114":1,"167":1,"168":4,"212":1,"218":1,"226":1,"266":1,"282":2,"294":1,"311":1,"312":1,"353":1,"369":1,"381":1,"416":1,"452":1,"463":1,"554":2,"555":1,"568":1,"575":1,"582":1,"583":1,"618":2,"639":1,"672":2,"718":2,"761":1,"777":1,"821":1,"863":2,"874":1}}],["所执行的环境作用域",{"2":{"773":1}}],["所在的线程",{"2":{"730":1}}],["所标识的资源",{"2":{"456":1}}],["所以传递到",{"2":{"820":1}}],["所以不能通过取整的方式来计算",{"2":{"191":2}}],["所以这里我们把",{"2":{"106":1}}],["所有文件会被编译成一个文件",{"2":{"857":2}}],["所有序列都以",{"2":{"814":1}}],["所有",{"2":{"797":1}}],["所有属性被实例共享",{"2":{"761":1}}],["所有非标准字符编码",{"2":{"708":1}}],["所有参与折叠的元素外边距都为负值",{"2":{"583":1}}],["所有元素都支持",{"2":{"227":1}}],["所有的活动对象都向一端移动",{"2":{"183":1}}],["所有的顶点",{"2":{"16":1}}],["所有标记完成之后",{"2":{"181":1}}],["所有垃圾回收机制",{"2":{"181":1}}],["所有代码执行的时间",{"2":{"0":1}}],["发出",{"2":{"826":1}}],["发生以下步骤",{"2":{"804":1}}],["发生强制转换类型",{"2":{"720":1}}],["发生的变化比最初计划回调微任务的变化更多",{"2":{"162":1,"757":1}}],["发起请求数据包",{"2":{"480":1}}],["发现是热点代码之后",{"2":{"174":1}}],["发送给服务器确认",{"2":{"559":1,"563":1}}],["发送方",{"2":{"419":2,"491":2}}],["发送",{"2":{"402":10}}],["发送信号",{"2":{"106":1}}],["发送一组信号",{"2":{"106":2}}],["发布到正式环境",{"2":{"870":1}}],["发布包",{"2":{"832":1}}],["发布",{"2":{"67":1,"669":1}}],["⚔",{"2":{"106":4}}],["创建实例",{"2":{"866":1}}],["创建文本节点",{"2":{"716":1}}],["创建文件",{"2":{"317":1}}],["创建新的",{"2":{"575":1,"576":1}}],["创建一个新的对象",{"2":{"804":1}}],["创建一个新函数",{"2":{"764":1}}],["创建一个新对象方法都能用于此处",{"2":{"762":2}}],["创建一个新对象",{"2":{"761":1}}],["创建一个函数",{"2":{"761":1}}],["创建一个全局函数",{"2":{"761":1}}],["创建一个对象",{"0":{"761":1}}],["创建一个到",{"2":{"321":1}}],["创建一个子解析器",{"0":{"140":1},"1":{"141":1}}],["创建软链接",{"2":{"317":1}}],["创建的子",{"2":{"132":1}}],["创建包围元素",{"2":{"114":2}}],["创建",{"0":{"143":1,"318":1,"322":1},"2":{"106":2,"137":1,"206":1,"728":1}}],["创建分支过程",{"2":{"60":1}}],["服务收到非对称加密套件列表",{"2":{"556":1}}],["服务集成",{"2":{"347":4}}],["服务地址",{"2":{"106":2}}],["服务",{"2":{"106":1,"347":3}}],["服务端套接字接收到客户端套接字的连接请求",{"2":{"487":1}}],["服务端",{"2":{"105":1,"106":2,"108":1,"490":1}}],["服务器能够处理的字符集",{"2":{"718":1}}],["服务器浏览器确认返回信息",{"2":{"559":1,"563":1}}],["服务器收到消息",{"2":{"559":1,"563":1}}],["服务器收到加密套件列表",{"2":{"553":1}}],["服务器当前无法处理请求",{"2":{"542":1}}],["服务器维护或者过载",{"2":{"542":1}}],["服务器不支持当前请求所需要的某个功能",{"2":{"540":1}}],["服务器不能或不会处理该请求",{"2":{"528":1}}],["服务器出现问题",{"2":{"539":1}}],["服务器错误",{"2":{"538":1}}],["服务器成功处理了请求",{"2":{"511":1}}],["服务器是一个转换代理服务器",{"2":{"510":1}}],["服务器已经理解请求",{"2":{"531":1}}],["服务器已经理解客户端的请求",{"2":{"503":1}}],["服务器已经成功处理了部分",{"2":{"513":1}}],["服务器已经接受请求",{"2":{"509":1}}],["服务器已经接收到请求头",{"2":{"502":1}}],["服务器已经收到并正在处理请求",{"2":{"504":1}}],["服务器获取握手请求中的",{"2":{"494":1}}],["服务器端套接字继续处于监听状态",{"2":{"487":1}}],["服务器端套接字并不定位具体的客户端套接字",{"2":{"487":1}}],["服务器监听",{"2":{"487":1}}],["服务器会给",{"2":{"425":1}}],["服务器请求计算机的配置信息",{"2":{"425":1}}],["服务器请求下载文件",{"2":{"425":1}}],["服务器的地址",{"2":{"424":1,"425":1}}],["服务器权限",{"2":{"406":1}}],["服务器响应速度",{"2":{"381":1}}],["服务器域名",{"2":{"271":1}}],["服务器",{"0":{"497":1},"2":{"50":1,"446":1}}],["模型不区分物理层和数据链路层",{"2":{"483":1}}],["模型之外的任何协议栈",{"2":{"483":1}}],["模型的第二层",{"2":{"464":1}}],["模式",{"2":{"309":1,"854":1}}],["模板",{"2":{"143":2}}],["模板地址",{"2":{"134":2}}],["模板内容不改变",{"2":{"132":1}}],["模板html",{"2":{"108":1}}],["模板文件生成之后",{"2":{"139":2}}],["模板文件生成之前",{"2":{"139":2}}],["模板文件",{"2":{"104":1,"146":1}}],["模块模板",{"0":{"869":1},"1":{"870":1}}],["模块化",{"0":{"868":1}}],["模块化设计",{"0":{"32":1},"1":{"33":1,"34":1,"35":1}}],["模块路径解析",{"2":{"845":1}}],["模块的运行时",{"2":{"853":1}}],["模块的类型",{"2":{"842":1}}],["模块的负责人负责自身模块的技术优化方案",{"2":{"64":1}}],["模块只加载一次",{"2":{"681":1}}],["模块名",{"2":{"309":2}}],["模块",{"0":{"147":1},"2":{"147":1,"669":1,"857":2}}],["模块负责人对自身模块执行的关键点进行标记",{"2":{"66":1}}],["模块变动其他模块配置都需更新",{"2":{"65":1}}],["模块耦合严重",{"0":{"63":1}}],["模块数量",{"2":{"62":1}}],["模块拆分以及协作方式",{"2":{"34":1}}],["模块划分与设计原则",{"0":{"34":1}}],["时可以定义",{"2":{"861":1}}],["时可调用",{"2":{"221":1}}],["时不会引发错误",{"2":{"738":1}}],["时其浮动的元素",{"2":{"575":1}}],["时是被禁止的",{"2":{"493":1}}],["时应忽略这些条目",{"2":{"380":1}}],["时应忽略这些页面",{"2":{"380":1}}],["时",{"2":{"163":1,"188":2,"326":1,"408":1,"672":2,"735":1,"737":1,"758":1,"808":1}}],["时获取资源文件",{"2":{"104":1}}],["时间获取键码",{"2":{"227":1}}],["时间",{"2":{"168":2,"694":1}}],["时间维度",{"2":{"67":1}}],["时间角度",{"0":{"49":1},"1":{"50":1,"51":1,"52":1,"53":1}}],["时间和空间",{"2":{"48":1}}],["时间复杂度",{"0":{"1":1}}],["访问普通对象的",{"2":{"763":1}}],["访问到被定义为隐式属性的",{"2":{"763":1}}],["访问数组元素",{"0":{"743":1}}],["访问不到有关安全的",{"2":{"196":1}}],["访问",{"2":{"104":1}}],["访问过的节点即存在环",{"2":{"16":1}}],["没多大影响",{"2":{"877":2}}],["没开启",{"2":{"859":2}}],["没按下",{"2":{"226":1}}],["没错",{"2":{"168":2}}],["没看到而已",{"2":{"104":1}}],["没有明显的导出",{"2":{"840":1}}],["没有明显地区区分服务",{"2":{"483":1}}],["没有被调度的计时器时",{"2":{"819":1}}],["没有被内部捕获",{"2":{"669":1}}],["没有",{"2":{"761":1}}],["没有边框",{"2":{"583":3}}],["没有内容将父元素和后代元素分开",{"2":{"583":1}}],["没有返回任何内容",{"2":{"511":1}}],["没有基线",{"2":{"326":1}}],["没有打印",{"2":{"157":2,"158":2,"159":2,"752":2,"753":2,"754":2}}],["没有直接使用webpack插件提供的主compiler",{"2":{"140":1}}],["没有其他作用",{"2":{"95":1}}],["没有父节点或者当前删除的节点与父节点比较",{"2":{"12":1}}],["没有左节点",{"2":{"12":1}}],["进程被创建",{"2":{"729":1}}],["进程是",{"2":{"725":1}}],["进程模式",{"0":{"354":1}}],["进程",{"0":{"348":1,"353":1,"725":1},"1":{"349":1,"350":1,"351":1,"352":1,"353":1},"2":{"348":2,"356":1,"357":1,"358":1,"359":1,"360":1,"361":1,"362":1,"363":1,"364":1,"365":1,"366":1,"367":2,"368":2,"724":1,"729":1}}],["进程合成",{"2":{"52":1}}],["进制转换",{"0":{"285":1},"1":{"286":1,"287":1,"288":1,"289":1,"290":1}}],["进行",{"2":{"494":1}}],["进行外部网关协议和其他自治域之间拓扑信息的交换",{"2":{"466":1}}],["进行样式分析",{"2":{"357":1}}],["进行路由的处理",{"2":{"269":1}}],["进行查看",{"2":{"196":1}}],["进行优化",{"2":{"132":1}}],["进行文件的记忆性生成",{"2":{"104":1}}],["利用私钥解密数据",{"2":{"557":1}}],["利用nodejs",{"2":{"147":2}}],["利用了主",{"2":{"132":1}}],["利用",{"2":{"104":1,"106":3}}],["利用以上变量遍历返回成环的对象",{"2":{"16":1}}],["中配置",{"2":{"857":2}}],["中控制显示隐藏的属性",{"2":{"652":1}}],["中元素的布局",{"2":{"575":1}}],["中继器",{"2":{"477":1}}],["中采用",{"2":{"284":1}}],["中忽略文件不生效",{"2":{"252":1}}],["中次",{"2":{"226":1}}],["中间字节",{"2":{"815":1}}],["中间",{"2":{"226":1,"568":1}}],["中间件作用",{"2":{"104":1}}],["中间件",{"2":{"104":2}}],["中去",{"2":{"137":1}}],["中的配置",{"2":{"831":1}}],["中的",{"2":{"618":2,"668":1,"718":3,"763":1,"848":1}}],["中的元素",{"2":{"380":1}}],["中的滚动与动画",{"2":{"352":1}}],["中的目录和文件名",{"2":{"271":1}}],["中的文件加入到主",{"2":{"137":1}}],["中的字符数量",{"2":{"114":1}}],["中包含在选区之内的字符数量",{"2":{"114":1}}],["中",{"0":{"146":1},"1":{"147":1},"2":{"106":2,"232":1,"482":1,"637":1,"804":1,"828":1,"857":2}}],["中序遍历",{"2":{"21":1}}],["思考",{"2":{"168":1,"188":1}}],["思考三",{"0":{"105":1},"1":{"106":1}}],["思考二",{"0":{"103":1},"1":{"104":1}}],["思考一",{"0":{"101":1},"1":{"102":1}}],["启动文件",{"2":{"425":1}}],["启动参数可控",{"2":{"354":1}}],["启动脚本命令时",{"2":{"329":1}}],["启动项目脚本目录",{"2":{"108":1}}],["启动",{"2":{"104":1,"423":2,"425":2,"433":1}}],["启动端口",{"2":{"102":2}}],["启动一个端口服务作为服务端",{"2":{"101":1}}],["解码",{"2":{"705":1,"707":1,"709":1}}],["解构赋值",{"0":{"664":1}}],["解决了什么问题",{"0":{"576":1}}],["解决了两个编码问题",{"2":{"294":1}}],["解决物理网络本身的某些问题",{"2":{"549":1}}],["解决",{"2":{"546":1}}],["解决方式",{"0":{"645":1},"1":{"646":1,"647":1,"648":1,"649":1,"650":1,"651":1}}],["解决方法",{"0":{"299":1}}],["解决方案",{"0":{"189":1},"1":{"190":1,"191":1}}],["解决问题",{"2":{"100":1}}],["解析成抽象语法树",{"2":{"766":1}}],["解析浏览器进程传送的字节",{"2":{"356":1}}],["解析",{"0":{"848":1,"849":1},"2":{"172":1,"766":1}}],["解析器",{"0":{"144":1}}],["解释执行",{"2":{"765":1}}],["解释器解析生成字节码",{"2":{"174":1}}],["解释器逐条解释执行",{"2":{"174":1}}],["解释器",{"2":{"174":2}}],["解释器和执行器",{"0":{"170":1}}],["解释性代码如下",{"2":{"142":1}}],["解释",{"2":{"113":1}}],["解答",{"0":{"102":1,"104":1,"106":1}}],["编码",{"0":{"703":1},"1":{"704":1,"705":1,"706":1,"707":1,"708":1,"709":1},"2":{"494":1,"703":1,"704":1}}],["编码规范",{"2":{"60":1}}],["编辑器自动从",{"2":{"857":2}}],["编辑器",{"2":{"857":2}}],["编辑",{"2":{"321":1,"336":1}}],["编译能通过运行会报错",{"2":{"863":1}}],["编译ts文件",{"2":{"858":2}}],["编译成",{"2":{"854":1}}],["编译原理",{"0":{"766":1}}],["编译器把热点的字节码编译成机器码",{"2":{"174":1}}],["编译器首先会依次对源代码进行词法分析",{"2":{"170":1}}],["编译结果也不能在分布式系统上移植",{"2":{"765":1}}],["编译结果",{"2":{"147":1}}],["编译",{"2":{"147":2,"857":2}}],["编译入口文件结果资源",{"2":{"143":2}}],["编译后的内容",{"2":{"137":1}}],["编译出错时打印日志",{"2":{"104":2}}],["编译完成",{"2":{"100":1}}],[">",{"2":{"99":1}}],["删减改版",{"2":{"98":1}}],["删除或者更改名字",{"2":{"330":1}}],["删除原始文件不影响硬链接",{"2":{"320":1}}],["删除原始文件",{"2":{"317":1,"318":2,"321":1,"322":2}}],["删除结点",{"2":{"156":1,"751":1}}],["删除选择的文本",{"2":{"113":1}}],["删除节点",{"2":{"21":1,"229":1}}],["删除的元素",{"2":{"12":1}}],["删除",{"2":{"12":1}}],["返回类型",{"2":{"838":1}}],["返回新对象",{"2":{"761":1}}],["返回其右侧操作数",{"2":{"735":1}}],["返回所有的样式",{"2":{"718":2}}],["返回所有匹配的结果数组",{"2":{"666":1}}],["返回给定属性的字符串值",{"2":{"718":1}}],["返回给浏览器",{"2":{"553":1}}],["返回包含给定属性值的",{"2":{"718":1}}],["返回子元素",{"2":{"717":1}}],["返回new命令作用于的那个构造函数",{"2":{"670":1}}],["返回遍历器对象",{"2":{"669":1}}],["返回正则表达式的修饰符",{"2":{"666":1}}],["返回当前匹配的数组",{"2":{"666":1}}],["返回表示指定计数器当前值的拼接字符串",{"2":{"641":1}}],["返回加密方式和公钥",{"2":{"556":1}}],["返回的对象与构造函数或者构造函数属性没有关系",{"2":{"761":1}}],["返回的是一个遍历器对象",{"2":{"669":1}}],["返回的结果给一个赋值变量",{"2":{"669":1}}],["返回的窗口对象",{"2":{"419":1}}],["返回的函数带有三个属性方法",{"2":{"95":1}}],["返回三个属性",{"2":{"309":1}}],["返回服务器域名",{"2":{"271":1}}],["返回一个标识",{"2":{"309":2}}],["返回一个可以被",{"2":{"206":1}}],["返回一个新的",{"2":{"206":1}}],["返回一个数组",{"2":{"206":1,"309":2}}],["返回一个",{"2":{"198":1,"206":1}}],["返回结束位置",{"2":{"190":2}}],["返回字符数据改变的上一个字符",{"2":{"160":1,"755":1}}],["返回属性改变的上一个值",{"2":{"160":1,"755":1}}],["返回属性名的命名空间",{"2":{"156":1,"751":1}}],["返回后一天结点",{"2":{"156":1,"751":1}}],["返回前一个结点",{"2":{"156":1,"751":1}}],["返回",{"2":{"137":1,"156":2,"198":1,"271":3,"669":1,"751":2}}],["返回选区所包含的文本内容",{"2":{"114":1}}],["返回索引对应的选区中的",{"2":{"114":1}}],["返回定时器状态",{"2":{"95":1}}],["详见源码",{"2":{"95":1}}],["如下",{"2":{"857":2}}],["如今版本的默认策略",{"2":{"354":1}}],["如",{"2":{"196":1,"419":1,"446":1}}],["如果支持",{"2":{"859":1}}],["如果仍然想用更高版本的",{"2":{"857":2}}],["如果没有指定规则",{"2":{"838":1}}],["如果没有",{"2":{"838":1}}],["如果需要使用交叉类型",{"2":{"837":1}}],["如果一个或多个计时器已准备就绪",{"2":{"824":1}}],["如果一个脚本来自不同的域",{"2":{"404":1}}],["如果脚本未被",{"2":{"824":1}}],["如果脚本被",{"2":{"819":1,"824":1}}],["如果绑定为",{"2":{"808":1}}],["如果绑定的对象为",{"2":{"808":1}}],["如果函数没有返回其他对象",{"2":{"804":1}}],["如果指定",{"2":{"701":1,"857":2}}],["如果等号左边不是可遍历对象",{"2":{"664":1}}],["如果相等",{"2":{"582":1}}],["如果放不下",{"2":{"433":1}}],["如果两个",{"2":{"416":1}}],["如果从一个页面打开了另一个新页面",{"2":{"354":1}}],["如果该框没有基线",{"2":{"326":1}}],["如果不能推断参数类型",{"2":{"866":1}}],["如果不包括散列",{"2":{"271":1}}],["如果不对上一页数据节点处理",{"2":{"187":1}}],["如果嵌入的内容没有加载完触发",{"2":{"224":1}}],["如果文档中有选择的文字会优先复制该选择的文字",{"2":{"195":2}}],["如果上述描述不对",{"2":{"192":1}}],["如果编译成功",{"2":{"170":1}}],["如果为",{"2":{"160":2,"755":2}}],["如果你去开发你会怎么做",{"2":{"111":1}}],["如果设置了",{"2":{"95":1}}],["如何定义",{"2":{"867":1}}],["如何创建泛型",{"2":{"866":1}}],["如何计算响应头中",{"2":{"494":1}}],["如何配置",{"0":{"421":1}}],["如何衡量",{"0":{"380":1}}],["如何实现复制",{"0":{"193":1},"1":{"194":1,"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1,"206":1}}],["如何实现一个简易热更新",{"2":{"99":1}}],["如何通过时刻变化的滚动高度计算出替换的节点",{"2":{"188":1}}],["如何通信并刷新浏览器",{"2":{"106":1}}],["如何处理过渡或者动画",{"2":{"168":1}}],["如何注入到",{"0":{"146":1},"1":{"147":1}}],["如何写一个",{"2":{"144":1}}],["如何使用额外的",{"2":{"132":1}}],["如何面对项目中的一些痛点",{"2":{"57":1}}],["如何设计一个项目",{"2":{"57":1}}],["如何快速定位并解决问题",{"2":{"40":1}}],["如何及时发现问题",{"2":{"40":1}}],["如何搭建一个前端监控体系",{"2":{"39":1}}],["如何进行模块间依赖的解耦",{"0":{"35":1}}],["如何系统化",{"2":{"22":1}}],["参与折叠的外边距包含负值",{"2":{"583":1}}],["参考链接",{"2":{"552":1}}],["参考文件",{"2":{"106":1}}],["参考目录",{"2":{"106":4}}],["参考",{"2":{"106":2}}],["参考现有的技术方案",{"2":{"59":1}}],["参数名字可以不一致",{"2":{"860":2}}],["参数或者属性可以为",{"2":{"837":1}}],["参数字节",{"2":{"815":2}}],["参数传递也是此行为",{"2":{"802":2}}],["参数是否为",{"2":{"671":1}}],["参数指定的这一版之后",{"2":{"522":1}}],["参数相同",{"2":{"218":1}}],["参数为字符串时",{"2":{"268":1}}],["参数为",{"2":{"210":2}}],["参数属性介绍",{"2":{"160":1,"755":1}}],["参数",{"2":{"95":2,"257":1,"263":1,"266":1,"803":1,"810":2,"815":1}}],["覆盖指定文件配置",{"2":{"239":1}}],["覆盖",{"2":{"95":1,"763":1}}],["属性指向哪里",{"2":{"848":1}}],["属性指向函数",{"2":{"764":1}}],["属性会触发",{"2":{"763":1}}],["属性共享问题",{"2":{"762":1}}],["属性提供值",{"2":{"701":1}}],["属性和",{"2":{"701":1}}],["属性时",{"2":{"672":2}}],["属性类",{"2":{"666":1}}],["属性值必须有",{"2":{"701":1}}],["属性值提供",{"2":{"701":1}}],["属性值严格等于",{"2":{"664":1}}],["属性值默认为",{"2":{"590":1}}],["属性应用在元素的",{"2":{"639":1}}],["属性选择器",{"0":{"608":1}}],["属性取值",{"0":{"598":1,"603":1}}],["属性创建",{"0":{"575":1}}],["属性的所有表格单元格",{"2":{"575":1}}],["属性的",{"2":{"394":1}}],["属性后",{"2":{"326":1}}],["属性不为",{"2":{"326":1,"575":1}}],["属性修改之后触发",{"2":{"229":1}}],["属性名",{"2":{"156":1,"751":1}}],["属性",{"0":{"639":1,"642":1},"1":{"640":1,"641":1},"2":{"95":1,"167":3,"221":1,"222":1,"271":1,"402":1,"589":1,"641":1,"666":4,"717":1,"763":1,"776":2,"864":1}}],["配置站点",{"2":{"857":4}}],["配置为",{"2":{"857":2}}],["配置路径",{"2":{"857":2}}],["配置参数",{"0":{"857":1}}],["配置中的",{"2":{"846":1}}],["配置忽略文件",{"0":{"252":1}}],["配置项目文件结构",{"0":{"250":1}}],["配置举例",{"0":{"245":1}}],["配置规则",{"0":{"243":1},"1":{"244":1,"245":1,"246":1,"247":1}}],["配置插件",{"0":{"242":1}}],["配置文件",{"2":{"236":1,"421":1,"424":1}}],["配置的",{"2":{"139":1}}],["配置",{"0":{"134":1,"236":1,"832":1,"850":1},"2":{"95":2,"424":1,"841":1,"850":1}}],["配合",{"2":{"65":1,"104":1,"842":1}}],["配合客户端将资源和数据进行离线",{"2":{"51":1}}],["配合客户端进行资源预请求和预加载",{"2":{"51":1}}],["执行其回调函数",{"2":{"828":1}}],["执行所提供的回调的阈值",{"2":{"821":1}}],["执行与",{"2":{"819":1,"824":1}}],["执行延迟到下一个循环迭代的",{"2":{"819":1,"822":1}}],["执行上下文",{"2":{"796":1}}],["执行构造函数的代码",{"2":{"761":1}}],["执行过程中如果遇到微任务",{"2":{"733":1}}],["执行一个宏任务",{"2":{"733":1}}],["执行栈中所有同步任务执行完毕",{"2":{"733":1}}],["执行多次",{"2":{"681":2}}],["执行到一半",{"2":{"669":1}}],["执行文件",{"2":{"425":1}}],["执行复制命令",{"2":{"195":2}}],["执行字节码过程中",{"2":{"174":1}}],["执行代码",{"0":{"171":1,"174":1},"1":{"172":1,"173":1,"174":1}}],["执行",{"2":{"147":2,"351":1,"737":2,"797":2}}],["执行命令必须的一个值",{"2":{"112":2}}],["执行继续等待时间",{"2":{"95":1}}],["执行等待时间",{"2":{"95":1}}],["执行函数",{"2":{"95":1,"303":1}}],["执行逻辑",{"2":{"24":1}}],["接入",{"2":{"511":1}}],["接受请求的",{"2":{"718":1}}],["接受多个进程传递过来的",{"2":{"367":1}}],["接受",{"2":{"353":1}}],["接多个分支或者分支的",{"2":{"257":1}}],["接收绑定对象和",{"2":{"803":2}}],["接收一个字符串作为参数",{"2":{"775":1}}],["接收到响应时",{"2":{"521":1}}],["接收到客户机的",{"2":{"422":1}}],["接收其他客户端套接字的连接请求",{"2":{"487":1}}],["接收返回消息",{"2":{"480":1}}],["接收方",{"2":{"419":2,"491":2}}],["接收多少秒",{"2":{"400":1}}],["接收四个参数",{"2":{"309":1}}],["接收两个参数",{"2":{"219":1,"762":1}}],["接收",{"2":{"213":1,"399":1,"422":1}}],["接收三个参数",{"2":{"95":1,"112":2,"218":1,"268":2,"303":1}}],["接下来重新改一下代码",{"2":{"168":2}}],["接下来引入transitionend事件",{"2":{"168":2}}],["接下来介绍一下",{"2":{"168":1}}],["接口之间可以相互继承",{"2":{"860":1}}],["接口继承类",{"2":{"860":1}}],["接口继承",{"2":{"860":1}}],["接口实现",{"2":{"860":1}}],["接口",{"2":{"860":1}}],["接口可以重复定义",{"2":{"837":1}}],["接口可以继承类的属性与方法",{"2":{"860":1}}],["接口可以继承",{"2":{"837":1}}],["接口和协议的概念",{"2":{"483":1}}],["接口协议",{"2":{"67":1}}],["接口耗时等各项数据统计",{"2":{"41":1}}],["接口测试",{"0":{"25":1}}],["剩余时间执行一次",{"2":{"92":2}}],["\\t\\tipfilter",{"2":{"428":2}}],["\\t\\tid",{"2":{"428":2}}],["\\t\\troot",{"2":{"428":2}}],["\\t\\tmaxage",{"2":{"428":2}}],["\\tconfiguration",{"2":{"428":2}}],["\\tstatus",{"2":{"428":14}}],["\\tmember",{"2":{"428":4}}],["\\tmedia",{"2":{"428":14}}],["\\tmax",{"2":{"424":2}}],["\\tether",{"2":{"428":14}}],["\\tnd6",{"2":{"428":14}}],["\\tnext",{"2":{"424":2}}],["\\tinet6",{"2":{"428":14}}],["\\tinet",{"2":{"428":4}}],["\\tfilename",{"2":{"424":2}}],["\\trange",{"2":{"424":2}}],["\\tdefault",{"2":{"424":2}}],["\\toptions=63",{"2":{"428":2}}],["\\toptions=460",{"2":{"428":4}}],["\\toptions=400",{"2":{"428":8}}],["\\toptions=1203",{"2":{"428":2}}],["\\toption",{"2":{"424":6}}],["\\t",{"2":{"92":2,"428":4}}],["再来看看一个具体的元素",{"2":{"715":1}}],["再来看看",{"2":{"715":1}}],["再执行",{"2":{"669":1}}],["再执行一次",{"2":{"91":1}}],["再使用公钥对数字签名解密",{"2":{"566":1}}],["再次触发执行",{"2":{"78":1}}],["见下",{"2":{"80":1}}],["两者结合就实现了javascript的变量提升和块级作用域",{"2":{"780":1}}],["两者都应该依赖于抽象接口",{"2":{"35":1}}],["两边都会发生转换",{"2":{"723":1}}],["两个参数都要操作⚠️⚠️⚠️",{"2":{"672":2}}],["两个手指距离变化",{"2":{"234":1}}],["两种表现形式",{"2":{"859":1}}],["两种数据格式",{"2":{"718":1}}],["两种形式",{"2":{"641":1}}],["两种状态",{"2":{"168":1}}],["两大区别",{"2":{"227":1}}],["两块区域重复利用",{"2":{"182":1}}],["两秒之后",{"2":{"78":1}}],["两秒之后执行",{"2":{"75":1}}],["结束位置的每一项偏移高度进行预算",{"2":{"191":2}}],["结束",{"2":{"106":1}}],["结束顶点",{"2":{"15":1}}],["结合的动画",{"2":{"168":1}}],["结合",{"2":{"73":1,"545":1}}],["防止出现多种情况",{"2":{"872":1}}],["防止渲染结果不可预期",{"2":{"730":2}}],["防止",{"2":{"402":1}}],["防止栈溢出",{"2":{"55":1}}],["防抖",{"0":{"74":1},"1":{"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1}}],["防抖节流",{"0":{"73":1},"1":{"74":1,"75":1,"76":1,"77":1,"78":1,"79":1,"80":1,"81":1,"82":1,"83":1,"84":1,"85":1,"86":1,"87":1,"88":1,"89":1,"90":1,"91":1,"92":1,"93":1,"94":1,"95":1,"96":1,"97":1,"98":1}}],["一起使用",{"2":{"874":1}}],["一起打包到",{"2":{"106":1}}],["一一对应",{"2":{"870":1}}],["一直调用",{"2":{"820":1}}],["一直触发事件未大于设置的时间",{"2":{"91":1}}],["一直触发事件大于设置的时间",{"2":{"85":1,"88":1,"91":1}}],["一直触发事件大于定时时间",{"2":{"81":1}}],["一种带内信号的转义序列标准",{"2":{"813":1}}],["一种数据结构",{"2":{"785":1}}],["一组构造函数组成",{"2":{"671":1}}],["一段时间",{"2":{"669":1}}],["一般用于表格表示第几列中的元素指定的特殊样式",{"2":{"616":1}}],["一对套接字",{"2":{"487":1}}],["一样",{"2":{"452":1}}],["一级域名",{"2":{"397":1}}],["一级标题名称",{"2":{"337":2}}],["一级标题",{"2":{"337":2}}],["一步一个脚印",{"2":{"324":1}}],["一些关闭的回调函数",{"2":{"826":1}}],["一些常见的文档编辑格式以及前端文档编辑器",{"2":{"335":1}}],["一些新的规则集",{"2":{"251":1}}],["一些浏览器实现了",{"2":{"763":1}}],["一些浏览器可以支持",{"2":{"196":1}}],["一些浏览器在不安全模式下",{"2":{"196":1}}],["一次排列",{"2":{"577":1}}],["一次",{"2":{"234":1,"877":2}}],["一次性匹配所有结果",{"2":{"666":1}}],["一次性",{"2":{"70":1}}],["一个对象既可以表现为函数形式",{"2":{"860":1}}],["一个进程中可以有多个线程",{"2":{"725":1}}],["一个父元素下所有文本节点合并成一个节点",{"2":{"716":1}}],["一个参数⚠️⚠️⚠️",{"2":{"672":2}}],["一个文件同时出现",{"2":{"672":2}}],["一个选择器中只能使用一个伪元素",{"2":{"632":1}}],["一个容器全部为浮动元素时",{"2":{"602":1}}],["一个块元素内存在内联元素",{"2":{"577":1}}],["一个接口处于网络层和数据链路层之间",{"2":{"483":1}}],["一个网络通向其他网络的",{"2":{"465":1}}],["一个网络包从一个地方传到另一个地方",{"2":{"432":1}}],["一个或多个带有",{"2":{"459":1}}],["一个或多个模块",{"2":{"64":1}}],["一个默认网关",{"2":{"447":1}}],["一个子网掩码",{"2":{"447":1}}],["一个函数返回解析的",{"2":{"309":2}}],["一个结点作为子节点插入到另一节点时触发",{"2":{"229":1}}],["一个完整的垃圾回收任务拆分成很小的任务",{"2":{"185":1}}],["一旦在当前轮询阶段完成",{"2":{"827":1}}],["一旦轮询队列为空",{"2":{"824":1}}],["一旦绑定为",{"2":{"803":2}}],["一旦抛出错误",{"2":{"669":1}}],["一旦事件处理程序执行完成",{"2":{"221":1}}],["一旦垃圾回收算法执行时间过长",{"2":{"185":1}}],["一旦执行垃圾回收算法",{"2":{"184":1}}],["一经分配内存",{"2":{"178":1}}],["反转都能获取到值",{"2":{"865":1}}],["反向选择",{"2":{"838":1}}],["反码",{"0":{"293":1},"2":{"294":1}}],["反射型",{"0":{"70":1}}],["反馈问题排查",{"2":{"42":1}}],["三斜杠指令",{"2":{"854":1}}],["三元运算符",{"2":{"744":1}}],["三组随机数",{"2":{"560":1}}],["三类地址划分为若干子网",{"2":{"546":1}}],["三类地址包含的主机数量",{"2":{"429":1}}],["三次对话的确认机制",{"2":{"481":1}}],["三级标题名称",{"2":{"337":2}}],["三级标题",{"2":{"337":2}}],["三方库",{"2":{"299":1}}],["三个分支",{"2":{"257":1}}],["三个参数必须一样",{"2":{"218":1}}],["三个节点呈左右节点分布",{"2":{"8":1}}],["三个节点呈左节点形式",{"2":{"8":1}}],["三个节点呈右左节点分布",{"2":{"8":1}}],["三个节点呈右节点形式",{"2":{"8":1}}],["三种方法可以缓存",{"2":{"461":1}}],["三种状态",{"2":{"168":1}}],["三种类型",{"2":{"69":1,"156":1,"751":1}}],["质量维度",{"2":{"67":1}}],["复用",{"2":{"466":1}}],["复制失败",{"2":{"200":2,"201":2}}],["复制成功",{"2":{"200":2,"201":2}}],["复制的类型",{"2":{"198":1}}],["复制的文字",{"2":{"195":2}}],["复制",{"2":{"195":2}}],["复制到空闲区域",{"2":{"182":1}}],["复制到剪贴板",{"2":{"113":1}}],["复合事件",{"0":{"116":1,"228":1}}],["复杂选择",{"2":{"115":1}}],["复杂的位运算操作",{"0":{"5":1}}],["复盘",{"2":{"67":1}}],["交叉类型",{"2":{"863":2}}],["交集",{"2":{"863":2}}],["交还执行权",{"2":{"669":1}}],["交通枢纽",{"2":{"480":1}}],["交换机",{"0":{"464":1}}],["交换式以太网",{"2":{"463":1}}],["交互",{"2":{"67":1}}],["交并集",{"2":{"17":1}}],["预先确定所有变量和函数的位置",{"2":{"777":1}}],["预启动执行环境",{"2":{"423":1}}],["预加载",{"2":{"402":1}}],["预留给能够将连接改为隧道方式的代理服务器",{"2":{"459":1}}],["预留条数",{"2":{"191":2}}],["预留",{"2":{"190":2}}],["预期不再需要每个mutationrecord",{"2":{"162":1,"757":1}}],["预期功能",{"2":{"67":1}}],["预计工作量和分工排期",{"2":{"67":1}}],["预热",{"2":{"51":1}}],["查找到为止",{"2":{"848":1,"849":1}}],["查找作用域",{"0":{"773":1}}],["查找的目的是为了给变量赋值",{"2":{"770":1}}],["查询",{"2":{"770":2}}],["查询到作用域",{"2":{"769":1}}],["查询属性",{"2":{"149":2}}],["查询时间",{"2":{"50":1}}],["查看调用栈自行分析",{"2":{"66":1}}],["在类组件中获取",{"2":{"877":2}}],["在具体的",{"2":{"877":1}}],["在声明模块中添加模板",{"2":{"870":2}}],["在子类的静态方法使用",{"2":{"864":1}}],["在事件循环的接下来的",{"2":{"829":1}}],["在同一个阶段立即执行",{"2":{"829":1}}],["在当前操作完成后处理",{"2":{"828":1}}],["在执行上下文创建以后",{"2":{"786":1}}],["在严格模式中",{"2":{"777":1}}],["在引用对象",{"2":{"738":1}}],["在多线程不加锁的情况下",{"2":{"731":1}}],["在发生粘贴操作时触发",{"2":{"718":1}}],["在发生粘贴操作前触发",{"2":{"718":1}}],["在发生剪切操作时触发",{"2":{"718":1}}],["在发生剪切操作前触发",{"2":{"718":1}}],["在发生复制操作时触发",{"2":{"718":1}}],["在发生复制操作前触发",{"2":{"718":1}}],["在没有滚动条的情况下",{"2":{"718":2}}],["在静态方法中指向父类",{"2":{"670":1}}],["在普通方法中",{"2":{"670":1}}],["在它前面的元素的浮动",{"2":{"575":1}}],["在局部局域网上传输数据帧",{"2":{"477":1}}],["在数据传输中设置和维护计算机网络中两台计算机之间的通信连接",{"2":{"473":1}}],["在任何物理介质中允许两个或多个在传输系统中的终端之间传播信息的系统标准",{"2":{"469":1}}],["在页面转移到后台后",{"2":{"380":1}}],["在页面不可见的地方进行提前渲染",{"2":{"52":1}}],["在文本节点的值改变之后触发",{"2":{"229":1}}],["在节点从其父节点移除时触发",{"2":{"229":1}}],["在解释执行字节码的同时",{"2":{"174":1}}],["在解释型语言的解释过程中",{"2":{"170":1}}],["在编译阶段会进行性能优化",{"2":{"777":1}}],["在编译型语言的编译过程中",{"2":{"170":1}}],["在编译中作缓存变量处理",{"2":{"138":1}}],["在重绘一次中是不能完成动画过渡的",{"2":{"168":1}}],["在回调执行之后",{"2":{"162":1,"757":1}}],["在回调的微任务异步执行时",{"2":{"162":1,"757":1}}],["在模板处理之后",{"2":{"139":2}}],["在线支付",{"2":{"530":1}}],["在线协同",{"0":{"120":1}}],["在线文档如何缓存数据",{"2":{"126":1}}],["在线文档",{"2":{"110":1}}],["在向输入字段中插入新字符时触发",{"2":{"116":1}}],["在",{"2":{"116":2,"138":1,"252":1,"312":1,"316":2,"320":1,"396":1,"637":1,"804":1}}],["在到达选区起点位置之前跳过的",{"2":{"114":1}}],["在开发+调试模式下",{"2":{"66":1}}],["工厂模式",{"2":{"761":1}}],["工厂函数提供参数",{"2":{"303":1}}],["工作于应用层",{"2":{"465":1}}],["工作于",{"2":{"464":1}}],["工作过程",{"0":{"425":1,"449":1}}],["工作",{"0":{"317":1,"321":1}}],["工作区保持不变",{"2":{"263":1}}],["工作流要求高",{"2":{"65":1}}],["工具",{"2":{"59":1}}],["工具的熟悉程度",{"2":{"59":1}}],["体积小",{"2":{"173":1}}],["体积大",{"2":{"65":1}}],["体积代码量小",{"2":{"65":1}}],["单独使用",{"2":{"844":2}}],["单独使用无效",{"2":{"198":1}}],["单线程",{"0":{"731":1},"2":{"730":1}}],["单线程与多线程",{"2":{"725":1}}],["单后续的请求应仍使用原始的",{"2":{"525":1}}],["单尚未处理",{"2":{"509":1}}],["单个网段最大主机数",{"2":{"440":1}}],["单进程模式",{"2":{"354":1}}],["单精度",{"0":{"274":1}}],["单页应用",{"2":{"269":1}}],["单行",{"2":{"246":2}}],["单击鼠标右键调出上下文菜单",{"2":{"230":1}}],["单击鼠标按钮",{"2":{"226":1}}],["单包管理",{"2":{"65":1}}],["单元测试",{"0":{"26":1}}],["封装了",{"2":{"422":1}}],["封装",{"2":{"65":1,"837":1}}],["封装基础库",{"2":{"24":1}}],["异步任务触发条件达成",{"2":{"733":1}}],["异步",{"2":{"724":1,"730":1,"820":1}}],["异步应用",{"2":{"669":1}}],["异步脚本一定会在",{"2":{"312":1}}],["异步脚本",{"2":{"312":1}}],["异步操作",{"2":{"199":1}}],["异步回调和记录队列",{"0":{"162":1,"757":1}}],["异步加载模块",{"2":{"65":1}}],["异常的递归调用",{"2":{"55":1}}],["异常",{"0":{"769":1},"2":{"42":1,"770":1}}],["拆组件库",{"2":{"65":1}}],["拆公共库",{"2":{"65":1}}],["拆模块",{"2":{"65":1}}],["拆",{"2":{"65":1}}],["协调控制其他子进程",{"2":{"728":1}}],["协调图片解码",{"2":{"352":1}}],["协程",{"2":{"669":4}}],["协议中没有定义任何",{"2":{"501":1}}],["协议定义了扩展",{"2":{"489":1}}],["协议转换器",{"2":{"465":1}}],["协议需要针对不同的网络进行不同的设置",{"2":{"447":1}}],["协议氛围客户端服务器端",{"2":{"423":1}}],["协议",{"0":{"435":1,"478":1},"1":{"479":1,"480":1,"481":1,"482":1,"483":1},"2":{"271":1,"393":1,"475":1,"480":4,"481":3}}],["协商技术细节",{"2":{"64":1}}],["协作效率",{"2":{"61":1}}],["找对应的模块负责人进行风险评估以及代码",{"2":{"64":1}}],["需支持此配置",{"2":{"857":2}}],["需验证弹出网页浏览器界面",{"2":{"511":1}}],["需要iterator对象",{"2":{"664":1}}],["需要人工验证",{"2":{"568":1}}],["需要客户端进一步的操作才能完成请求",{"2":{"517":1}}],["需要很长时间才能完成请求",{"2":{"504":1}}],["需要继续等待服务器处理",{"2":{"501":1}}],["需要请求体",{"2":{"461":1}}],["需要配置",{"2":{"424":1}}],["需要在容器滚动时",{"2":{"188":1}}],["需要垃圾回收的对象",{"2":{"181":1}}],["需要强制引发回流",{"2":{"168":1}}],["需要与webpack源码配合起来",{"2":{"130":1}}],["需要认真的思考",{"2":{"22":1}}],["需求开发",{"2":{"64":1}}],["并集",{"2":{"838":1,"863":2}}],["并继续检查阶段以执行哪些被调度的脚本",{"2":{"824":1}}],["并到",{"2":{"819":1}}],["并有一定的规则来赋予这些标识符的访问权限",{"2":{"766":1}}],["并加上优先权标志",{"2":{"718":1}}],["并不是所有元素都支持innerhtml",{"2":{"717":1}}],["并不指向硬盘驱动器上的某个位置",{"2":{"317":1}}],["并得出信息摘要",{"2":{"565":1}}],["并生成随机数",{"2":{"559":1,"563":1}}],["并生成抽象语法树",{"2":{"170":1}}],["并接受",{"2":{"506":1}}],["并复用",{"2":{"488":1}}],["并把服务器端套接字的描述发送给客户端",{"2":{"487":1}}],["并将通过",{"2":{"503":1}}],["并将",{"2":{"422":1}}],["并将其合成",{"2":{"353":1}}],["并进行合成",{"2":{"367":1}}],["并先于",{"2":{"311":1}}],["并保存起来以供下次使用",{"2":{"174":1}}],["并清空队列本身",{"2":{"163":1,"758":1}}],["并且可以分配给每种类型",{"2":{"859":1}}],["并且可能在处理发生时被禁止",{"2":{"509":1}}],["并且执行一次",{"2":{"713":2}}],["并且溢出",{"2":{"583":2}}],["并且无法支持其对任何资源的请求",{"2":{"540":1}}],["并且应该使用单独的",{"2":{"521":1}}],["并且将来对此资源的引用都应该使用本响应应返回的若干个",{"2":{"519":1}}],["并且客户端应继续发送请求体",{"2":{"502":1}}],["并且生成新的提交记录",{"2":{"260":1}}],["并且支持运行",{"2":{"141":1}}],["并且实时监听编译模板",{"2":{"137":1}}],["并维护文档",{"2":{"64":1}}],["并要求掌握熟悉模块的细节",{"2":{"64":1}}],["并行计算的方式",{"2":{"53":1}}],["事件在这个阶段发出",{"2":{"826":1}}],["事件在某一个元素触发多少次",{"2":{"226":1}}],["事件队列",{"2":{"733":2}}],["事件触发线程管理一个任务队列",{"2":{"733":1}}],["事件触发线程",{"2":{"730":1}}],["事件循环中的单独阶段运行的特殊及时器",{"2":{"825":1}}],["事件循环将检查已达到阈值的计时器",{"2":{"824":1}}],["事件循环将循环访问回调队列并同步执行他们",{"2":{"824":1}}],["事件循环将循环访问回调队列并执行他们",{"2":{"819":1}}],["事件循环图",{"2":{"820":1}}],["事件循环",{"0":{"817":1},"1":{"818":1,"819":1,"820":1,"821":1,"822":1,"823":1,"824":1,"825":1,"826":1,"827":1,"828":1,"829":1,"830":1},"2":{"724":1}}],["事件名",{"2":{"712":1}}],["事件名处理的函数参数必须一致",{"2":{"218":1}}],["事件监听",{"2":{"669":1}}],["事件依然可行",{"2":{"654":1}}],["事件调度",{"2":{"351":1}}],["事件等",{"2":{"349":1,"350":1}}],["事件不一定之前还是之后",{"2":{"312":1}}],["事件之前执行",{"2":{"312":1}}],["事件执行",{"2":{"311":2}}],["事件是冒泡的",{"2":{"230":1}}],["事件是否冒泡",{"2":{"221":1}}],["事件的类型",{"2":{"222":1}}],["事件的目标",{"2":{"222":1}}],["事件处理等",{"2":{"729":1}}],["事件处理函数",{"2":{"712":1}}],["事件处理函数中",{"2":{"222":1}}],["事件处理程序会在全局作用域内执行",{"2":{"219":2}}],["事件处理程序名称和事件处理程序函数",{"2":{"219":1}}],["事件处理程序",{"0":{"215":1,"216":1,"219":1},"1":{"216":1,"217":1,"218":1,"219":1}}],["事件类型",{"2":{"221":1}}],["事件目标元素",{"2":{"221":1}}],["事件函数处理内部",{"2":{"221":1}}],["事件捕获",{"0":{"214":1}}],["事件开始时由最具体的元素",{"2":{"213":1}}],["事件冒泡",{"0":{"213":1}}],["事件流",{"0":{"212":1},"1":{"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1,"225":1,"226":1,"227":1,"228":1,"229":1,"230":1,"231":1,"232":1,"233":1,"234":1},"2":{"212":1}}],["事件流机制",{"2":{"139":1}}],["事件对象中",{"2":{"222":1,"718":1}}],["事件对象",{"0":{"220":1,"221":1,"222":1,"223":1},"1":{"221":1,"222":1,"224":1,"225":1,"226":1,"227":1,"228":1,"229":1,"230":1,"231":1,"232":1,"233":1,"234":1},"2":{"195":2}}],["事件中含有",{"2":{"195":2}}],["事件中有",{"2":{"168":1}}],["事件",{"0":{"231":1},"2":{"168":4,"195":4,"269":2,"270":1,"819":1,"824":1}}],["事件通信",{"2":{"63":1}}],["事件驱动",{"2":{"35":1}}],["明确每个模块负责的工作和提供的功能",{"2":{"63":1}}],["梳理各个模块的职责",{"2":{"63":1}}],["维护的整个过程",{"2":{"61":1}}],["贯穿项目设计",{"2":{"61":1}}],["提前知道元素的尺寸",{"2":{"661":1}}],["提高",{"2":{"546":1}}],["提高执行效率",{"2":{"174":1}}],["提示类",{"0":{"343":1}}],["提交表单",{"2":{"718":1}}],["提交表单或者上传文件",{"2":{"453":1}}],["提交记录",{"2":{"257":1}}],["提交代码过程",{"2":{"60":1}}],["提供插件相应的信息",{"2":{"857":2}}],["提供的大多数函数以及自己创建的函数都能通过",{"2":{"803":1}}],["提供一种优雅的方式来隐式传递一个对象的引用",{"2":{"796":1}}],["提供一个执行js环境",{"2":{"147":2}}],["提供参数",{"2":{"669":1}}],["提供值",{"2":{"668":1}}],["提供键值对集合",{"2":{"668":1}}],["提供为应用软件而设的接口",{"2":{"471":1}}],["提供与文档或者元素加载状态有关的信息",{"2":{"230":1}}],["提供给",{"2":{"198":1}}],["提出问题",{"2":{"168":1}}],["提测",{"2":{"67":1}}],["提升开发效率",{"2":{"61":1}}],["提升系统质量",{"2":{"61":1}}],["提升计算效率",{"2":{"53":1}}],["提升页面交互和渲染的流畅度",{"2":{"52":1}}],["提升浏览器渲染效率",{"2":{"52":1}}],["提升并发请求数量",{"2":{"50":1}}],["提升资源请求速度",{"2":{"50":1}}],["团队成员是否有倾向的框架",{"2":{"59":1}}],["团队成员对现有框架",{"2":{"59":1}}],["团队现有的技术栈",{"2":{"59":1}}],["团队技术栈",{"2":{"59":1}}],["团队规模",{"2":{"59":1}}],["多余属性检查",{"2":{"860":1}}],["多层",{"2":{"738":1}}],["多线程需要加锁",{"2":{"731":1}}],["多用于移动端",{"2":{"712":1}}],["多次加载只加载一次",{"0":{"681":1}}],["多次点击之后事件会重复监听",{"2":{"168":1}}],["多列容器",{"2":{"575":1}}],["多状态",{"2":{"515":1}}],["多播地址的最高位必须为",{"2":{"444":1}}],["多播地址",{"2":{"444":1}}],["多播组号",{"2":{"429":1}}],["多个参数",{"2":{"861":1}}],["多个文件可以使用",{"2":{"853":1}}],["多个exports导出时",{"2":{"672":2}}],["多个",{"2":{"348":1,"876":1}}],["多个异步脚本先后顺序不一致执行",{"2":{"312":1}}],["多个延迟脚本不一定会按照顺序执行",{"2":{"311":1}}],["多个延迟脚本按顺序执行",{"2":{"311":1}}],["多个导出",{"2":{"305":2,"306":2}}],["多个请求合并",{"2":{"50":1}}],["多少位补位规则",{"2":{"208":2}}],["多展示两条数据",{"2":{"191":2}}],["多监听改变",{"0":{"158":1,"753":1}}],["多包管理",{"2":{"65":1}}],["多人协作与团队规范",{"0":{"60":1}}],["多人协作",{"2":{"59":1}}],["功能",{"0":{"547":1},"1":{"548":1,"549":1}}],["功能交互",{"2":{"59":1}}],["功能模块",{"2":{"33":1}}],["搭建一个项目",{"2":{"58":1}}],["代价较大",{"2":{"725":1}}],["代价比较高",{"2":{"653":1}}],["代价有点大",{"2":{"132":1}}],["代表父类的构造函数",{"2":{"864":1}}],["代表请求已成功被服务器接收",{"2":{"506":1}}],["代表页面处于不可交互状态的耗时",{"2":{"56":1}}],["代理来保护连接",{"2":{"459":1}}],["代替",{"2":{"196":1,"592":2,"593":2,"718":1,"857":2,"859":1,"872":1}}],["代际假说",{"2":{"178":1}}],["代码空间",{"0":{"789":1},"2":{"788":1}}],["代码的词法进行静态分析",{"2":{"777":1}}],["代码编译阶段就决定好",{"2":{"771":1}}],["代码生成",{"2":{"766":1}}],["代码获取跨域请求的响应",{"2":{"405":1}}],["代码",{"2":{"147":2,"252":1,"814":1,"815":1}}],["代码示例如下",{"2":{"147":2}}],["代码不能运行",{"2":{"143":2}}],["代码引入到",{"2":{"106":1}}],["代码执行",{"0":{"79":1}}],["代码实现",{"0":{"76":1,"82":1,"86":1,"89":1,"92":1},"2":{"806":1}}],["代码可维护性",{"2":{"65":1}}],["代码复用",{"2":{"65":1}}],["代码复用划分",{"2":{"37":1}}],["代码按需引入",{"2":{"65":1}}],["代码规范调整",{"2":{"64":1}}],["代码量",{"2":{"62":1}}],["代码发布过程",{"2":{"60":1}}],["代码流程规范",{"2":{"60":1}}],["代码构建与编译工具",{"2":{"58":1}}],["代码分割",{"2":{"50":1}}],["总以为能得到满意的结果",{"2":{"324":1}}],["总位数",{"2":{"283":1}}],["总的数据条数",{"2":{"191":2}}],["总的滚动高度",{"2":{"190":2}}],["总数据条数",{"2":{"190":2}}],["总高度",{"2":{"188":2}}],["总结一句话",{"2":{"324":1}}],["总结",{"0":{"567":1,"770":1,"786":1},"2":{"168":1,"326":1,"461":1}}],["总是被优先调用",{"2":{"827":1}}],["总是",{"2":{"156":1,"751":1}}],["总阻塞时间",{"2":{"56":1}}],["总复杂度等于量级最大的那段代码的复杂度",{"2":{"1":1}}],["浏览器有一个单独的线程用于处理",{"2":{"730":1}}],["浏览器界面显示",{"2":{"728":1}}],["浏览器包含了哪些进程",{"0":{"727":1},"1":{"728":1,"729":1}}],["浏览器是多进程的",{"0":{"726":1},"2":{"726":1}}],["浏览器是否应该为当前的命令用户界面提供一个布尔值",{"2":{"112":2}}],["浏览器支持flex布局",{"2":{"651":1}}],["浏览器支持的加密方式有多少种",{"2":{"552":1}}],["浏览器使用相同的",{"2":{"566":1}}],["浏览器使用公钥加密数据",{"2":{"557":1}}],["浏览器获取数字证书中的公钥",{"2":{"563":1}}],["浏览器保存公钥",{"2":{"559":1}}],["浏览器发送加密套件列表",{"2":{"559":1,"563":1}}],["浏览器发送非对称加密套件列表",{"2":{"556":1}}],["浏览器发送对称加密套件列表和",{"2":{"553":1}}],["浏览器和服务器都拥有",{"2":{"560":1}}],["浏览器和服务器都有",{"2":{"554":1}}],["浏览器和服务器使用相同的方法对",{"2":{"554":1}}],["浏览器和服务器返回确认信息",{"2":{"553":1,"556":1}}],["浏览器中用于双向通信的一种",{"2":{"488":1}}],["浏览器中直接运行",{"2":{"301":1}}],["浏览器渲染",{"0":{"370":1},"1":{"371":1,"372":1,"373":1,"374":1,"375":1}}],["浏览器将",{"2":{"369":1}}],["浏览器进程",{"0":{"349":1},"2":{"348":1}}],["浏览器内核",{"0":{"730":1},"2":{"347":1,"729":1}}],["浏览器",{"0":{"673":1},"1":{"674":1,"675":1,"676":1,"677":1,"678":1,"679":1,"680":1,"681":1,"682":1,"683":1,"684":1},"2":{"347":2}}],["浏览器架构",{"0":{"347":1}}],["浏览器后退前进按钮会触发",{"2":{"269":1}}],["浏览器路由需要配合服务端配置",{"2":{"269":1}}],["浏览器路由",{"0":{"269":1}}],["浏览器暂未实现",{"2":{"268":2}}],["浏览器生成的事件",{"2":{"221":1}}],["浏览器用户界面",{"2":{"166":1}}],["浏览器工作原理",{"2":{"166":1}}],["浏览器利用自身的",{"2":{"106":1}}],["浏览器已经创建了",{"2":{"106":1}}],["浏览器端",{"2":{"105":1,"106":2}}],["浏览器开始渲染的时间",{"2":{"56":1}}],["浏览器缓存",{"2":{"50":1,"55":1}}],["性能",{"0":{"777":1}}],["性能指标",{"0":{"378":1},"1":{"379":1,"380":1,"381":1,"382":1,"383":1,"384":1,"385":1,"386":1,"387":1,"388":1,"389":1,"390":1,"391":1,"392":1}}],["性能分析",{"0":{"164":1,"759":1}}],["性能分析指标",{"2":{"48":1}}],["性能优化不是太多",{"2":{"657":1}}],["性能优化",{"2":{"64":1}}],["性能数据",{"0":{"56":1}}],["避免两个块元素之间的外边距合并问题",{"2":{"576":1}}],["避免服务端收到非法的",{"2":{"493":1}}],["避免某些资源重复",{"2":{"359":1}}],["避免耦合",{"2":{"63":1}}],["避免复杂",{"2":{"55":1}}],["避免全局变量的使用",{"2":{"55":1}}],["避免存在内存泄漏",{"2":{"55":1}}],["将下一个字符标记符",{"2":{"833":1}}],["将在适当的时候阻塞",{"2":{"824":1}}],["将变量和块作用域写在哪里决定的",{"2":{"771":1}}],["将这个函数的作用域赋给新对象",{"2":{"761":1}}],["将这些元素的",{"2":{"380":1}}],["将回调事件放到任务队列中",{"2":{"733":1}}],["将事件放入到",{"2":{"730":1}}],["将渲染进程得到的内存中的",{"2":{"728":1}}],["将所有表单域重置为默认值",{"2":{"718":1}}],["将给定属性设置为相应的值",{"2":{"718":1}}],["将凭据发送到同源url",{"2":{"683":1}}],["将最重要的字节放在前面",{"2":{"671":1}}],["将最不重要的字节排在前面",{"2":{"671":1}}],["将子网掩码二进制和",{"2":{"548":1}}],["将一个大的",{"2":{"547":1}}],["将来的可能的需求而预留",{"2":{"530":1}}],["将网络表头",{"2":{"475":1}}],["将要发送到其他",{"2":{"419":1}}],["将光栅化之后的图块生成",{"2":{"366":1}}],["将整个页面按照一定规则",{"2":{"362":1}}],["将绘制的产物数据提交给",{"2":{"361":1}}],["将合成结果上屏",{"2":{"353":1}}],["将框的基线与父框的基线对齐",{"2":{"326":1}}],["将自动编辑",{"2":{"321":1}}],["将上一步生成的",{"2":{"172":1}}],["将源码拆成一个个",{"2":{"172":1}}],["将会生成一个可执行的文件",{"2":{"170":1}}],["将突变回调的执行委托给一个微任务",{"2":{"164":1,"759":1}}],["将选区折叠到起点位置",{"2":{"114":1}}],["将选区折叠到终点位置",{"2":{"114":1}}],["将选区折叠到指定节点中的相应的文本偏移位置",{"2":{"114":1}}],["将指定的",{"2":{"114":1}}],["将各个模块统一交由框架处理",{"2":{"63":1}}],["将项目研发与发布流程进行优化",{"2":{"61":1}}],["将结果缓存",{"2":{"53":1}}],["将计算过程提前",{"2":{"53":1}}],["将",{"2":{"53":1,"326":1,"545":1,"766":1}}],["将页面可见",{"2":{"51":1}}],["将页面尽快展示给用户看",{"2":{"51":1}}],["逻辑操作符类似",{"2":{"737":1}}],["逻辑或操作符",{"2":{"736":1}}],["逻辑链路控制子层",{"2":{"476":1}}],["逻辑提速",{"0":{"53":1}}],["逻辑控制模块",{"2":{"33":1}}],["操作的设计机制",{"0":{"819":1}}],["操作的实例对象",{"2":{"198":1}}],["操作符",{"2":{"837":1}}],["操作符毫无意义",{"2":{"761":1}}],["操作符来确定对象类型",{"2":{"761":1}}],["操作符共用",{"2":{"737":1}}],["操作剪贴板",{"2":{"718":1}}],["操作系统内置根证书",{"2":{"568":1}}],["操作范围",{"0":{"115":1}}],["操作富文本",{"0":{"113":1}}],["操作",{"0":{"716":1},"2":{"52":1,"113":1,"115":1,"312":1,"655":1,"715":1}}],["合成",{"2":{"361":1,"362":1,"363":1,"365":1,"366":1}}],["合成线程",{"0":{"352":1},"2":{"350":1}}],["合入主干过程",{"2":{"60":1}}],["合理使用缓存",{"2":{"55":1}}],["合理地使用",{"2":{"50":1}}],["合并",{"2":{"52":1,"853":1}}],["空类型",{"2":{"859":1}}],["空的非委托的对象",{"2":{"808":1}}],["空的块级元素",{"2":{"583":1}}],["空值合并操作符",{"2":{"735":1}}],["空格",{"0":{"612":1},"2":{"815":1}}],["空闲区域=对象区域",{"2":{"182":1}}],["空闲区域",{"2":{"182":1}}],["空闲时间将用户可能需要用到的资源进行获取并加载",{"2":{"52":1}}],["空间大小随着元素的显隐",{"2":{"655":1}}],["空间大小依然占据",{"2":{"654":1}}],["空间大",{"2":{"183":1}}],["空间角度",{"0":{"54":1},"1":{"55":1}}],["空间复杂度",{"0":{"2":1}}],["通知时间触发线程",{"2":{"730":1}}],["通知事件触发线程",{"2":{"730":1}}],["通知浏览器端",{"2":{"106":2}}],["通知浏览器更新页面",{"2":{"100":1}}],["通常是",{"2":{"718":1}}],["通常与伪元素搭配使用",{"2":{"641":1}}],["通常用于",{"2":{"459":1}}],["通过导入或全局变量访问库",{"2":{"844":1}}],["通过词法作用域可以预测代码在执行过程中如何查找变量",{"2":{"771":1}}],["通过作用域来查找变量的链条称为作用域链",{"2":{"770":1}}],["通过设置这个属性可以改变元素的滚动位置",{"2":{"718":2}}],["通过子网掩码将",{"2":{"546":1}}],["通过",{"2":{"357":1,"876":1}}],["通过实时滚动监听来对开始位置",{"2":{"189":1}}],["通过将",{"2":{"114":1}}],["通过将浏览帧率保持在",{"2":{"52":1}}],["通过自动化的方式",{"2":{"61":1}}],["通过项目设计和架构优化",{"2":{"61":1}}],["通过使用数据结构享元的方式",{"2":{"55":1}}],["通过合理使用浏览器",{"2":{"52":1}}],["通过预览的方式提前给用户观看",{"2":{"51":1}}],["通用组件",{"2":{"23":1}}],["差异化服务",{"2":{"51":1,"65":1}}],["技术之路也还很漫长",{"2":{"324":1}}],["技术优化",{"2":{"64":1}}],["技术选型的影响因素",{"0":{"59":1}}],["技术方案设计与选型",{"0":{"58":1},"1":{"59":1,"60":1}}],["技术",{"2":{"50":1,"53":1,"546":1}}],["技术框架",{"2":{"23":1}}],["后被排列在队列中",{"2":{"825":1}}],["后进先出",{"2":{"785":1}}],["后退",{"2":{"728":1}}],["后退一页",{"2":{"268":2}}],["后行断言",{"2":{"666":3}}],["后续请求应使用指定的代理",{"2":{"524":1}}],["后续遍历",{"2":{"21":1}}],["后",{"2":{"429":1}}],["后面是主机号",{"2":{"429":1}}],["后面的字符串",{"2":{"232":1}}],["后接",{"2":{"271":1}}],["后代选择器",{"2":{"612":1}}],["后代元素不会触发",{"2":{"226":1}}],["后代子元素不会触发",{"2":{"226":1}}],["后台编译器",{"2":{"174":1}}],["后台缓存",{"2":{"50":1}}],["缓存返回的",{"2":{"480":1}}],["缓存优化",{"2":{"147":1}}],["缓存",{"2":{"50":4,"461":1,"480":1}}],["使子元素自动成为flex盒子",{"2":{"651":1}}],["使用回调函数",{"2":{"877":2}}],["使用会出现多种不同的合并",{"2":{"874":1}}],["使用联合类型",{"2":{"872":1}}],["使用类泛型",{"2":{"866":1}}],["使用参数泛型类型的约束条件",{"2":{"866":1}}],["使用最广泛",{"2":{"761":1}}],["使用的时候",{"2":{"729":1}}],["使用双冒号",{"2":{"632":1}}],["使用其自有的私钥对信息摘要进行加密",{"2":{"565":1}}],["使用三组随机数生成对称密钥",{"2":{"560":1}}],["使用公钥加密",{"2":{"559":1,"563":1}}],["使用交换机",{"2":{"463":1}}],["使用分号空格",{"2":{"395":2}}],["使用注释规则",{"0":{"244":1}}],["使用插件配置规则配置如下",{"2":{"242":2}}],["使用location",{"2":{"232":1}}],["使用异步",{"2":{"198":1}}],["使用场景",{"2":{"168":1}}],["使用takerecords",{"2":{"163":1,"758":1}}],["使用到的compiler",{"2":{"136":1}}],["使用到的",{"0":{"136":1},"1":{"137":1,"138":1,"139":1}}],["使用模块解耦的技术方案",{"2":{"63":1}}],["使用开源",{"2":{"59":1}}],["使用更优的算法或数据结构",{"2":{"53":1}}],["使用更高运行效率的方式",{"2":{"53":1}}],["使用离屏渲染",{"2":{"52":1}}],["使用资源预加载",{"2":{"52":1}}],["使用秒看技术",{"2":{"51":1}}],["使用服务端渲染",{"2":{"51":1}}],["使用",{"0":{"188":1,"247":1},"2":{"50":1,"99":1,"329":1,"359":1,"554":1,"565":1,"575":1,"590":1,"592":2,"593":2,"658":1,"770":1,"804":1,"837":1,"842":1,"857":2,"865":1,"872":2,"877":1}}],["使用浏览器",{"2":{"50":1}}],["使系统更具模块化",{"2":{"35":1}}],["脚本仍具有运行完成的能力",{"2":{"828":1}}],["脚本使用",{"2":{"825":1}}],["脚本程序",{"2":{"730":1}}],["脚本执行",{"2":{"729":1}}],["脚本执行需要停顿",{"2":{"184":1}}],["脚本执行耗时",{"2":{"48":1}}],["脚本编写",{"2":{"24":1}}],["渲染完毕后",{"2":{"733":1}}],["渲染线程与",{"0":{"732":1}}],["渲染线程互斥",{"2":{"730":1}}],["渲染阻塞",{"2":{"381":1}}],["渲染进程",{"0":{"350":1,"730":1},"1":{"351":1,"352":1},"2":{"348":1,"356":1,"357":1,"358":1,"359":1,"360":1,"361":1,"362":1,"363":1,"364":1,"365":1,"366":1,"729":1,"730":1}}],["渲染引擎",{"2":{"347":1}}],["渲染流水线",{"0":{"346":1,"355":1},"1":{"347":1,"348":1,"349":1,"350":1,"351":1,"352":1,"353":1,"354":1,"355":1,"356":2,"357":2,"358":2,"359":2,"360":2,"361":2,"362":2,"363":2,"364":2,"365":2,"366":2,"367":2,"368":2}}],["渲染数据必须在可视区域内",{"2":{"191":1}}],["渲染数据",{"2":{"190":2,"191":2}}],["渲染",{"2":{"52":1}}],["渲染过程优化",{"0":{"52":1}}],["渲染耗时",{"2":{"48":1}}],["渲染层",{"2":{"33":1}}],["加至数据包",{"2":{"475":1}}],["加至数据以形成数据包",{"2":{"474":1}}],["加密信道建立",{"2":{"570":1}}],["加密后的密文就是数字签名",{"2":{"565":1}}],["加密方式",{"0":{"563":1}}],["加密数据",{"0":{"557":1,"560":1}}],["加密传输数据",{"2":{"554":1}}],["加密套件列表",{"2":{"552":1}}],["加密层",{"0":{"552":1},"1":{"553":1,"554":1,"555":1,"556":1,"557":1,"558":1,"559":1,"560":1,"561":1,"562":1,"563":1,"564":1,"565":1,"566":1,"567":1,"568":1}}],["加密",{"2":{"466":1}}],["加密服务器的链接",{"2":{"459":1}}],["加进位",{"2":{"294":2}}],["加上",{"2":{"266":1,"326":1}}],["加上总高度",{"2":{"188":2}}],["加速计支持",{"2":{"233":2}}],["加入crossorigin",{"2":{"683":1}}],["加入边框",{"2":{"650":1}}],["加入模板文件入口",{"2":{"143":2}}],["加入",{"2":{"139":1}}],["加入入口文件",{"2":{"137":1}}],["加入到编译当中",{"2":{"137":1}}],["加入缓存处理",{"2":{"132":1}}],["加粗文字",{"2":{"113":1,"342":1}}],["加载顺序默认为",{"0":{"678":1}}],["加载作为根文件系统的",{"2":{"423":1}}],["加载内核",{"2":{"423":1}}],["加载流程优化",{"2":{"65":1}}],["加载耗时",{"2":{"48":1}}],["加法法则",{"2":{"1":1}}],["新对象会绑定到函数调用的",{"2":{"804":1}}],["新对象会被执行",{"2":{"804":1}}],["新增方法",{"2":{"666":1}}],["新文件",{"2":{"321":1}}],["新状态的标题",{"2":{"268":2}}],["新加入的对象会加入对象区域",{"2":{"182":1}}],["新生区区间划分为两个区域",{"2":{"182":1}}],["新生代的空间一般不会设置得太大",{"2":{"182":1}}],["新生代",{"0":{"179":1}}],["新技术的接受程度",{"2":{"59":1}}],["新旧版本的转化率是否一致",{"2":{"47":1}}],["新版本是否所有功都能正常访问",{"2":{"47":1}}],["灰度占比是否正常",{"2":{"47":1}}],["分隔",{"2":{"835":2}}],["分隔四个部分",{"2":{"429":1}}],["分析调用栈",{"2":{"799":1}}],["分析首屏",{"2":{"65":1}}],["分别为一级标题",{"2":{"688":1}}],["分配一个",{"2":{"425":1}}],["分成多个独立的图层",{"2":{"362":1}}],["分支了",{"2":{"257":1}}],["分支",{"2":{"255":1}}],["分支提交过程",{"2":{"60":1}}],["分页媒体访问网页时的表现设置",{"2":{"622":1}}],["分页之后",{"2":{"188":2}}],["分页",{"2":{"187":1}}],["分词",{"2":{"172":1,"766":1}}],["分步骤",{"2":{"65":1}}],["分流程",{"2":{"65":1}}],["分",{"2":{"65":1}}],["分屏加载",{"2":{"51":1}}],["分版本监控观察",{"2":{"47":1}}],["分环境执行",{"2":{"24":1}}],["全面解析",{"0":{"798":1},"1":{"799":1,"800":1,"801":1,"802":1,"803":1,"804":1,"805":1,"806":1,"807":1,"808":1,"809":1,"810":1,"811":1}}],["全体选择器",{"2":{"611":1}}],["全",{"2":{"446":1}}],["全局模板",{"0":{"871":1}}],["全局名称空间污染",{"2":{"853":1}}],["全局引用不能和import一起",{"2":{"844":2}}],["全局引用文件内不能包含",{"2":{"844":1}}],["全局作用域",{"0":{"778":1}}],["全局环境作用域",{"2":{"773":1}}],["全局绑定事件",{"2":{"195":2}}],["全局执行上下文",{"2":{"176":1}}],["全停顿算法",{"2":{"185":1}}],["全停顿",{"0":{"184":1}}],["全版本监控观察",{"2":{"47":1}}],["全方位串联起来",{"2":{"22":1}}],["可加",{"2":{"860":2}}],["可索引属性",{"2":{"860":1}}],["可执行命令",{"2":{"832":1}}],["可行",{"2":{"797":2,"801":2}}],["可见的",{"2":{"718":2}}],["可影响可替换元素的位置",{"2":{"637":1}}],["可替换元素",{"0":{"636":1},"1":{"637":1,"638":1,"639":1,"640":1,"641":1,"642":1}}],["可靠的",{"2":{"481":1}}],["可能要检查整个dom的元素",{"2":{"658":1}}],["可能会在内容的上方和下方重叠",{"2":{"578":1}}],["可能会创建新的资源或者修改资源",{"2":{"453":1}}],["可能后退也可能前进",{"2":{"268":1}}],["可事实终究残酷无情",{"2":{"324":1}}],["可选的全局语法",{"2":{"870":1}}],["可选默认参数",{"2":{"861":1}}],["可选属性",{"2":{"860":1}}],["可选参数或者属性",{"2":{"837":1}}],["可选链式操作符",{"0":{"738":1},"1":{"739":1,"740":1,"741":1,"742":1,"743":1}}],["可选",{"2":{"303":2}}],["可配置值",{"2":{"240":1}}],["可测试性要求高",{"2":{"65":1}}],["可由多个负责人共同维护",{"2":{"64":1}}],["可用于下一次的页面快速渲染",{"2":{"51":1}}],["可交互时间提前",{"2":{"51":1}}],["可通过报错内容找到报错位置修复",{"2":{"47":1}}],["可以嵌套",{"2":{"874":1}}],["可以直接定义获取到值",{"2":{"865":1}}],["可以包含代码和声明",{"2":{"853":1}}],["可以合并",{"2":{"852":1}}],["可以配置别名映射到目录",{"2":{"857":2}}],["可以配置writetodisk",{"2":{"104":1}}],["可以配合使用",{"2":{"853":1}}],["可以配合其他包声明文件扩展",{"2":{"852":1}}],["可以配合映射类型使用",{"2":{"837":1}}],["可以实现和硬绑定相同的效果",{"2":{"810":1}}],["可以实现水平垂直居中",{"2":{"590":1}}],["可以实现水平居中",{"2":{"590":1}}],["可以创建一个",{"2":{"808":1}}],["可以执行字符串代码",{"2":{"775":1}}],["可以通过",{"2":{"763":1}}],["可以传参数",{"2":{"762":1}}],["可以转为",{"2":{"667":1}}],["可以减少检查元素的个数",{"2":{"658":1}}],["可以将其视为段落的上下文",{"2":{"577":1}}],["可以理解",{"2":{"493":1}}],["可以代表本机",{"2":{"446":1}}],["可以发送广播包",{"2":{"433":1}}],["可以接收来自各个地方的包",{"2":{"429":1}}],["可以对子网进行层次化编址",{"2":{"550":1}}],["可以对外",{"2":{"429":1}}],["可以对文档进行操作",{"2":{"195":2}}],["可以连接服务端",{"2":{"423":1}}],["可以访问数据",{"2":{"321":1}}],["可以指向整个目录或链接到远程计算机上的文件",{"2":{"316":1}}],["可以视为快捷方式",{"2":{"316":1}}],["可以精确表示从",{"2":{"282":1}}],["可以简写",{"2":{"242":1}}],["可以操作对象",{"2":{"230":1}}],["可以作为文本或二进制数据读取",{"2":{"206":1}}],["可以使用此类型用作绑定",{"2":{"838":1}}],["可以使用交叉类型实现",{"2":{"837":1}}],["可以使用严格模式",{"2":{"661":1}}],["可以使用伪元素清除容器的浮动",{"2":{"602":1}}],["可以使用",{"2":{"196":1,"268":1,"841":1,"857":2,"877":2}}],["可以确保避免事件的同步性和随事件而来的混乱",{"2":{"164":1,"759":1}}],["可以监听多个元素",{"2":{"158":2,"753":2}}],["可以异步执行回调监听",{"2":{"151":1,"746":1}}],["可以自行参考",{"2":{"147":1}}],["可以自行参考源码",{"2":{"145":2}}],["可以有不同的配置",{"2":{"141":1}}],["可以根据系统架构将应用进行模块和层级的划分",{"2":{"33":1}}],["可以结合业务进行细分和组件拆分",{"2":{"33":1}}],["可以采用类似mvc结构进行拆分",{"2":{"33":1}}],["定时器",{"0":{"821":1}}],["定时器运行",{"2":{"819":1}}],["定时任务并不是由",{"2":{"730":1}}],["定时触发器线程",{"2":{"730":1}}],["定义枚举值",{"2":{"865":1}}],["定义一个函数",{"2":{"863":2}}],["定义文件引用",{"2":{"857":2}}],["定义文件目录",{"2":{"857":2}}],["定义的控制字符集",{"2":{"812":1}}],["定义内容策略",{"2":{"701":1}}],["定义字体",{"2":{"625":1}}],["定义动画帧",{"2":{"624":1}}],["定义列表项的表现",{"2":{"623":1}}],["定义请求数据格式",{"2":{"482":1}}],["定义数据格式并按照对应的格式解读数据",{"2":{"482":1}}],["定义了端口",{"2":{"481":1}}],["定义端口",{"2":{"481":1}}],["定义网络地址",{"2":{"480":1}}],["定义",{"0":{"316":1,"320":1,"637":1,"813":1},"2":{"405":1,"545":1,"696":1,"857":2}}],["定义全局变量指定变量选项",{"2":{"241":1}}],["定量上报",{"2":{"46":1}}],["定期",{"2":{"46":1}}],["类泛型只能作用实例化对象",{"2":{"866":3}}],["类泛型",{"2":{"866":1}}],["类名以及子类访问",{"2":{"864":1}}],["类可以作为接口",{"2":{"864":1}}],["类可以",{"2":{"860":1}}],["类类型",{"2":{"860":1}}],["类选择器",{"0":{"607":1}}],["类为特殊地址",{"2":{"439":1}}],["类地址",{"0":{"441":1,"442":1,"443":1,"444":1,"445":1},"2":{"429":1}}],["类别",{"2":{"429":2,"440":1,"548":1}}],["类",{"2":{"429":6,"439":3,"446":1,"864":1}}],["类的时候",{"2":{"168":2}}],["类似这种形式",{"2":{"429":1}}],["类似",{"2":{"110":1,"626":1,"837":1}}],["类似实现用法",{"0":{"77":1,"80":1,"83":1,"87":1,"90":1,"93":1}}],["类型文件",{"2":{"867":1}}],["类型是每种类型的子类型",{"2":{"859":1}}],["类型中的",{"2":{"838":1}}],["类型中存在",{"2":{"838":1}}],["类型中存在的",{"2":{"838":1}}],["类型中需要存在的",{"2":{"838":1}}],["类型存在",{"2":{"838":1}}],["类型别名",{"2":{"837":1}}],["类型断言",{"2":{"837":1,"859":1}}],["类型的文本数据",{"2":{"206":1}}],["类型的数据",{"2":{"200":1}}],["类型",{"0":{"69":1,"714":1},"1":{"70":1,"71":1,"72":1,"715":1,"716":1,"717":1,"718":1},"2":{"201":1,"203":1,"206":1,"221":1,"222":1,"283":1,"433":1,"568":3,"837":1,"872":1}}],["类方法劫持",{"2":{"45":1}}],["类装饰器",{"2":{"45":1}}],["框架带有自身的生命周期",{"2":{"43":1}}],["框架选择",{"2":{"24":1}}],["监视当前分配给该多宿主设备上的接口的所有",{"2":{"497":1}}],["监听路由",{"2":{"270":1}}],["监听目标节点的子节点的变化",{"2":{"160":1,"755":1}}],["监听节点的字符数据改变",{"2":{"160":1,"755":1}}],["监听",{"2":{"158":2,"168":2,"753":2}}],["监听范围",{"2":{"151":1,"746":1}}],["监听文件编译",{"2":{"858":1}}],["监听文件编译完成",{"2":{"106":1}}],["监听文件变化以及编译",{"2":{"103":1}}],["监听入口文件的变化",{"2":{"104":1}}],["监听编译代码",{"2":{"100":1}}],["监听事件",{"2":{"43":1}}],["监控内容",{"0":{"41":1}}],["监控源码变更",{"2":{"24":1}}],["系统内部使用",{"2":{"823":1}}],["系统会读取",{"2":{"733":1}}],["系统",{"2":{"423":1}}],["系统中",{"2":{"316":2,"320":1}}],["系统生命周期",{"0":{"43":1}}],["系统稳定性",{"2":{"42":1}}],["系统异常",{"0":{"44":1},"2":{"42":2}}],["系统的生命周期数据",{"2":{"42":1}}],["用在静态方法中",{"2":{"670":1}}],["用在构造函数之中",{"2":{"670":1}}],["用在对预请求的响应中",{"2":{"409":1}}],["用来控制事件循环",{"2":{"730":1}}],["用来设置文字行之间的间距",{"2":{"629":1}}],["用来处理在视觉媒体上显示文档时使用的计算规则",{"2":{"587":1}}],["用来在最终的",{"2":{"505":1}}],["用",{"2":{"446":1}}],["用于控制视频文本终端上的的光标位置",{"2":{"813":1}}],["用于确定在何处以及如何查找变量",{"2":{"770":1}}],["用于确认网络设备位置的地址",{"2":{"467":1}}],["用于发送请求和接收响应的窗口名称",{"2":{"718":1}}],["用于发起一个预请求",{"2":{"413":1,"414":1}}],["用于引入一个",{"2":{"620":1}}],["用于屏蔽",{"2":{"547":1}}],["用于与最终用户使用的同一台机器或计算机建立",{"2":{"499":1}}],["用于指定无效",{"2":{"496":1}}],["用于电",{"2":{"464":1}}],["用于测试或诊断",{"2":{"457":1}}],["用于回路测试",{"2":{"446":1}}],["用于",{"2":{"354":1,"401":1,"729":1,"838":1}}],["用于处理ime的输入序列",{"2":{"228":1}}],["用法类似",{"2":{"339":1}}],["用法",{"0":{"153":1,"748":1}}],["用户指定类型",{"2":{"837":1}}],["用户交互",{"2":{"728":1}}],["用户没有必要的凭据",{"2":{"529":1}}],["用户或浏览器自行选择一个首选的地址进行重定向",{"2":{"518":1}}],["用户按下任意键触发",{"2":{"227":1}}],["用户选择input或者textarea字符时触发",{"2":{"224":1}}],["用户停止下载过程时",{"2":{"224":1}}],["用户的体验累积",{"2":{"129":1}}],["用户主动提交",{"2":{"46":1}}],["用户日志",{"0":{"45":1},"2":{"42":1}}],["用户行为数据",{"2":{"42":1}}],["用户操作行为",{"2":{"41":1}}],["用例维护",{"2":{"23":1}}],["视口",{"2":{"701":1}}],["视口中x",{"2":{"226":1}}],["视图",{"2":{"671":2}}],["视图模块",{"2":{"33":1}}],["视觉格式化模型",{"0":{"587":1}}],["视觉和交互划分",{"2":{"37":1}}],["etc",{"2":{"820":1}}],["eth0",{"2":{"429":1}}],["eth1sudo",{"2":{"421":1}}],["eth1",{"2":{"421":5}}],["equiv",{"2":{"701":2}}],["eqeqeq",{"2":{"244":2,"245":2}}],["e914",{"2":{"494":1}}],["early",{"0":{"505":1}}],["ea9d",{"2":{"428":2}}],["ease",{"2":{"167":4,"862":8}}],["effects",{"0":{"840":1},"2":{"660":1}}],["effect",{"2":{"359":1}}],["efdd",{"2":{"208":2}}],["efd",{"2":{"208":4}}],["email",{"2":{"832":2}}],["embed",{"2":{"638":1}}],["empty",{"2":{"635":1}}],["em",{"2":{"630":1}}],["emoji",{"2":{"345":6}}],["emit",{"0":{"139":1},"2":{"131":2,"132":1,"139":1,"145":4}}],["emitter",{"2":{"35":1,"63":1}}],["econnrefused",{"2":{"822":1}}],["ecs公网ip",{"2":{"333":2}}],["ecmascript",{"2":{"763":1,"806":2}}],["ecmafeatures",{"2":{"237":1}}],["ecmaversion",{"2":{"237":1}}],["e2big",{"0":{"328":1},"1":{"329":1,"330":1},"2":{"328":2,"329":1}}],["either",{"2":{"326":2}}],["e7",{"2":{"289":1,"428":4}}],["edgehtml",{"2":{"347":1}}],["edge",{"2":{"326":4,"347":2,"674":1}}],["edge12+",{"2":{"196":1}}],["edit",{"2":{"256":2,"259":2}}],["es5",{"2":{"857":2}}],["es3",{"2":{"857":2}}],["es",{"2":{"853":1}}],["esnext",{"2":{"839":1}}],["esc",{"2":{"814":2,"815":2}}],["escape",{"0":{"705":1,"812":1},"1":{"813":1,"814":1,"815":1},"2":{"703":1}}],["esmoduleinterop",{"2":{"870":2,"871":1}}],["esm",{"0":{"306":1},"2":{"300":1}}],["es2015",{"2":{"839":1,"857":4}}],["es2017",{"2":{"240":1}}],["es2020",{"2":{"240":1}}],["es6",{"0":{"662":1,"672":1,"811":1},"1":{"663":1,"664":1,"665":1,"666":1,"667":1,"668":1,"669":1,"670":1,"671":1,"672":1},"2":{"240":1,"672":5,"857":4,"868":1}}],["esprima",{"2":{"238":1}}],["eslintcache",{"2":{"253":2}}],["eslintignore",{"2":{"252":1,"253":2}}],["eslintrc",{"2":{"236":1,"250":1,"253":6}}],["eslint优化完善项目代码",{"2":{"235":1}}],["eslint",{"0":{"235":1,"248":1},"1":{"236":1,"237":1,"238":1,"239":1,"240":1,"241":1,"242":1,"243":1,"244":1,"245":1,"246":1,"247":1,"248":1,"249":1,"250":1,"251":1,"252":1,"253":1},"2":{"60":1,"238":2,"242":6,"244":2,"246":14,"251":2,"252":1,"253":2}}],["eeffdd",{"2":{"208":2}}],["elastic",{"0":{"332":1},"1":{"333":1}}],["else",{"2":{"168":4,"210":2,"211":2,"718":2}}],["elements",{"2":{"188":4,"718":1}}],["element",{"2":{"151":1,"221":2,"222":1,"636":2,"715":4,"717":1,"718":4,"746":1}}],["e",{"0":{"445":1},"2":{"168":4,"195":10,"294":1,"429":1,"439":1,"446":1,"659":1,"815":1}}],["ev",{"2":{"568":2}}],["eval",{"0":{"775":1},"2":{"147":4,"774":1,"775":3,"777":3}}],["eventutil",{"2":{"718":2}}],["eventtarget",{"2":{"715":6}}],["event包含两个属性",{"2":{"232":1}}],["event对象上有个persist属性",{"2":{"231":1}}],["eventphase",{"2":{"221":1}}],["events",{"2":{"106":4}}],["event",{"0":{"724":1,"733":1},"1":{"725":1,"726":1,"727":1,"728":1,"729":1,"730":1,"731":1,"732":1,"733":1},"2":{"35":1,"63":1,"195":2,"221":2,"222":4,"226":1,"227":3,"230":4,"234":1,"351":1,"419":12,"712":1,"718":10}}],["enums",{"2":{"865":1}}],["enum",{"0":{"865":1},"2":{"859":3,"865":4}}],["enumerable",{"2":{"762":1}}],["enctype",{"2":{"718":2}}],["encodeuricomponent",{"0":{"708":1}}],["encodeuri",{"0":{"706":1}}],["enable",{"2":{"857":2}}],["enabled",{"2":{"635":1}}],["enabling",{"2":{"253":2}}],["en2",{"2":{"428":4}}],["en1",{"2":{"428":4}}],["en0",{"2":{"428":4}}],["engine",{"2":{"347":2}}],["env",{"0":{"240":1},"2":{"253":4,"330":1,"832":1}}],["environments",{"2":{"253":2}}],["environment",{"2":{"236":1,"253":2,"423":1}}],["enterraf",{"2":{"168":2}}],["enter",{"2":{"168":19}}],["entries",{"2":{"143":6,"668":2}}],["entrylist",{"2":{"380":4}}],["entry",{"2":{"106":1,"144":2,"380":6}}],["en",{"2":{"131":2,"146":2,"147":4}}],["endian",{"0":{"281":1},"2":{"671":2}}],["end",{"0":{"594":1},"2":{"129":1,"167":1,"168":4,"188":2,"190":2,"191":2,"192":1,"271":1,"598":1,"651":1}}],["excludedunion",{"2":{"838":2}}],["exclude",{"2":{"832":1,"838":1,"857":4}}],["excess",{"2":{"860":1}}],["excecommand",{"2":{"194":1}}],["excel",{"2":{"110":1}}],["execute",{"2":{"682":2}}],["execution",{"2":{"253":2,"423":1}}],["exec",{"0":{"666":1},"2":{"256":4,"666":13}}],["execcommand",{"0":{"194":1},"1":{"195":1},"2":{"112":2,"113":1,"114":1,"195":2,"196":1}}],["exit",{"2":{"253":2}}],["extract",{"2":{"838":1}}],["extensions",{"2":{"253":2}}],["extending",{"2":{"860":1}}],["extends",{"0":{"251":1},"2":{"837":1,"857":2,"860":1,"864":3,"866":4,"876":4}}],["extend",{"2":{"114":1}}],["ext",{"2":{"253":2}}],["ex",{"2":{"147":4}}],["expose",{"0":{"411":1}}],["export",{"2":{"306":6,"672":6,"675":2,"839":1,"843":4,"844":5,"852":10,"854":2,"870":6,"874":4}}],["exports",{"2":{"134":2,"144":6,"147":2,"303":5,"305":2,"672":30,"840":1,"854":6}}],["expires=",{"2":{"399":2}}],["expires",{"0":{"399":1}}],["expired",{"2":{"98":2}}],["explorer",{"2":{"347":1}}],["express",{"2":{"99":1,"101":1,"102":2,"104":5,"107":1,"871":2}}],["err",{"2":{"102":2,"104":2,"143":4}}],["errors",{"2":{"253":6}}],["error",{"0":{"539":1},"2":{"44":1,"104":2,"143":2,"224":1,"243":1,"244":2,"245":2,"253":2,"328":3,"633":2,"844":2}}],["的共有属性",{"2":{"863":2}}],["的指向",{"2":{"861":1}}],["的集合当中",{"2":{"838":1}}],["的调度回调函数",{"2":{"821":1}}],["的调用位置无关",{"2":{"801":1}}],["的最大调用堆栈大小",{"2":{"820":1}}],["的最优分层",{"2":{"352":1}}],["的回调将在事件循环继续之前解析",{"2":{"820":1}}],["的错误处理延迟到这里执行",{"2":{"819":1}}],["的能力",{"2":{"810":1}}],["的引用",{"2":{"802":2}}],["的绑定",{"2":{"838":1}}],["的绑定对象",{"2":{"800":1}}],["的绑定和函数声明的位置没有任何关系",{"2":{"796":1}}],["的存储结构",{"0":{"781":1},"1":{"782":1,"783":1,"784":1,"785":1,"786":1,"787":1,"788":1,"789":1,"790":1,"791":1,"792":1,"793":1,"794":1,"795":1}}],["的存储空间",{"2":{"179":1}}],["的一系列查询",{"2":{"766":1}}],["的实现",{"2":{"764":1}}],["的属性为",{"2":{"738":1}}],["的元素版",{"2":{"717":4}}],["的元素不产生外边距重叠问题",{"2":{"582":1}}],["的个数",{"2":{"717":1}}],["的视图实例",{"2":{"671":1}}],["的返回值",{"2":{"669":2}}],["的任何地方",{"2":{"641":1}}],["的行为与最外层的文档非常相似",{"2":{"575":1}}],["的信息",{"2":{"564":1}}],["的信息被捕获到一个mutationrecord中",{"2":{"161":1,"756":1}}],["的握手通道",{"2":{"488":1}}],["的四层架构模型",{"2":{"478":1}}],["的第一个",{"2":{"446":1}}],["的第一个参数状态对象",{"2":{"268":1}}],["的地址",{"2":{"446":1}}],["的头",{"2":{"433":3}}],["的增强版",{"2":{"422":1}}],["的数据",{"2":{"419":1}}],["的数据已经准备好",{"2":{"365":1}}],["的时间",{"2":{"819":1,"824":1}}],["的时间格式",{"2":{"399":1}}],["的时间点",{"2":{"67":1}}],["的匹配下才可携带",{"2":{"396":1}}],["的使用",{"2":{"376":1}}],["的过程",{"2":{"366":1}}],["的话",{"2":{"354":1}}],["的渲染",{"2":{"350":1}}],["的情况",{"2":{"350":1}}],["的全部能力",{"2":{"349":1}}],["的基线是正常流中最后一个线框的基线",{"2":{"326":1}}],["的名称",{"2":{"317":1}}],["的二进制",{"0":{"296":1,"297":1}}],["的二进制格式",{"2":{"274":1,"275":1,"277":1}}],["的补码形式",{"2":{"294":1}}],["的倍数",{"2":{"282":2}}],["的整数",{"2":{"282":1}}],["的精度",{"2":{"274":1,"275":1,"276":1,"277":1}}],["的查询字符串",{"2":{"271":1}}],["的提交可以使得提交记录不存在",{"2":{"266":1}}],["的提交记录直接提交到",{"2":{"257":1}}],["的值",{"2":{"221":1,"494":2}}],["的比例",{"2":{"210":2}}],["的计算",{"2":{"189":1}}],["的垃圾回收",{"2":{"175":1}}],["的mutaion",{"2":{"163":1,"758":1}}],["的变化",{"2":{"151":1,"746":1}}],["的灵活性",{"2":{"139":1}}],["的文本复合系统关闭时触发",{"2":{"116":1}}],["的文本复合系统打开时触发",{"2":{"116":1}}],["的中间件",{"2":{"104":1}}],["的参数列表",{"2":{"232":1}}],["的参数",{"0":{"95":1}}],["的防抖节流",{"2":{"73":1}}],["的",{"2":{"35":1,"106":1,"167":1,"168":2,"271":1,"349":1,"403":1,"416":1,"422":1,"446":1,"459":1,"718":3}}],["而变量提升是通过变量环境来实现",{"2":{"780":1}}],["而传统的引入会执行多次",{"2":{"681":1}}],["而不是子类的实例对象",{"2":{"864":1}}],["而不是子类实例",{"2":{"670":1}}],["而不是用户希望其执行的确切时间",{"2":{"821":1}}],["而不是跨域访问",{"2":{"683":1}}],["而不是父类的原型对象",{"2":{"670":1}}],["而不必完全传输",{"2":{"460":1}}],["而清除浮动只能清除同一",{"2":{"575":1}}],["而且有一个新的资源已经依据请求的需要而创建",{"2":{"508":1}}],["而新页面和当前页面属于同一站点",{"2":{"354":1}}],["而",{"2":{"221":1,"489":1,"777":1}}],["而应该对开始位置",{"2":{"191":2}}],["而中间恰好利用这段时间来进行动画过渡的操作",{"2":{"168":1}}],["而是利用compilation",{"2":{"140":1}}],["而是代码执行时间随着数据增长的变化趋势",{"2":{"1":1}}],["而具体实现则依赖于抽象接口",{"2":{"35":1}}],["高阶组件中转发一次",{"2":{"877":2}}],["高阶组件也是如此",{"2":{"877":2}}],["高级组合",{"0":{"874":1}}],["高级",{"0":{"836":1},"1":{"837":1,"838":1,"839":1,"840":1,"841":1,"842":1,"843":1,"844":1,"845":1,"846":1,"847":1,"848":1,"849":1,"850":1,"851":1,"852":1,"853":1,"854":1}}],["高级程序设计第三版",{"2":{"112":1}}],["高速率",{"2":{"463":1}}],["高度不超出可视区域时",{"2":{"595":2}}],["高度塌陷问题",{"2":{"576":1}}],["高度随机",{"2":{"191":1}}],["高度改变",{"0":{"191":1}}],["高度固定",{"0":{"190":1},"2":{"188":1,"190":1}}],["高度计算有误",{"2":{"188":2}}],["高度",{"2":{"188":2,"583":2}}],["高层次的模块不应该依赖低层次的模块",{"2":{"35":1}}],["高内聚则意味着对象专注于单一职责",{"2":{"35":1}}],["高内聚",{"2":{"35":1}}],["不使用负载",{"2":{"872":1}}],["不要直接赋值",{"2":{"876":1}}],["不要使用可选参数",{"2":{"872":1}}],["不要害怕经历",{"2":{"324":1}}],["不让事件循环继续的优点",{"2":{"828":1}}],["不允许超过",{"2":{"820":1}}],["不允许跨域就访问不到",{"2":{"682":1}}],["不允许跨域引入",{"2":{"682":2}}],["不允许跨域",{"2":{"682":2}}],["不适用负载",{"2":{"872":1}}],["不适用以上绑定方式",{"2":{"811":1}}],["不适用与",{"2":{"483":1}}],["不具备很高的实时性",{"2":{"795":1}}],["不成功的",{"2":{"770":1}}],["不固定实现",{"2":{"762":2}}],["不携带凭证",{"2":{"683":2}}],["不提供参数",{"2":{"669":1}}],["不计入垃圾回收机制",{"2":{"668":1}}],["不支持遍历",{"2":{"668":1}}],["不匹配换行符",{"2":{"666":1}}],["不包括文本节点和注释",{"2":{"717":1}}],["不包括位置信息",{"2":{"666":1}}],["不包含",{"2":{"349":1}}],["不包含滚动距离",{"2":{"226":1}}],["不渲染以达到首次加载渲染速度",{"2":{"655":1}}],["不占空间大小",{"2":{"653":1}}],["不产生任何内容",{"2":{"640":1}}],["不产生伪类元素",{"2":{"640":1}}],["不清除浮动会使得容器的高度为",{"2":{"602":1}}],["不设置宽度的情况",{"2":{"599":1}}],["不设置宽度",{"2":{"599":2}}],["不为",{"2":{"575":1}}],["不可行",{"2":{"797":2}}],["不可路由的源地址",{"2":{"496":1}}],["不可逆",{"2":{"95":2,"859":1}}],["不通用",{"2":{"483":1}}],["不必分割",{"2":{"481":1}}],["不返回",{"2":{"461":1}}],["不被允许",{"2":{"404":1}}],["不发送",{"2":{"402":4}}],["不考虑垃圾回收机制",{"2":{"668":1}}],["不考虑",{"2":{"380":1}}],["不同实例的同名函数是不相等的",{"2":{"761":1}}],["不同进程之间也可以通信",{"2":{"725":1}}],["不同",{"2":{"669":1}}],["不同浏览器可能间距不一",{"2":{"647":1}}],["不同的是",{"2":{"512":1}}],["不同的大小拆分成多个图块给到",{"2":{"363":1}}],["不同场景只加载所需要的模块内容",{"2":{"65":1}}],["不知道出去该往哪个方向发展",{"2":{"324":1}}],["不仅仅是技术",{"2":{"324":1}}],["不仅仅是设备方向改变",{"2":{"233":1}}],["不是事件循环的一部分",{"2":{"828":1}}],["不是提前编译的",{"2":{"765":1}}],["不是一个构造函数",{"2":{"671":1}}],["不是",{"2":{"669":1}}],["不是重复连接",{"2":{"316":1}}],["不是正确的答案",{"2":{"294":2}}],["不是结束生命的事件",{"2":{"159":1,"754":1}}],["不依赖",{"2":{"257":1}}],["不用等图像",{"2":{"230":1}}],["不冒泡",{"2":{"225":2,"226":2}}],["不会对有表达式进行求值",{"2":{"737":1}}],["不会对本身属于",{"2":{"706":1}}],["不会执行",{"2":{"669":1}}],["不会影响到可替换元素自身的内容",{"2":{"637":1}}],["不会被删除",{"2":{"395":1}}],["不会报告",{"2":{"380":1}}],["不会在历史记录中生成新的记录",{"2":{"271":1}}],["不会计入历史状态",{"2":{"268":1}}],["不会触发load事件",{"2":{"231":1}}],["不会再支持了",{"2":{"194":1}}],["不会改变布局",{"2":{"166":1}}],["不能直接使用参数类型相应的方法或者属性",{"2":{"866":1}}],["不能继承私有属性方法",{"2":{"860":1}}],["不能编译=",{"2":{"857":2}}],["不能添加新的属性定义",{"2":{"837":1}}],["不能重复定义会报错",{"2":{"837":1}}],["不能为",{"2":{"837":1}}],["不能使用推断类型的原型方法",{"2":{"866":1}}],["不能使用",{"2":{"797":2}}],["不能依赖",{"2":{"761":1}}],["不能传参数",{"2":{"761":1}}],["不能用于赋值",{"0":{"742":1}}],["不能执行",{"2":{"682":4}}],["不能与",{"2":{"669":1,"737":1}}],["不能与其它类型进行运算",{"2":{"667":1}}],["不能单独存在",{"2":{"545":1}}],["不能被实例化",{"2":{"864":1}}],["不能被",{"2":{"403":1}}],["不能被读取",{"2":{"394":1}}],["不能超过",{"2":{"393":1}}],["不能出现空白",{"2":{"190":2}}],["不能访问到的元素为垃圾数据",{"2":{"183":1}}],["不连续的内存空间",{"2":{"181":1}}],["不死的对象活的更久",{"2":{"178":1}}],["不过它会再基于抽象语法树生成字节码",{"2":{"170":1}}],["不再继续又生成一遍",{"2":{"132":1}}],["不合适进行及时的设计调整与优化",{"2":{"63":1}}],["不滥用用户的缓存资源",{"2":{"55":1}}],["不相关的事物不应相互依赖",{"2":{"35":1}}],["不存在左右节点",{"2":{"21":1}}],["低耦合基于抽象",{"2":{"35":1}}],["低耦合",{"2":{"35":1}}],["从样式中删除给定属性",{"2":{"718":1}}],["从匹配的第一个位置再进行匹配",{"2":{"666":1}}],["从最外层到最内层",{"2":{"641":1}}],["从上游服务器接收到无效的响应",{"2":{"541":1}}],["从浏览器渲染的过程进行理解以及渲染的优化步骤",{"2":{"370":1}}],["从近到远的提交记录",{"2":{"257":1}}],["从文档中移除之后触发",{"2":{"229":1}}],["从文档中删除选区中的文本",{"2":{"114":1}}],["从而导致事件循环无法到达轮询阶段",{"2":{"820":1}}],["从而导致性能降低",{"2":{"777":1}}],["从而复制文字到剪切板中",{"2":{"195":2}}],["从而减少内存占用",{"2":{"55":1}}],["从一组根元素开始",{"2":{"183":1}}],["从以下一个例子中来讲",{"2":{"168":1}}],["从选区中移除指定的",{"2":{"114":1}}],["从选区中移除所有",{"2":{"114":1}}],["从工程学角度来看",{"2":{"61":1}}],["从",{"2":{"58":1}}],["从用户首次交互",{"2":{"56":1}}],["从系统内部的角度来进行职责划分",{"2":{"34":1}}],["从业务领域的角度来对系统进行领域划分和建模",{"2":{"34":1}}],["从该节点到可达节点的路径上的黑色节点数量相等",{"2":{"7":1}}],["领域驱动设计",{"2":{"34":1}}],["核心模块",{"2":{"33":1}}],["核心接口",{"2":{"23":1}}],["对一个已定义的类型遍历操作",{"2":{"837":1}}],["对元素产生了影响",{"2":{"660":1}}],["对称加密",{"0":{"553":1,"559":1},"1":{"554":1,"555":1,"560":1,"561":1}}],["对实体请求的一个或多个实体操作的结果表示",{"2":{"516":1}}],["对网络中不同主机的应用进程之间进行双向通信的端点的抽象",{"2":{"485":1}}],["对电信号进行分组形成具有特定意义的数据帧",{"2":{"479":1}}],["对数据包下一传输目的地进行选择",{"2":{"466":1}}],["对数据进行处理",{"2":{"466":1}}],["对比",{"0":{"461":1},"2":{"736":1}}],["对应当前请求的响应可以在另一个",{"2":{"521":1}}],["对应于当前主机",{"2":{"446":1}}],["对应的证书称为根证书",{"2":{"567":1}}],["对应的规则",{"2":{"242":2}}],["对应的父节点为",{"2":{"12":2}}],["对已经提交到工作区的文件进行操作",{"2":{"263":1}}],["对已有节点进行替换操作",{"2":{"188":1}}],["对指定文件进行规则覆盖",{"0":{"247":1}}],["对对象区域中的垃圾进行标记",{"2":{"182":1}}],["对象键指定为",{"2":{"837":1}}],["对象了",{"2":{"803":2}}],["对象时",{"2":{"761":1}}],["对象格式",{"2":{"672":2}}],["对象形式",{"2":{"672":2}}],["对象结构赋值",{"2":{"664":1}}],["对象和数组结构赋值",{"2":{"664":1}}],["对象每切换不同的页面长度",{"2":{"268":1}}],["对象已经加载完毕",{"2":{"230":1}}],["对象加载数据完毕",{"2":{"230":1}}],["对象正在加载数据",{"2":{"230":1}}],["对象就会被销毁",{"2":{"221":1}}],["对象才会存在",{"2":{"221":1}}],["对象包含指定的范围的字节调用",{"2":{"206":1}}],["对象是一个不可变的原始数据的类文件对象",{"2":{"206":1}}],["对象类型",{"2":{"198":1,"202":1}}],["对象存在单尚未初始化",{"2":{"230":1}}],["对象存活时间长",{"2":{"183":1}}],["对象存放的时间较长",{"2":{"180":1}}],["对象存放的时间较短",{"2":{"179":1}}],["对象晋升策略",{"2":{"182":1}}],["对象区域=空闲区域",{"2":{"182":1}}],["对象区域和空闲区域角色反转",{"2":{"182":1}}],["对象区域存满之后",{"2":{"182":1}}],["对象区域",{"2":{"182":1}}],["对象一般不会存储太久",{"2":{"178":1}}],["对象",{"2":{"143":2,"202":2,"221":2,"232":1,"234":1,"271":1,"419":2,"669":1,"718":1,"761":1,"795":1,"803":2,"808":1,"859":1}}],["对象中没有",{"2":{"776":2}}],["对象中",{"2":{"139":1}}],["对象的属性",{"2":{"718":1}}],["对象的",{"2":{"132":1,"271":1}}],["对象方法",{"2":{"114":1}}],["对象属性不会变动",{"2":{"672":2}}],["对象属性",{"2":{"114":1}}],["对象进行刷新",{"2":{"106":1}}],["对现有架构设计进行分析",{"2":{"63":1}}],["对页面进行分片",{"2":{"51":1}}],["对请求进行优化",{"2":{"50":1}}],["对请求资源进行合理的拆分",{"2":{"50":1}}],["对请求资源进行缓存",{"2":{"50":1}}],["对资源进行压缩",{"2":{"50":1}}],["对外提供查询接口",{"2":{"38":1}}],["对外提供配置接口",{"2":{"38":1}}],["对于运行在混杂模式下的",{"2":{"718":1}}],["对于当前请求的方法和所请求的资源",{"2":{"537":1}}],["对于反向代理服务器来说",{"2":{"493":1}}],["对于不同子网的数据包进行路由",{"2":{"480":1}}],["对于",{"2":{"159":1,"754":1}}],["对于浏览器来说是一笔巨大的开销",{"2":{"125":1}}],["对于核心复杂模块",{"2":{"64":1}}],["对于交互和逻辑复杂的应用",{"2":{"33":1}}],["对于页面内容丰富的应用",{"2":{"33":1}}],["对于简单的管理端应用",{"2":{"33":1}}],["邮件发送变更",{"2":{"27":1}}],["j",{"2":{"815":1}}],["just",{"0":{"702":1}}],["justify",{"0":{"591":1}}],["justifyleft",{"2":{"113":1}}],["justifycenter",{"2":{"113":1}}],["jquery",{"2":{"240":1,"242":14,"850":6}}],["jit",{"2":{"174":1}}],["javascript中的相等性检查",{"2":{"719":1}}],["javascriptcore",{"2":{"347":1}}],["javascript文件",{"2":{"230":1}}],["javascript",{"0":{"284":1,"731":1},"2":{"53":1,"112":1,"184":1,"185":1,"253":2,"284":1,"347":2,"351":1,"369":1,"381":2,"382":1,"403":1,"405":1,"677":2,"684":1,"730":1,"765":1,"777":1,"786":2,"797":1,"803":1,"804":1}}],["jest",{"2":{"26":1,"240":1}}],["jenkins",{"2":{"25":1}}],["jsimport",{"2":{"876":1}}],["jsif",{"2":{"806":1,"810":1}}],["js中",{"2":{"672":2}}],["jsvar",{"2":{"668":1,"717":1,"718":1,"723":1,"835":1}}],["jstypeof",{"2":{"663":1}}],["jsobject",{"2":{"763":1}}],["jsotherwindow",{"2":{"419":1}}],["json配置的文件编译",{"2":{"858":2}}],["json文件编译",{"2":{"858":2}}],["jsonday1",{"2":{"850":1}}],["json中配置eslintconfig",{"2":{"236":1}}],["json",{"0":{"831":1,"832":1,"856":2},"1":{"832":1,"857":2,"858":2},"2":{"205":1,"239":1,"241":1,"242":1,"245":1,"247":1,"249":1,"250":1,"339":1,"454":1,"831":1,"846":1,"848":4,"849":4,"850":7,"857":8,"858":2,"870":2}}],["jsdiv",{"2":{"717":1}}],["jsdocument",{"2":{"395":1,"715":3}}],["jsdefine",{"2":{"304":3,"854":1}}],["jsalert",{"2":{"394":1}}],["jsnew",{"2":{"380":1}}],["jsnavigator",{"2":{"202":1,"203":1}}],["js$",{"2":{"309":2}}],["jswindow",{"2":{"269":1,"270":1}}],["jsx",{"2":{"237":1,"877":2}}],["js文件",{"2":{"224":1}}],["jsmodule",{"2":{"134":1}}],["jscript",{"2":{"347":1}}],["jsconfig",{"0":{"856":1},"1":{"857":1,"858":1},"2":{"857":2}}],["jsconst",{"2":{"139":1,"147":1,"309":1,"494":1,"666":1,"671":2,"876":1}}],["jscompiler",{"2":{"106":1}}],["jsclass",{"2":{"13":1,"135":1}}],["jsfunction",{"2":{"76":1,"79":1,"82":1,"86":1,"89":1,"92":1,"98":1,"211":1,"669":1,"718":1,"761":7,"762":5,"775":1,"776":1,"797":1,"802":1,"803":1,"809":1}}],["jslet",{"2":{"19":1,"104":1,"153":1,"155":1,"156":1,"157":1,"159":1,"160":1,"201":1,"666":1,"667":1,"740":1,"741":1,"742":1,"743":1,"748":1,"750":1,"751":1,"752":1,"754":1,"755":1}}],["js",{"0":{"145":1,"148":1,"168":1,"193":1,"719":1,"732":1,"734":1,"765":1,"781":1,"792":1,"848":1},"1":{"149":1,"194":1,"195":1,"196":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"204":1,"205":1,"206":1,"720":1,"721":1,"722":1,"723":1,"735":1,"736":1,"737":1,"738":1,"739":1,"740":1,"741":1,"742":1,"743":1,"744":1,"766":1,"767":1,"768":1,"769":1,"770":1,"771":1,"772":1,"773":1,"774":1,"775":1,"776":1,"777":1,"778":1,"779":1,"780":1,"782":1,"783":1,"784":1,"785":1,"786":1,"787":1,"788":1,"789":1,"790":1,"791":1,"792":1,"793":2,"794":2,"795":2},"2":{"12":1,"77":1,"83":1,"87":1,"93":1,"96":1,"97":1,"102":3,"104":7,"106":9,"112":1,"114":1,"131":1,"143":5,"144":7,"145":3,"147":4,"149":1,"158":1,"168":4,"188":1,"190":1,"191":1,"195":1,"200":1,"208":2,"209":1,"210":1,"217":1,"218":1,"219":1,"223":1,"232":1,"244":1,"246":1,"250":2,"252":2,"253":6,"299":3,"301":1,"303":1,"305":1,"306":1,"339":1,"396":1,"399":1,"400":1,"419":1,"664":2,"666":5,"668":1,"669":1,"672":16,"675":1,"677":2,"678":6,"679":6,"681":4,"683":2,"684":1,"715":3,"718":1,"730":5,"733":3,"736":1,"737":2,"739":1,"753":1,"762":1,"764":1,"797":1,"801":1,"806":1,"821":1,"832":2,"840":2,"842":6,"848":10,"850":6,"853":1,"854":1,"857":8,"870":1,"876":1}}],["w",{"2":{"858":1}}],["wewr",{"2":{"865":2}}],["weakmap",{"2":{"668":2}}],["weakset",{"2":{"668":2}}],["webrtc",{"0":{"569":1},"1":{"570":1,"571":1,"572":1},"2":{"569":1}}],["webtrust",{"2":{"568":1}}],["webdav",{"0":{"504":1},"2":{"504":1}}],["webcontent",{"2":{"349":1}}],["webkit",{"2":{"347":4}}],["webkittransition",{"2":{"168":2}}],["webpagetest",{"2":{"382":1}}],["webpack允许创建一个webpack",{"2":{"141":1}}],["webpack=",{"2":{"104":1}}],["webpackdevmiddleware",{"2":{"104":2}}],["webpack",{"0":{"134":1,"135":1,"136":1},"1":{"137":1,"138":1,"139":1},"2":{"99":1,"100":1,"103":1,"104":8,"106":4,"107":2,"130":2,"134":3,"135":1,"137":1,"139":2,"141":1,"143":2,"144":3,"147":10}}],["webpck",{"2":{"142":1}}],["websocket",{"0":{"488":1,"493":2},"1":{"489":1,"490":1,"491":1,"492":1,"493":1,"494":1},"2":{"105":1,"106":3,"490":10,"493":3,"494":6,"503":1}}],["webassembly",{"2":{"53":1}}],["web",{"2":{"51":1,"53":1,"194":1,"196":1,"268":1,"352":2,"382":1,"406":1,"446":1,"689":2}}],["webhook",{"2":{"24":1}}],["w4v7o6xfti36lq3rncgctw==",{"2":{"490":1}}],["w4v7o6xfti36lq3rncgctw==get",{"2":{"490":1}}],["ws",{"2":{"489":1}}],["wrapper",{"2":{"602":2}}],["wrench",{"2":{"345":1}}],["writing",{"0":{"580":1},"1":{"581":1},"2":{"580":1,"861":1}}],["writable",{"2":{"241":2,"762":1}}],["writetext",{"0":{"201":1},"2":{"201":2}}],["write",{"0":{"200":1},"2":{"200":2,"253":2,"635":1}}],["www",{"2":{"341":2,"454":1,"618":4,"689":2,"843":2}}],["w3",{"2":{"326":1,"618":4}}],["w3c",{"2":{"194":1}}],["what",{"2":{"693":9,"806":2}}],["whatwg",{"2":{"194":1}}],["when",{"2":{"253":2,"876":1}}],["where",{"2":{"253":2,"635":1}}],["which",{"2":{"326":2}}],["while",{"2":{"19":2,"188":2,"191":4}}],["white",{"2":{"16":1,"326":2}}],["wide",{"2":{"689":2}}],["width",{"2":{"131":2,"146":2,"147":4,"168":2,"188":6,"575":1,"586":3,"599":4,"618":2,"644":2,"647":2,"718":4,"860":2}}],["width=device",{"2":{"131":2,"146":2,"147":4}}],["will",{"2":{"682":2}}],["wi",{"2":{"511":1}}],["wifi",{"2":{"476":1,"544":1}}],["wiki",{"2":{"450":1,"500":1}}],["wizard",{"2":{"253":2}}],["windwo",{"2":{"232":2}}],["windows",{"2":{"316":1}}],["window对象触发",{"2":{"233":1}}],["window",{"0":{"189":1,"268":1,"271":1,"419":1},"1":{"190":1,"191":1},"2":{"44":1,"106":2,"114":1,"149":2,"168":4,"189":1,"191":2,"195":2,"196":1,"198":2,"200":2,"219":2,"221":1,"222":1,"224":3,"230":1,"232":1,"233":1,"268":1,"269":1,"270":1,"271":1,"301":2,"419":9,"718":7,"801":2,"803":2,"808":1,"810":2}}],["within",{"2":{"635":2}}],["without",{"2":{"253":2}}],["with",{"0":{"776":1},"2":{"147":2,"326":4,"764":2,"774":1,"776":4,"777":2}}],["wps",{"2":{"110":1}}],["worth",{"2":{"666":2}}],["worried",{"2":{"345":1}}],["worktree",{"2":{"262":6}}],["worker",{"2":{"50":1,"53":1,"240":1,"350":1}}],["worldfunction",{"2":{"802":1}}],["world`",{"2":{"342":1}}],["world``hello",{"2":{"342":1}}],["worldhello",{"2":{"342":1}}],["world",{"2":{"147":4,"157":2,"159":4,"184":1,"339":2,"342":3,"419":2,"689":2,"698":9,"752":2,"754":4,"761":6,"764":2,"802":11,"859":2}}],["word",{"2":{"110":1,"666":10}}],["wave",{"2":{"345":1}}],["walking",{"2":{"345":1}}],["warning",{"2":{"343":2,"345":1,"380":1}}],["warnings",{"2":{"253":6}}],["warn",{"2":{"200":4,"201":2,"202":2,"203":2,"243":1,"422":1}}],["was",{"2":{"153":2,"748":2}}],["watch",{"2":{"104":3,"345":1,"858":2}}],["wait",{"2":{"77":2,"83":2,"87":4,"93":4,"95":2,"96":2,"97":4,"98":20}}],["业务用例",{"2":{"24":1}}],["业务报警",{"0":{"29":1},"2":{"23":1}}],["业务层",{"2":{"23":1}}],["ua",{"2":{"701":1}}],["u",{"2":{"666":11,"866":6}}],["uri",{"0":{"703":1},"1":{"704":1,"705":1,"706":1,"707":1,"708":1,"709":1},"2":{"456":1,"508":1,"519":1,"521":1,"525":2,"526":1,"703":2,"706":2}}],["urlstr",{"2":{"843":2}}],["url=xxx",{"2":{"701":1}}],["urlencoded",{"2":{"454":1}}],["url",{"2":{"106":4,"113":2,"232":2,"268":2,"271":8,"396":1,"416":2,"618":4,"640":1,"718":2,"832":4,"843":12}}],["udp",{"0":{"570":1},"2":{"422":4,"427":1,"466":1,"478":1,"481":2,"569":2}}],["upper",{"2":{"641":1}}],["upgrade",{"2":{"490":8,"503":1}}],["updates",{"2":{"424":2}}],["update",{"2":{"424":2,"494":2}}],["up",{"2":{"421":3,"428":20,"433":3}}],["upsudo",{"2":{"421":1}}],["upstream",{"2":{"256":2}}],["umd",{"0":{"301":1,"844":1},"2":{"300":1,"839":1,"857":2,"868":1}}],["usr",{"2":{"832":1}}],["us",{"2":{"666":2,"675":2}}],["using",{"2":{"253":2}}],["used",{"0":{"516":1},"2":{"253":2}}],["use",{"0":{"523":1},"2":{"104":2,"253":12,"683":2,"775":2,"801":4,"876":1}}],["userwithproto",{"2":{"764":2}}],["user=name",{"2":{"395":2,"396":2,"399":2,"400":2}}],["user",{"2":{"41":1,"635":1,"764":10,"837":2}}],["utun1",{"2":{"428":4}}],["utun0",{"2":{"428":4}}],["utility",{"0":{"838":1},"2":{"348":1}}],["utils",{"2":{"143":4,"147":2,"675":4,"680":2}}],["utf",{"2":{"131":2,"146":2,"147":4,"206":1}}],["ul",{"0":{"697":1},"2":{"113":1,"644":9,"646":24,"647":1,"648":4,"649":3,"650":1,"651":1}}],["uncaught",{"2":{"742":2}}],["uncle",{"2":{"20":1}}],["unescape",{"0":{"704":1},"2":{"703":1}}],["unexpected",{"2":{"328":2}}],["unsafe",{"2":{"777":1}}],["unsupported",{"0":{"537":1}}],["unspecified",{"2":{"198":1}}],["unavailable",{"0":{"542":1}}],["unauthorized",{"0":{"529":1}}],["unamused",{"2":{"345":1}}],["union",{"0":{"863":1},"2":{"838":1,"863":1}}],["unicode",{"2":{"666":8,"703":1}}],["unique",{"2":{"494":1}}],["uninitialized",{"2":{"230":1}}],["unknown",{"2":{"428":2,"872":1}}],["unmatched",{"2":{"253":4}}],["unused",{"2":{"253":4}}],["unless",{"2":{"326":2}}],["unload",{"2":{"224":1}}],["unloadeventend",{"2":{"43":1}}],["unloadeventstart",{"2":{"43":1}}],["unlink",{"2":{"113":1}}],["undefine",{"2":{"808":1}}],["undefined",{"2":{"98":12,"232":2,"664":3,"669":6,"735":1,"736":2,"737":9,"738":2,"769":1,"788":1,"810":1,"837":4,"838":1,"859":3,"865":1}}],["undefind",{"2":{"776":2}}],["underline",{"2":{"113":1}}],["uv",{"2":{"41":1}}],["uint8array",{"2":{"671":2}}],["ui事件",{"0":{"224":1}}],["uievents",{"2":{"223":4}}],["ui",{"0":{"24":1},"2":{"23":1,"349":2}}],["架构",{"0":{"22":1},"2":{"427":1}}],["根目录下创建",{"2":{"870":2}}],["根目录下存在以",{"2":{"330":1}}],["根据指定的tsconfig",{"2":{"858":2}}],["根据typescript默认配置编译src目录中所有ts文件",{"2":{"858":2}}],["根据typescript默认配置编译文件",{"2":{"858":2}}],["根据自己目录下配置的tsconfig",{"2":{"858":2}}],["根据",{"2":{"480":1}}],["根据图层不同的范围级别",{"2":{"363":1}}],["根据语法规则转成抽象语法树",{"2":{"172":1}}],["根域名与协议相同",{"2":{"354":1}}],["根",{"2":{"21":3}}],["根节点必须是黑色的",{"2":{"7":1}}],["前行断言",{"2":{"666":2}}],["前",{"2":{"429":1}}],["前面是网络号",{"2":{"429":1}}],["前几位",{"2":{"429":1}}],["前进",{"2":{"728":1}}],["前进后退",{"2":{"268":1}}],["前进两页",{"2":{"268":1}}],["前进一页",{"2":{"268":1}}],["前期准备",{"2":{"67":1}}],["前端模块的演变",{"0":{"300":1},"1":{"301":1,"302":1,"303":1,"304":1,"305":1,"306":1,"307":1,"308":1,"309":1}}],["前端文档是一个深耕并且值得投入的领域",{"2":{"129":1}}],["前端文档的复杂度很高",{"2":{"128":1}}],["前端文档的技术该如何选择以及采坑",{"2":{"117":1}}],["前端文档展望",{"0":{"127":1},"1":{"128":1,"129":1}}],["前端文档性能",{"0":{"124":1},"1":{"125":1,"126":1}}],["前端文档应用",{"0":{"121":1},"1":{"122":1,"123":1}}],["前端文档深思考",{"0":{"117":1},"1":{"118":1,"119":1,"120":1}}],["前端文档浅思考",{"0":{"111":1},"1":{"112":1,"113":1,"114":1,"115":1,"116":1}}],["前端文档",{"0":{"110":1},"1":{"111":1,"112":1,"113":1,"114":1,"115":1,"116":1,"117":1,"118":1,"119":1,"120":1,"121":1,"122":1,"123":1,"124":1,"125":1,"126":1,"127":1,"128":1,"129":1}}],["前端团队人数",{"2":{"62":1}}],["前端工程化致力于提升工程的开发效率",{"2":{"61":1}}],["前端工程化",{"0":{"61":1},"2":{"61":1}}],["前端框架和工具选型",{"2":{"59":1}}],["前端框架与脚手架",{"2":{"58":1}}],["前端性能优化",{"0":{"48":1},"1":{"49":1,"50":1,"51":1,"52":1,"53":1,"54":1,"55":1,"56":1}}],["前端监控体系",{"0":{"39":1},"1":{"40":1,"41":1,"42":1,"43":1,"44":1,"45":1,"46":1,"47":1}}],["前端不止于技术",{"2":{"22":1}}],["前序遍历",{"2":{"21":1}}],["前后变量法",{"2":{"19":1}}],["遍历方法",{"2":{"668":2}}],["遍历",{"2":{"21":1,"357":1,"669":1}}],["树形结构",{"2":{"837":1}}],["树",{"0":{"20":1},"1":{"21":1}}],["pick",{"2":{"838":1}}],["ping",{"2":{"491":1}}],["physical",{"2":{"477":1}}],["phase",{"2":{"188":6}}],["pfifo",{"2":{"433":2}}],["p2p0",{"2":{"428":2}}],["p2p",{"2":{"427":1}}],["p|",{"2":{"262":2}}],["png",{"2":{"205":1}}],["pxelinus",{"2":{"425":1}}],["pxelinux",{"2":{"424":2,"425":1}}],["pxe",{"0":{"423":1,"425":1},"1":{"424":1,"425":1},"2":{"423":3,"424":3,"425":6}}],["px",{"2":{"188":2,"630":1}}],["polygons",{"2":{"852":8}}],["polyfill",{"2":{"806":1}}],["poll",{"0":{"824":1},"2":{"819":1,"820":1}}],["policy",{"2":{"701":1}}],["pong",{"2":{"491":1}}],["pointopoint",{"2":{"428":6}}],["pop3",{"2":{"471":1}}],["popup",{"2":{"419":4}}],["popstate",{"2":{"269":4}}],["postmessage",{"0":{"419":1},"2":{"419":6}}],["post",{"0":{"453":1},"1":{"454":1},"2":{"402":2,"461":5,"521":1,"718":1}}],["position",{"2":{"188":6,"575":1,"582":1,"718":2}}],["port",{"2":{"102":2,"271":2,"416":1,"428":6}}],["pc虚拟列表如何处理",{"0":{"186":1},"1":{"187":1,"188":1,"189":1,"190":1,"191":1,"192":1}}],["please",{"2":{"876":1}}],["placeholder",{"2":{"633":2,"635":1}}],["plain",{"2":{"195":2,"200":4,"205":1,"718":2}}],["play",{"2":{"167":1}}],["plugina",{"2":{"246":2}}],["pluginargs",{"2":{"139":12}}],["plugins",{"0":{"242":1},"2":{"134":2,"141":1,"147":2,"239":4,"242":2,"253":8,"857":2}}],["plugin使用在webpack配置中",{"2":{"134":1}}],["plugin插件实现代码还是挺复杂的",{"2":{"130":1}}],["plugin",{"2":{"104":1,"107":1,"130":1,"134":2,"139":1,"142":1,"147":10,"239":8,"242":6,"251":1,"253":2,"869":1}}],["p",{"0":{"691":1},"2":{"113":1,"147":6,"210":20,"265":2,"599":6,"666":3}}],["ppt",{"2":{"110":1}}],["push",{"2":{"761":2}}],["pushstate",{"2":{"268":3}}],["put",{"0":{"455":1},"2":{"461":3,"521":1}}],["publicpath",{"2":{"143":4}}],["public",{"2":{"104":1,"108":1,"143":4,"147":4,"864":1}}],["puppeteer",{"2":{"24":1}}],["private",{"2":{"864":1}}],["priority",{"2":{"428":8,"718":1}}],["print",{"2":{"253":4}}],["prpl",{"2":{"381":1}}],["provider",{"2":{"876":14}}],["provided",{"2":{"253":2}}],["protected",{"2":{"864":1}}],["proto",{"0":{"763":1},"2":{"428":2,"715":28,"763":9,"764":6}}],["protocols",{"0":{"503":1},"2":{"490":2}}],["protocol",{"2":{"271":1,"416":1,"420":1,"434":1,"450":1,"469":1,"478":2,"571":2,"572":1,"843":2}}],["prototype",{"2":{"98":2,"666":5,"667":1,"669":2,"671":1,"715":6,"760":1,"761":14,"762":22,"763":5,"764":4,"804":1,"806":16,"810":8}}],["props",{"2":{"876":8,"877":8}}],["prop",{"2":{"876":3}}],["proptypes",{"2":{"876":6}}],["propname",{"2":{"860":2}}],["properties",{"2":{"860":2}}],["propertyname",{"2":{"718":4}}],["property",{"2":{"167":1,"326":2,"359":1,"848":3,"849":4,"860":1}}],["proxy",{"0":{"523":1,"524":1,"535":1}}],["promisc",{"2":{"428":6,"433":1}}],["promise",{"2":{"143":2,"198":1,"206":1,"669":1}}],["processing",{"0":{"504":1}}],["process",{"0":{"820":1,"828":1,"829":1,"830":1},"1":{"829":1,"830":1},"2":{"253":2,"330":1,"348":1,"353":2,"354":7,"820":4,"826":1,"828":1,"829":1}}],["processor",{"0":{"239":1},"2":{"239":6}}],["problem",{"2":{"253":2}}],["problems",{"2":{"253":6}}],["project",{"2":{"250":1,"857":2,"858":2}}],["pretty",{"2":{"858":1}}],["prettier",{"2":{"60":1}}],["prepare",{"0":{"823":1},"2":{"819":1,"820":1}}],["prepend",{"2":{"18":1}}],["prerender",{"2":{"402":1}}],["pre",{"0":{"359":1,"698":1},"2":{"423":1,"559":2,"560":1,"561":1,"563":2,"698":8}}],["preservewatchoutput",{"2":{"858":1}}],["presentation",{"2":{"472":1}}],["presentationstyle",{"2":{"198":1}}],["present",{"2":{"253":2}}],["presidents",{"2":{"666":2}}],["presto",{"2":{"347":1}}],["prefers",{"2":{"149":2}}],["prefixlen",{"2":{"428":14}}],["prefix",{"2":{"106":2}}],["previouselementsibling",{"2":{"717":1}}],["previoussibling",{"2":{"156":5,"717":1,"751":5}}],["prevent",{"2":{"253":4}}],["preventdefault",{"2":{"195":2,"221":2,"230":1}}],["prev",{"2":{"19":2}}],["prevnode",{"2":{"19":6}}],["people",{"2":{"832":1}}],["per2",{"2":{"761":12}}],["per1",{"2":{"761":14}}],["person",{"2":{"761":36}}],["percentage",{"2":{"630":1}}],["permanent",{"0":{"526":1}}],["permanently",{"0":{"519":1}}],["permissions",{"2":{"198":2}}],["performnud",{"2":{"428":14}}],["performanceentry",{"2":{"378":1}}],["performanceobserver",{"2":{"378":1,"380":2}}],["performancetiming",{"2":{"43":1}}],["per",{"2":{"354":3}}],["pending状态",{"2":{"163":1,"758":1}}],["pending",{"0":{"822":1},"2":{"95":1,"98":6,"819":1,"820":1}}],["pwa",{"2":{"50":1}}],["passive",{"2":{"712":1}}],["past",{"2":{"635":1}}],["paste",{"2":{"113":1,"718":1}}],["payment",{"0":{"530":1}}],["paint",{"0":{"359":1,"360":1,"375":1,"660":1},"2":{"379":1,"380":6,"383":1,"384":1,"386":1,"661":2}}],["patch",{"0":{"460":1},"2":{"256":2,"262":2,"265":2,"461":4}}],["pattern",{"2":{"253":8}}],["patterns",{"2":{"253":2}}],["paths",{"2":{"850":4,"857":4}}],["pathspec",{"2":{"262":8,"265":8}}],["path=",{"2":{"396":4,"843":2,"852":2,"854":2}}],["pathname",{"2":{"271":2}}],["path",{"0":{"396":1},"2":{"253":24,"369":1,"396":1,"428":4,"857":2}}],["package",{"0":{"831":1},"1":{"832":1},"2":{"250":1,"330":2,"831":1,"848":4,"849":4,"850":4}}],["padding",{"2":{"168":2,"586":5}}],["paused",{"2":{"167":1}}],["parsing",{"0":{"356":1}}],["parser",{"2":{"238":2,"253":8}}],["parseint",{"2":{"208":12}}],["parse",{"2":{"172":1,"843":4}}],["parent",{"2":{"259":2,"326":4,"713":18,"876":6}}],["parents",{"2":{"16":1,"876":2}}],["partial",{"0":{"513":1},"2":{"838":2}}],["part",{"2":{"156":6,"751":6}}],["parameters",{"2":{"838":1,"861":2}}],["param",{"2":{"143":6,"188":2}}],["pagespeed",{"2":{"382":2}}],["pageshow",{"0":{"231":1}}],["pagehide",{"0":{"231":1}}],["pagey",{"2":{"226":1}}],["pagex",{"2":{"226":1}}],["page",{"0":{"622":1},"2":{"41":1}}],["pv",{"2":{"41":1}}],["存放全局变量",{"2":{"793":1}}],["存放的是引用地址",{"2":{"791":1}}],["存放可执行代码",{"2":{"789":1}}],["存放安全数据",{"2":{"788":1}}],["存在默认default导出时",{"2":{"672":2}}],["存在文字特性",{"2":{"647":1}}],["存在两个编码问题",{"2":{"293":1}}],["存在语法错误",{"2":{"172":1}}],["存在其中一个节点",{"2":{"21":1}}],["存在左右节点",{"2":{"21":1}}],["存在",{"2":{"16":1,"848":1}}],["存储在客户端",{"2":{"393":1}}],["存储在服务器",{"2":{"71":1}}],["存储型",{"0":{"71":1}}],["存储",{"2":{"15":1}}],["存储方式",{"2":{"13":1}}],["判断",{"0":{"722":1}}],["判断服务器是否支持该请求方法以及响应",{"2":{"458":1}}],["判断兼容性",{"2":{"232":1}}],["判断是否支持dom2或者dom3事件",{"2":{"223":1}}],["判断是否支持",{"2":{"168":2}}],["判断是否继续遍历的条件",{"2":{"16":1}}],["判断奇偶",{"2":{"4":1}}],["记录一组",{"2":{"838":1}}],["记录一些定义文件的细节",{"2":{"867":1}}],["记录一些特殊的操作运算符",{"2":{"734":1}}],["记录一些之前没有注意的地方",{"2":{"662":1}}],["记录一些面试题以及面试经历",{"2":{"377":1}}],["记录原生的",{"2":{"715":1}}],["记录前端的点点滴滴",{"2":{"702":1}}],["记录访问的当前节点以及对应的父亲节点",{"2":{"16":1}}],["记录访问过的顶点",{"2":{"16":1}}],["记录离开时访问的节点",{"2":{"16":1}}],["记录进入时访问的节点",{"2":{"16":1}}],["探测环",{"0":{"16":1}}],["开关",{"2":{"464":1}}],["开启写作之旅",{"0":{"324":1}}],["开启之路",{"0":{"9":1}}],["开头^自带",{"2":{"666":1}}],["开头的",{"2":{"446":1}}],["开头",{"2":{"271":1,"676":3,"814":1}}],["开发中正确使用seo优化",{"2":{"685":1}}],["开发者工具",{"2":{"382":1}}],["开发的成本很大",{"2":{"128":1}}],["开发",{"2":{"61":1,"67":1}}],["开始下一个宏任务",{"2":{"733":1}}],["开始检查渲染",{"2":{"733":1}}],["开始",{"0":{"878":1},"2":{"715":1,"815":1}}],["开始执行",{"2":{"669":1}}],["开始绘制",{"2":{"360":1}}],["开始输入",{"2":{"228":1}}],["开始偏移高度",{"2":{"190":2}}],["开始位置偏移信息",{"2":{"191":2}}],["开始位置",{"2":{"190":2}}],["开始滚动计算",{"2":{"188":2}}],["开始注入",{"0":{"145":1}}],["开始写一个loader",{"2":{"144":2}}],["开始编译添加的入口文件",{"2":{"143":2}}],["开始编译",{"2":{"138":1}}],["开始对前端架构的思考",{"2":{"22":1}}],["开始顶点",{"2":{"15":1}}],["边框边界",{"2":{"585":1}}],["边",{"2":{"15":1}}],["顶点",{"2":{"15":1}}],["有些模块使用了其他模块设置了一些全局状态",{"2":{"840":1}}],["有些情况会得到",{"2":{"589":1}}],["有",{"2":{"761":1}}],["有的转换会感觉很奇怪",{"2":{"719":1}}],["有两个方法",{"2":{"716":1}}],["有助于跨站点脚本共计",{"2":{"701":1}}],["有设定",{"2":{"582":1}}],["有了混合加密方式的传输数据仍然不是安全的",{"2":{"562":1}}],["有效如下",{"2":{"717":2}}],["有效时间",{"2":{"564":1}}],["有效数字",{"2":{"284":1}}],["有效域",{"2":{"283":1}}],["有效的降低整体计算耗时",{"2":{"53":1}}],["有效的减少网络请求耗时",{"2":{"50":1}}],["有热点代码",{"2":{"174":1}}],["有可能",{"2":{"162":1,"757":1}}],["有兴趣可以看看",{"2":{"191":1}}],["有兴趣可以查看webpack源码",{"2":{"130":1}}],["有兴趣打开原文阅读",{"2":{"110":1}}],["有向图探测",{"2":{"16":1}}],["有向图",{"2":{"15":1}}],["有左节点且",{"2":{"12":1}}],["图像不会改变方向",{"2":{"581":1}}],["图像",{"2":{"381":1}}],["图像下载完毕触发",{"2":{"224":1}}],["图片",{"2":{"51":1}}],["图",{"0":{"15":1},"1":{"16":1}}],["d3",{"2":{"852":4}}],["dmz",{"2":{"808":1}}],["dfn",{"0":{"696":1}}],["d+",{"2":{"666":8}}],["dtls",{"0":{"570":1},"2":{"569":2}}],["dv",{"2":{"568":2}}],["dlt",{"2":{"476":1}}],["dlh",{"2":{"476":1}}],["duplex",{"2":{"428":4}}],["duration",{"2":{"167":2,"168":2}}],["d2d",{"2":{"428":2}}],["ddns",{"2":{"424":1}}],["ddd",{"2":{"34":1}}],["dynamic",{"2":{"420":1,"424":2}}],["dhcp",{"0":{"420":1,"422":1},"1":{"421":1,"422":1,"423":1,"424":1,"425":1},"2":{"420":1,"422":10,"424":3,"425":1,"427":1}}],["dcl",{"0":{"385":1}}],["drop",{"2":{"635":1}}],["draw",{"0":{"366":1},"2":{"365":1,"366":1,"368":1}}],["dry",{"2":{"253":2}}],["driven",{"2":{"34":2}}],["db9a",{"2":{"428":2}}],["dblclick",{"2":{"226":1}}],["dbclick",{"2":{"226":1}}],["d",{"0":{"444":1,"870":1},"2":{"208":2,"211":12,"429":2,"439":1,"666":10,"815":1,"835":2,"843":4,"844":2,"847":4,"849":11,"852":2,"860":2,"869":4,"870":3,"871":1,"874":4}}],["day",{"2":{"666":4}}],["dad",{"2":{"428":14}}],["danger",{"2":{"343":2}}],["dark",{"2":{"149":2}}],["dataset",{"2":{"716":1,"717":8}}],["dataview",{"2":{"671":7}}],["datatransfer",{"2":{"195":2,"197":1}}],["data",{"2":{"147":2,"190":2,"191":8,"195":6,"200":4,"454":1,"476":1,"820":1}}],["datetime=",{"2":{"694":2}}],["date",{"2":{"82":6,"86":2,"92":4,"98":4,"195":2,"399":9}}],["digicert",{"2":{"568":1}}],["digest",{"2":{"494":4}}],["direct",{"2":{"876":1}}],["directives",{"0":{"854":1},"2":{"253":4}}],["direction",{"2":{"167":1,"594":4,"595":2}}],["directory",{"2":{"253":4}}],["dir",{"2":{"253":2,"309":1,"635":1}}],["dist",{"2":{"850":2,"857":2}}],["dispatchevent",{"2":{"715":2}}],["display",{"0":{"368":1,"653":1},"2":{"168":24,"326":2,"353":2,"367":1,"575":5,"591":2,"592":2,"593":2,"594":4,"595":2,"602":2,"643":4,"644":2,"647":3,"650":2,"651":2}}],["discipline",{"2":{"433":1}}],["discover",{"2":{"428":4}}],["disconnect",{"0":{"157":1,"752":1},"2":{"157":4,"158":2,"159":3,"752":4,"753":2,"754":3}}],["disabling",{"2":{"253":2}}],["disabled",{"2":{"428":2,"635":1}}],["disable",{"0":{"248":1},"2":{"246":14,"253":8}}],["disjoin",{"0":{"17":1}}],["dive",{"0":{"873":1},"1":{"874":1}}],["div",{"2":{"104":4,"111":1,"114":2,"131":4,"146":4,"147":8,"158":12,"168":10,"188":16,"216":8,"217":4,"218":4,"219":4,"339":4,"591":8,"592":16,"593":16,"594":36,"595":12,"599":6,"605":1,"606":1,"607":1,"675":8,"713":12,"715":7,"717":21,"718":2,"753":12,"877":12}}],["diff",{"2":{"92":10}}],["dns",{"2":{"50":4,"427":1,"562":1}}],["deep",{"0":{"873":1},"1":{"874":1}}],["demilitarized",{"2":{"808":1}}],["declare",{"2":{"842":6,"843":2,"852":2,"863":2,"870":4}}],["decodeuricomponent",{"0":{"709":1}}],["decodeuri",{"0":{"707":1}}],["decimal128",{"0":{"278":1}}],["decimal64",{"0":{"278":1}}],["decimal",{"2":{"208":2,"299":1,"641":1}}],["destroy",{"2":{"826":1}}],["description",{"2":{"667":1,"701":1,"832":1}}],["design",{"2":{"34":2}}],["dependency",{"2":{"854":1}}],["dependencies",{"2":{"303":2}}],["deprecated",{"2":{"253":2}}],["debugging",{"2":{"253":2}}],["debug",{"2":{"253":2,"354":1}}],["debounced",{"2":{"98":10}}],["debounceii",{"2":{"82":2}}],["debouncei",{"2":{"79":2}}],["debounce",{"0":{"96":1},"2":{"76":2,"77":2,"83":2,"94":1,"96":2,"98":2}}],["definitelytyped",{"2":{"870":2}}],["defineproperty",{"2":{"762":1,"763":2}}],["definedfunction",{"2":{"797":1}}],["defined",{"2":{"635":1,"775":2,"797":1,"801":2,"837":1}}],["define",{"0":{"303":1},"2":{"253":2,"301":2,"303":5,"304":3,"854":1}}],["defer",{"0":{"311":1,"678":1,"679":1},"2":{"310":1,"376":1,"678":2,"679":4,"717":8}}],["default",{"2":{"253":22,"306":2,"339":2,"635":1,"672":5,"701":1,"854":2,"857":4,"858":2,"861":1,"870":2}}],["defaultprevented",{"2":{"221":1}}],["detail信息",{"2":{"226":1}}],["detail",{"2":{"221":1,"226":1}}],["detachevent",{"2":{"219":1}}],["device",{"2":{"433":1}}],["devicemotion",{"2":{"233":1}}],["deviceorientation",{"2":{"233":1}}],["dev",{"2":{"104":4,"106":2}}],["delay",{"2":{"56":1,"76":4,"79":4,"82":6,"86":4,"89":4,"92":8,"167":2,"390":1}}],["deletefromdocument",{"2":{"114":1}}],["deletehead",{"2":{"18":1}}],["deletetail",{"2":{"18":1}}],["deleteword",{"2":{"14":1}}],["delete",{"0":{"456":1},"2":{"12":1,"13":1,"18":1,"113":1,"114":1,"461":1,"521":1,"668":4}}],["don",{"0":{"872":1}}],["done",{"2":{"106":2,"669":15}}],["dorey",{"2":{"719":1}}],["do",{"0":{"702":1,"872":1},"2":{"675":2}}],["dotall",{"2":{"666":1}}],["does",{"2":{"326":2}}],["doeswordexist",{"2":{"14":1}}],["double",{"2":{"245":2}}],["doubly",{"2":{"19":2}}],["doctype",{"2":{"131":2,"146":2,"147":2}}],["documentmode",{"2":{"232":4}}],["documentelement",{"2":{"224":1,"715":2,"718":3}}],["document",{"0":{"194":1,"417":1},"1":{"195":1},"2":{"43":1,"44":1,"72":1,"112":2,"113":3,"114":6,"115":1,"131":2,"134":2,"151":1,"155":8,"156":12,"157":6,"158":8,"159":12,"168":6,"194":1,"195":8,"196":1,"213":1,"214":1,"217":2,"218":2,"219":2,"223":4,"224":3,"230":1,"232":4,"351":1,"394":2,"396":2,"399":2,"400":2,"675":4,"713":4,"715":20,"717":3,"718":10,"746":1,"750":8,"751":12,"752":6,"753":8,"754":12}}],["domcharacterdatamodified",{"2":{"229":1}}],["domcontentloaded",{"2":{"43":1,"230":1,"311":2,"312":1,"385":1}}],["domcontentloadedeventend",{"2":{"43":1}}],["domcontentloadedeventstart",{"2":{"43":1}}],["domnoderemoved之后触发",{"2":{"229":1}}],["domnoderemovedfromdocument",{"2":{"229":1}}],["domnoderemoved",{"2":{"229":1}}],["domnodeinserted之后触发",{"2":{"229":1}}],["domnodeinsertedintodocument",{"2":{"229":1}}],["domnodeinserted",{"2":{"229":1}}],["dom结构发生任何变化",{"2":{"229":1}}],["domsubtreemodified",{"2":{"229":1}}],["dom发生变化时给出提示",{"2":{"229":1}}],["dommousescroll",{"2":{"226":1}}],["domfocusout",{"2":{"225":2}}],["domfocusin",{"2":{"225":2}}],["domattrmodified",{"2":{"229":1}}],["domactivate",{"2":{"224":1}}],["domain",{"0":{"397":1,"417":1},"2":{"34":1,"551":1}}],["dom3级",{"2":{"227":1,"228":1}}],["dom3级事件中已经移除",{"2":{"224":1}}],["dom3遗弃",{"2":{"225":2}}],["dom3",{"0":{"718":1},"2":{"223":2}}],["dom0",{"0":{"217":1}}],["dom2",{"0":{"115":1,"218":1,"710":1,"718":1},"1":{"711":1,"712":1,"713":1},"2":{"223":2}}],["dom",{"0":{"72":1,"212":1,"221":1,"371":1,"714":1,"715":1,"716":1,"717":1},"1":{"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1,"225":1,"226":1,"227":1,"228":1,"229":1,"230":1,"231":1,"232":1,"233":1,"234":1,"715":1,"716":1,"717":1,"718":1},"2":{"52":2,"56":1,"72":1,"114":5,"115":6,"151":3,"153":2,"158":2,"168":2,"212":1,"312":1,"356":2,"357":1,"654":1,"655":1,"715":1,"716":1,"717":1,"746":3,"748":2,"753":2,"857":2,"877":7}}],["dominteractive",{"2":{"43":1}}],["domloading",{"2":{"43":1}}],["lf",{"2":{"814":1}}],["lhs",{"0":{"768":1},"2":{"768":1,"770":1}}],["lr",{"2":{"580":1}}],["llc",{"2":{"476":1}}],["llw0",{"2":{"428":4}}],["l1",{"2":{"433":1}}],["lcp",{"0":{"379":1},"1":{"380":1,"381":1,"382":1},"2":{"380":6,"381":1}}],["lsls",{"2":{"322":1}}],["ls",{"2":{"318":2,"322":3}}],["ln",{"2":{"318":2,"322":2}}],["l",{"0":{"387":1},"2":{"210":15,"211":6,"318":2,"322":2}}],["later",{"2":{"876":1}}],["label",{"2":{"718":1}}],["lang",{"2":{"635":1}}],["lang=",{"2":{"131":2,"146":2,"147":4}}],["layer",{"2":{"471":1,"472":1,"473":1,"474":1,"475":1,"476":1,"477":1}}],["layout",{"0":{"358":1,"374":1,"579":1,"658":1},"2":{"253":2,"391":1,"575":1,"658":1,"661":2}}],["lax",{"2":{"402":2}}],["largest",{"2":{"379":1,"380":6}}],["lastchild",{"2":{"717":1}}],["lastcalltime",{"2":{"98":14}}],["lastelementchild",{"2":{"717":1}}],["lastthis",{"2":{"98":10}}],["lastargs",{"2":{"98":14}}],["lastinvoketime",{"2":{"98":10}}],["last",{"2":{"92":2,"326":2,"635":5}}],["literal",{"0":{"862":1}}],["litte",{"2":{"671":1}}],["license",{"2":{"832":1}}],["li",{"2":{"643":1,"644":14,"646":48,"647":2,"648":12,"649":2,"650":3}}],["list",{"0":{"642":1},"2":{"575":1}}],["listen",{"2":{"102":2}}],["lighthouse",{"2":{"382":1}}],["lightless",{"2":{"210":1}}],["linux",{"0":{"314":1},"1":{"315":1,"316":1,"317":1,"318":1,"319":1,"320":1,"321":1,"322":1,"323":1},"2":{"314":1,"316":1,"320":1,"425":1}}],["lint",{"2":{"253":2}}],["line",{"0":{"629":1},"1":{"630":1},"2":{"246":4,"326":4,"627":1,"633":1}}],["links",{"0":{"315":1,"319":1},"1":{"316":1,"317":1,"318":1,"320":1,"321":1,"322":1},"2":{"314":1}}],["link",{"0":{"310":1},"1":{"311":1,"312":1,"313":1},"2":{"134":2,"224":2,"402":1,"421":2,"476":2,"635":3}}],["linked",{"2":{"19":2}}],["linkedlist",{"2":{"13":2}}],["libname",{"2":{"870":4}}],["lib=",{"2":{"854":4}}],["libuv",{"2":{"825":1}}],["library",{"2":{"303":2}}],["lib",{"2":{"143":2,"147":2,"250":1,"672":4,"844":4,"854":1,"857":4}}],["lt",{"0":{"723":1},"2":{"92":2,"98":2,"104":12,"113":4,"131":28,"134":6,"146":28,"147":50,"168":36,"188":20,"191":10,"195":8,"210":10,"211":2,"216":8,"217":4,"218":4,"219":4,"253":2,"256":18,"257":1,"259":4,"262":18,"265":14,"326":18,"339":16,"402":11,"422":1,"428":66,"433":1,"591":14,"592":22,"593":22,"594":48,"595":18,"599":16,"644":20,"646":76,"648":16,"666":32,"675":4,"677":12,"678":12,"679":16,"680":8,"681":24,"682":18,"683":30,"684":8,"689":4,"693":12,"694":4,"698":22,"713":18,"715":4,"717":22,"723":2,"815":1,"820":1,"838":16,"843":2,"852":2,"854":10,"859":4,"860":2,"865":9,"866":28,"871":2,"876":14,"877":14}}],["lock",{"2":{"850":2}}],["local",{"2":{"635":1}}],["localhost",{"2":{"104":1,"106":2,"196":1,"490":2,"499":1}}],["location",{"0":{"271":1},"2":{"106":1,"227":1,"253":4,"269":1,"271":11,"508":1,"517":1}}],["lower",{"2":{"433":1,"641":2}}],["lo",{"2":{"429":1}}],["lo0",{"2":{"428":3}}],["loading",{"0":{"842":1},"2":{"230":1}}],["load",{"2":{"224":1,"312":1}}],["loaded",{"2":{"230":1}}],["loader绝对地址为",{"2":{"143":2}}],["loader",{"0":{"144":1},"2":{"137":3,"143":10,"144":11,"147":6}}],["loadeventend",{"2":{"43":1}}],["loadeventstart",{"2":{"43":1}}],["loopback",{"2":{"428":2,"429":1}}],["loop",{"0":{"724":1,"733":1},"1":{"725":1,"726":1,"727":1,"728":1,"729":1,"730":1,"731":1,"732":1,"733":1},"2":{"98":2,"351":1}}],["login",{"2":{"476":1}}],["loglevel",{"2":{"104":2}}],["log",{"2":{"98":14,"104":2,"153":2,"155":4,"156":2,"157":2,"158":2,"159":2,"200":2,"201":2,"202":2,"203":2,"246":4,"339":2,"380":2,"668":4,"684":2,"713":8,"748":2,"750":4,"751":2,"752":2,"753":2,"754":2,"761":18,"762":6,"763":2,"775":2,"776":2,"797":2,"801":2,"802":4,"803":2,"866":2,"874":2}}],["lodash",{"0":{"77":1,"80":1,"83":1,"87":1,"90":1,"93":1,"94":1,"95":1,"96":1,"97":1},"1":{"95":1,"96":1,"97":1,"98":1},"2":{"73":1,"94":1}}],["lex",{"2":{"874":2}}],["len",{"2":{"859":4}}],["length",{"2":{"131":2,"268":1,"271":1,"550":1,"630":1,"718":2,"837":1,"859":4,"865":2,"866":8}}],["learning",{"2":{"428":4}}],["lease",{"2":{"424":4}}],["leaveraf",{"2":{"168":2}}],["leave",{"2":{"168":19}}],["leadingedge",{"2":{"98":4}}],["leading",{"2":{"77":2,"83":2,"87":2,"93":2,"95":1,"96":2,"97":2,"98":10,"641":1}}],["lerna",{"2":{"65":1}}],["lettersonlyvalidator",{"2":{"852":2}}],["lettersregexp",{"2":{"852":4}}],["letter",{"2":{"633":1}}],["let",{"0":{"663":1},"2":{"19":3,"76":2,"79":2,"82":4,"86":4,"89":2,"92":4,"98":22,"102":4,"104":5,"106":4,"131":2,"143":4,"147":2,"149":2,"153":1,"155":1,"156":1,"157":1,"158":6,"159":1,"160":1,"168":2,"188":14,"190":16,"191":26,"195":4,"200":4,"201":1,"208":16,"419":2,"663":2,"664":2,"666":1,"667":3,"672":10,"675":2,"739":6,"740":1,"741":1,"743":1,"748":1,"750":1,"751":1,"752":1,"753":6,"754":1,"755":1,"843":2,"852":2,"859":14,"860":12,"861":1,"862":1,"864":2,"866":16,"874":6}}],["leftheight",{"2":{"20":1}}],["left",{"2":{"8":6,"586":2,"590":2,"592":2,"594":2,"598":1,"599":2,"603":1,"635":1,"718":6,"742":2}}],["gc",{"2":{"795":1,"866":4}}],["gulpfile",{"2":{"850":2}}],["gulp1",{"2":{"850":2}}],["gui更新则会被保存在一个队列中等待js引擎线程空闲时立即被执行",{"2":{"732":1}}],["gui渲染线程会被挂起",{"2":{"732":1}}],["gui",{"0":{"732":1},"2":{"730":2,"733":1}}],["guid",{"2":{"494":3}}],["gup",{"2":{"368":1}}],["gprs",{"2":{"476":1}}],["gpu",{"2":{"52":1,"353":2,"729":1}}],["gateway",{"0":{"541":1,"543":1},"2":{"465":1}}],["gmt",{"2":{"399":1}}],["gl",{"2":{"368":1}}],["globally",{"2":{"494":1}}],["global",{"2":{"253":4,"429":1,"810":2,"871":1}}],["globalreturn",{"2":{"237":1}}],["globals",{"0":{"241":1},"2":{"236":1,"241":2}}],["go",{"0":{"733":1},"2":{"268":4}}],["google",{"2":{"110":1,"268":1,"271":3,"347":1}}],["gird",{"2":{"575":1}}],["gif0",{"2":{"428":2}}],["given",{"2":{"253":2}}],["gitignore",{"2":{"832":1}}],["github",{"2":{"719":1}}],["git",{"0":{"254":1,"255":1,"258":1,"261":1,"264":1},"1":{"255":1,"256":2,"257":2,"258":1,"259":2,"260":2,"261":1,"262":2,"263":2,"264":2,"265":2,"266":2},"2":{"60":1,"65":1,"254":2,"256":5,"257":2,"259":3,"262":5,"263":3,"265":7}}],["gitlab",{"2":{"24":1}}],["genericclass",{"2":{"866":6}}],["generic",{"2":{"866":5}}],["genericidentityfn",{"2":{"866":8}}],["generics",{"0":{"866":1}}],["generator",{"2":{"701":1}}],["generated",{"2":{"850":4}}],["generate",{"0":{"669":1},"2":{"669":1}}],["gen",{"2":{"669":10}}],["genstureend",{"2":{"234":1}}],["gensturechange",{"2":{"234":1}}],["gensturestart",{"2":{"234":1}}],["geotrust",{"2":{"568":1}}],["gecko",{"2":{"347":1}}],["getkey",{"2":{"866":2}}],["getkeys",{"2":{"13":1}}],["getobject",{"2":{"763":1}}],["getownpropertysymbols",{"2":{"667":1}}],["getprototypeof",{"2":{"762":1}}],["getpropertyvalue",{"2":{"718":1}}],["getpropertycssvalue",{"2":{"718":1}}],["getchildcontext",{"2":{"876":2}}],["getcounter",{"2":{"860":4}}],["getcomputedstyle",{"2":{"718":2}}],["getclipboardtext",{"2":{"718":2}}],["getboundingclientrect",{"2":{"718":7}}],["getuint8",{"2":{"671":2}}],["getentries",{"2":{"380":2}}],["getelementsbytagname",{"2":{"168":2}}],["getelementbyid",{"2":{"168":2,"195":2,"217":2,"218":2,"219":2,"713":4,"715":2,"717":2}}],["gettype",{"2":{"198":1}}],["getdata",{"2":{"197":1,"718":3}}],["getattribute",{"2":{"195":2,"716":1}}],["getitemmeta",{"2":{"191":8}}],["getstopindexforoffset",{"2":{"190":2,"191":2}}],["getstartindexforoffset",{"2":{"190":4,"191":4}}],["getselection",{"2":{"114":3}}],["getrangeat",{"2":{"114":3}}],["getvalues",{"2":{"13":1}}],["get",{"0":{"451":1},"2":{"13":1,"20":5,"402":3,"452":1,"461":2,"513":1,"521":1,"668":2,"718":1,"763":6,"866":4}}],["g",{"2":{"210":8,"211":16,"659":1,"666":1,"669":4,"815":1,"835":2}}],["grid",{"2":{"575":1}}],["gre",{"2":{"427":1}}],["green",{"2":{"208":18,"209":8,"718":2,"859":2}}],["grub",{"2":{"423":2}}],["grammar",{"2":{"633":1}}],["gray",{"2":{"16":2}}],["graph",{"2":{"15":1}}],["gtp",{"2":{"427":1}}],["gt",{"0":{"614":1,"723":1},"2":{"13":2,"76":2,"79":2,"82":4,"86":2,"89":2,"92":6,"98":4,"102":2,"104":17,"112":2,"113":4,"131":30,"132":3,"134":6,"143":6,"145":4,"146":28,"147":50,"153":2,"155":2,"156":3,"157":4,"158":4,"159":6,"160":1,"162":1,"168":36,"176":1,"182":1,"188":22,"191":2,"195":8,"200":4,"201":4,"202":4,"203":4,"210":2,"211":2,"216":8,"217":4,"218":4,"219":4,"226":1,"227":3,"229":3,"230":1,"231":2,"232":2,"233":1,"234":2,"237":3,"250":1,"252":3,"253":2,"256":18,"257":1,"259":4,"262":18,"265":14,"289":1,"290":1,"326":18,"339":16,"380":2,"402":10,"422":2,"423":2,"428":66,"429":3,"433":1,"491":2,"580":1,"591":14,"592":22,"593":22,"594":48,"595":18,"599":16,"644":20,"646":76,"648":16,"666":24,"669":3,"672":6,"675":4,"677":12,"678":12,"679":16,"680":8,"681":24,"682":18,"683":30,"684":8,"689":4,"693":13,"694":5,"698":23,"713":22,"715":38,"716":2,"717":22,"718":1,"723":2,"733":2,"748":2,"750":2,"751":3,"752":4,"753":4,"754":6,"755":1,"757":1,"770":1,"805":3,"815":1,"820":1,"838":16,"842":2,"843":2,"848":2,"849":2,"852":2,"854":10,"857":18,"859":7,"860":8,"861":4,"863":1,"865":11,"866":33,"870":2,"871":2,"876":16,"877":24}}],["ms",{"2":{"827":1}}],["mshtml",{"2":{"347":1}}],["myidentityiii",{"2":{"866":4}}],["myidentityii",{"2":{"866":2}}],["myidentityu",{"2":{"866":2}}],["myidentityt",{"2":{"866":2}}],["myurl",{"2":{"843":2}}],["my",{"2":{"840":2}}],["myapp",{"2":{"832":2}}],["mybind",{"2":{"806":4}}],["myname",{"2":{"717":6}}],["mydiv",{"2":{"717":2,"718":14}}],["mjs",{"2":{"675":4,"677":2,"678":3,"680":4,"681":8,"683":8,"684":4}}],["mtu",{"2":{"428":26,"433":4}}],["mbr",{"2":{"423":1}}],["m",{"2":{"259":2,"815":3}}],["method",{"0":{"414":1,"533":1},"2":{"718":2}}],["methods",{"0":{"410":1}}],["method=",{"2":{"402":2}}],["metakey",{"2":{"226":1}}],["meta",{"0":{"701":1},"2":{"131":4,"146":4,"147":8}}],["meaningful",{"2":{"386":1}}],["merge",{"2":{"265":2}}],["message",{"2":{"230":1,"419":7}}],["me",{"2":{"195":2,"200":2,"201":2}}],["media",{"0":{"537":1,"621":1},"2":{"149":2,"467":1,"626":1}}],["mediaquerylist",{"2":{"149":4}}],["memory",{"2":{"104":1}}],["michael",{"2":{"717":2}}],["microsoft",{"2":{"347":3}}],["mixed",{"2":{"265":2,"266":1}}],["miscellaneous",{"2":{"253":2}}],["mime",{"0":{"205":1,"684":1},"2":{"195":2,"198":1,"205":1,"206":1}}],["middle",{"2":{"167":1}}],["middleware",{"2":{"104":5}}],["middware",{"2":{"104":3}}],["minorphase",{"2":{"188":8}}],["min",{"2":{"98":2,"190":6,"191":2,"211":14,"583":2,"586":2}}],["man",{"2":{"832":1}}],["manual",{"2":{"268":1}}],["may",{"2":{"694":3}}],["male",{"2":{"666":2}}],["masks",{"2":{"550":1}}],["mask",{"2":{"424":2,"545":1}}],["master",{"2":{"257":4,"554":2,"559":3,"560":1,"561":1,"563":3}}],["mac连接到linux环境",{"2":{"333":1}}],["mac",{"0":{"333":1,"432":1,"467":1},"2":{"422":6,"428":1,"432":3,"433":2,"464":2,"476":1,"479":1,"480":6}}],["majorphase",{"2":{"188":6}}],["marin",{"2":{"600":1}}],["marign",{"2":{"586":1}}],["marker",{"2":{"633":1}}],["markdown",{"2":{"239":2,"336":1}}],["marking",{"2":{"185":1}}],["mark",{"2":{"183":2}}],["margin",{"0":{"589":1,"590":1,"600":1,"647":1},"1":{"590":1,"591":1,"592":1,"593":1,"594":1,"595":1},"2":{"168":2,"326":4,"583":6,"586":5,"589":1,"590":10,"591":2,"592":8,"593":4,"594":6,"595":2,"600":2,"647":2}}],["matchall",{"0":{"666":1},"2":{"666":1}}],["match",{"0":{"666":1},"2":{"522":1,"666":1}}],["matchesselector",{"2":{"717":1}}],["matches",{"2":{"149":2}}],["matchmedia",{"0":{"149":1},"2":{"149":2}}],["mathlib",{"2":{"844":6}}],["math",{"2":{"98":4,"188":6,"190":18,"191":6,"208":6,"211":4,"299":1,"844":4}}],["make",{"0":{"138":1},"2":{"138":1}}],["main",{"2":{"104":4,"353":1,"832":1,"848":4,"850":4}}],["maxaddr",{"2":{"428":2}}],["maxoffset",{"2":{"191":2}}],["max",{"0":{"400":1,"412":1},"2":{"98":2,"188":2,"190":8,"191":4,"211":16,"253":2,"400":2,"583":2,"586":2}}],["maxing",{"2":{"95":1,"98":14}}],["maxwait",{"2":{"87":2,"93":2,"95":2,"97":2,"98":12}}],["maproots",{"2":{"857":2}}],["mapping",{"2":{"850":2}}],["mapped",{"2":{"837":1}}],["map",{"0":{"668":1},"2":{"13":2,"158":2,"668":5,"753":2,"857":2}}],["moudle",{"0":{"840":1}}],["mousewheel",{"2":{"226":1}}],["mouseup",{"2":{"226":3,"234":1}}],["mouseover",{"2":{"226":1,"234":1}}],["mouseout",{"2":{"226":1}}],["mousemove",{"2":{"226":1,"234":1}}],["mouseleave",{"2":{"226":1}}],["mouseenter",{"2":{"226":1}}],["mouseevent",{"2":{"223":2}}],["mousedown",{"2":{"226":3,"234":1}}],["month",{"2":{"666":4}}],["monorepo",{"2":{"65":1}}],["moved",{"0":{"519":1,"520":1}}],["mozorientation",{"2":{"233":1}}],["moduelb",{"2":{"848":1}}],["modulea",{"2":{"848":2,"849":2}}],["moduleb",{"2":{"847":10,"848":13,"849":33}}],["modulename",{"2":{"842":4}}],["modules",{"0":{"839":1,"843":1,"844":1,"853":1},"1":{"840":1,"841":1,"842":1,"843":1,"844":1},"2":{"672":2,"832":1,"846":1,"848":9,"849":24,"850":2,"853":1,"857":4}}],["module",{"0":{"673":1,"679":1,"680":1,"842":1,"845":1,"870":1},"1":{"674":1,"675":1,"676":1,"677":1,"678":1,"679":1,"680":1,"681":1,"682":1,"683":1,"684":1,"846":1,"847":1,"848":1,"849":1,"850":1,"851":1},"2":{"134":1,"144":6,"147":2,"237":1,"301":2,"303":3,"305":6,"309":2,"672":17,"675":2,"677":4,"678":2,"679":5,"680":6,"681":7,"682":6,"683":8,"684":2,"840":2,"843":2,"854":2,"857":2,"869":4,"870":2}}],["modified",{"0":{"522":1},"2":{"522":1}}],["mode",{"0":{"580":1},"1":{"581":1},"2":{"167":1,"309":1,"580":1}}],["model",{"2":{"72":1,"356":1,"584":1}}],["mochawesome",{"2":{"24":1}}],["mocha",{"2":{"24":1}}],["must",{"2":{"850":2}}],["mutaintionobserver",{"0":{"158":1,"753":1}}],["mutationrecords",{"2":{"156":14,"158":4,"751":14,"753":4}}],["mutation",{"0":{"156":1,"751":1},"2":{"156":1,"229":1,"751":1}}],["mutationobserver规范的记录队列实现确保即使是大量的突变事件也不会阻塞浏览器",{"2":{"164":1,"759":1}}],["mutationobserverinit",{"2":{"156":1,"751":1}}],["mutationobserver",{"0":{"150":1,"159":1,"161":1,"745":1,"754":1,"756":1},"1":{"151":1,"152":1,"153":1,"154":1,"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":2,"163":2,"164":2,"746":1,"747":1,"748":1,"749":1,"750":1,"751":1,"752":1,"753":1,"754":1,"755":1,"756":1,"757":2,"758":2,"759":2},"2":{"43":1,"153":2,"155":2,"156":2,"157":2,"158":4,"159":4,"160":2,"748":2,"750":2,"751":2,"752":2,"753":4,"754":4,"755":2}}],["mutated",{"2":{"153":2,"748":2}}],["multicol",{"2":{"575":1}}],["multicast",{"2":{"428":22,"433":2}}],["multiple",{"0":{"518":1},"2":{"718":1}}],["multipart",{"2":{"454":1}}],["multi",{"0":{"158":1,"514":1,"753":1},"2":{"876":1}}],["multirepo",{"2":{"65":1}}],["mdia",{"2":{"476":1}}],["mdn",{"2":{"194":1}}],["md",{"2":{"8":2,"239":2,"338":1,"339":3,"850":2,"857":1,"870":1}}],["md1",{"2":{"8":2}}],["bs",{"2":{"814":1}}],["bfc",{"0":{"574":1,"575":1},"1":{"575":1,"576":1},"2":{"574":2,"575":4,"576":1,"583":1}}],["bfcache",{"2":{"231":1}}],["b24c",{"2":{"428":2}}],["b93a",{"2":{"428":2}}],["b57b",{"2":{"428":2}}],["bgp",{"2":{"427":1}}],["bird",{"2":{"863":2}}],["bitmap",{"2":{"728":1}}],["bill",{"2":{"666":2}}],["bios",{"2":{"423":2}}],["bigint",{"2":{"788":1}}],["big",{"2":{"299":1,"671":1}}],["bin",{"2":{"832":3}}],["bind",{"0":{"806":1},"2":{"168":2,"806":7}}],["binary16",{"2":{"279":1}}],["binarytreenode",{"2":{"20":1}}],["binarysearchtreenode",{"2":{"20":1}}],["binarysearchtree",{"2":{"20":1}}],["bytelength",{"2":{"671":1}}],["byte",{"2":{"432":1}}],["bytes",{"2":{"356":1}}],["by",{"2":{"253":2}}],["brid",{"2":{"863":2}}],["bridge0",{"2":{"428":2}}],["broswers",{"2":{"677":2}}],["broadcast",{"2":{"428":16,"433":2}}],["browser",{"0":{"269":1},"2":{"240":1,"347":2,"349":1,"353":1,"832":1}}],["branch",{"2":{"256":4}}],["break",{"2":{"211":6}}],["btn",{"2":{"195":10}}],["bel",{"2":{"814":1}}],["benjamin",{"2":{"666":2}}],["been",{"2":{"666":2}}],["between",{"0":{"592":1},"2":{"592":2}}],["be",{"2":{"253":4,"806":2,"850":2}}],["bezier",{"2":{"167":1}}],["beforepaste",{"2":{"718":1}}],["beforecut",{"2":{"718":1}}],["beforecopy",{"2":{"718":1}}],["before",{"2":{"633":1,"639":1,"739":2,"841":2}}],["beforeunload",{"2":{"230":1}}],["beforeemit",{"2":{"139":2}}],["beforeassettaggeneration",{"2":{"139":2}}],["b",{"0":{"442":1},"2":{"143":8,"147":2,"156":12,"158":4,"210":8,"211":16,"257":4,"304":4,"305":8,"306":6,"429":3,"439":1,"440":1,"546":1,"548":1,"566":2,"669":10,"672":20,"723":10,"737":10,"751":12,"753":4,"761":10,"776":2,"815":1,"835":2,"847":2,"848":2,"849":2,"859":2,"860":10,"864":4,"865":2,"866":2}}],["bound",{"2":{"806":8,"810":6}}],["border",{"2":{"644":2,"647":2,"718":2}}],["booting",{"2":{"424":2}}],["boot",{"2":{"422":2,"423":1}}],["bootp",{"2":{"422":5,"424":4}}],["bool",{"2":{"218":1,"667":1,"712":1,"716":1}}],["boolean",{"2":{"149":2,"221":4,"222":2,"237":1,"248":2,"309":1,"712":1,"788":1,"844":2,"857":2,"859":1,"860":2,"862":1,"865":1,"872":1}}],["bottom",{"2":{"326":8,"583":3,"586":2,"590":2,"594":2,"718":4}}],["both",{"2":{"167":1,"602":2,"603":1}}],["boxes",{"2":{"326":2}}],["box",{"2":{"326":8,"584":1,"627":2,"628":1}}],["bom",{"0":{"212":1},"1":{"213":1,"214":1,"215":1,"216":1,"217":1,"218":1,"219":1,"220":1,"221":1,"222":1,"223":1,"224":1,"225":1,"226":1,"227":1,"228":1,"229":1,"230":1,"231":1,"232":1,"233":1,"234":1}}],["bold",{"2":{"113":1}}],["body",{"0":{"454":1},"2":{"104":4,"131":4,"134":2,"146":4,"147":8,"155":6,"156":14,"157":6,"158":4,"159":12,"339":4,"675":2,"715":6,"718":5,"750":6,"751":14,"752":6,"753":4,"754":12}}],["bar",{"2":{"666":4,"739":4,"741":2,"797":4}}],["bad",{"0":{"528":1,"541":1}}],["baidu",{"2":{"341":2}}],["basketball",{"2":{"345":1}}],["basevalue",{"2":{"861":2}}],["baseurl",{"0":{"850":1},"2":{"846":1,"850":4,"857":4}}],["base64",{"2":{"494":3}}],["baseline",{"2":{"326":15}}],["base",{"2":{"256":2,"857":2,"862":2}}],["basic",{"0":{"859":1},"2":{"253":2}}],["bashtsc",{"2":{"851":1}}],["bashlo0",{"2":{"428":1}}],["bashls",{"2":{"318":1,"322":1}}],["bashddns",{"2":{"424":1}}],["bashsudo",{"2":{"421":2}}],["bashssh",{"2":{"333":1}}],["bash",{"2":{"339":1,"858":4}}],["basherror",{"2":{"328":1}}],["basheslint",{"2":{"253":1}}],["bashgit",{"2":{"256":1,"259":1,"262":1,"265":1}}],["bashnpm",{"2":{"109":1}}],["babel",{"2":{"238":1,"841":1}}],["backdrop",{"2":{"633":1}}],["back",{"2":{"231":1,"268":1}}],["background",{"2":{"168":2,"616":2,"718":2}}],["backgroundcolor",{"2":{"114":2,"718":2}}],["backwards",{"2":{"167":1}}],["backcolor",{"2":{"113":1}}],["balancefactor",{"2":{"20":1}}],["buf",{"2":{"671":4}}],["buffered",{"2":{"380":2}}],["buffer",{"2":{"206":1,"671":6}}],["bubbles",{"2":{"221":1}}],["button",{"2":{"168":12,"195":8,"226":1}}],["bugs",{"2":{"832":1}}],["bug",{"2":{"64":1,"832":1}}],["bucket",{"2":{"13":2}}],["buckets",{"2":{"13":2}}],["blank",{"2":{"635":1}}],["black",{"2":{"6":1,"16":2,"718":2}}],["blink",{"2":{"347":4}}],["blur",{"2":{"225":2}}],["blue",{"2":{"208":18,"209":8,"618":2}}],["blob",{"0":{"206":1},"2":{"198":1,"200":3,"202":1,"206":3}}],["blockquote",{"0":{"693":1},"2":{"693":4}}],["block",{"2":{"168":1,"326":9,"574":1,"575":1,"602":2,"628":1,"643":3,"644":2,"647":3,"653":1}}],["blocking",{"2":{"56":1,"389":1}}],["sq",{"2":{"852":2}}],["square",{"2":{"852":4}}],["sgr",{"2":{"815":2}}],["s2",{"2":{"667":4}}],["s1",{"2":{"667":6}}],["slash",{"0":{"854":1}}],["slotted",{"2":{"633":1}}],["slice",{"2":{"190":2,"191":2,"206":1,"208":16,"671":1,"806":4,"810":2}}],["svg|a",{"2":{"618":2}}],["svg",{"2":{"618":6}}],["srtp",{"0":{"571":1}}],["srtcp",{"0":{"571":1},"2":{"569":1}}],["srcelement",{"2":{"222":2}}],["src",{"2":{"106":1,"108":1,"252":1,"847":6,"848":8,"849":17,"850":5,"857":10,"858":2}}],["src=",{"2":{"104":2,"402":2,"677":4,"678":6,"679":4,"680":2,"681":8,"682":4,"683":10,"684":2}}],["smtp",{"2":{"471":1,"478":1,"482":1}}],["smart",{"2":{"428":10,"433":1}}],["ssl",{"2":{"459":1,"552":1}}],["ssh",{"2":{"333":1,"471":1}}],["sysmbol",{"2":{"872":1}}],["systemjs",{"0":{"308":1},"2":{"868":1}}],["system",{"2":{"253":2,"470":1,"839":1,"842":4}}],["syntaxerror",{"2":{"737":4,"742":2}}],["sync",{"2":{"309":1}}],["symbol",{"0":{"667":1},"2":{"667":10,"788":1}}],["symbols",{"2":{"642":1}}],["symantec",{"2":{"568":1}}],["skipdefaultlibcheck",{"2":{"854":1}}],["skip",{"2":{"256":2,"259":2}}],["spread",{"2":{"668":2}}],["spec",{"2":{"857":2}}],["specified",{"2":{"850":2}}],["specifies",{"2":{"848":3,"849":4}}],["specific",{"2":{"253":2}}],["specifying",{"2":{"253":2}}],["specify",{"2":{"253":20}}],["spelling",{"2":{"633":1}}],["speed",{"2":{"392":1}}],["spidermonkey",{"2":{"347":1}}],["spawn",{"0":{"328":1},"1":{"329":1,"330":1},"2":{"328":2,"329":1}}],["space",{"0":{"592":1,"593":1},"2":{"326":2,"592":2,"593":2}}],["span2",{"2":{"326":6}}],["span1",{"2":{"326":4}}],["span",{"2":{"114":6,"158":12,"326":18,"575":1,"643":1,"698":6,"753":12}}],["sw",{"2":{"428":2}}],["switching",{"0":{"503":1},"2":{"490":2}}],["switch",{"0":{"524":1},"2":{"211":2,"464":1}}],["sweep",{"2":{"183":1}}],["sayhi",{"2":{"762":2}}],["sayhello",{"2":{"675":6,"679":4,"680":4,"682":2,"684":4}}],["sayage",{"2":{"762":2}}],["sayname",{"2":{"761":24,"762":2}}],["samp",{"0":{"698":1},"2":{"698":4}}],["same",{"2":{"416":1}}],["samesite",{"0":{"402":1},"1":{"403":1},"2":{"402":1}}],["safe",{"2":{"461":1}}],["safari",{"2":{"212":1,"218":1,"225":2,"311":1,"312":1,"347":2,"404":1,"674":1}}],["safari10",{"2":{"196":1}}],["saving",{"2":{"253":2}}],["saturation",{"2":{"210":1}}],["s",{"0":{"872":1},"2":{"210":11,"211":8,"259":4,"263":1,"318":2,"326":2,"666":6,"815":1,"852":4}}],["somelib",{"2":{"871":2}}],["somevalue",{"2":{"859":6}}],["so",{"2":{"814":1}}],["solid",{"2":{"644":2,"647":2,"718":2}}],["sob",{"2":{"345":1}}],["softbind",{"2":{"810":4}}],["softlink",{"2":{"318":6}}],["soft",{"0":{"315":1},"1":{"316":1,"317":1,"318":1},"2":{"265":2,"266":1}}],["soruce",{"2":{"263":1}}],["sourceroots",{"2":{"857":2}}],["source=",{"2":{"262":6}}],["sourcetype",{"2":{"237":1}}],["sourceurl=webpack",{"2":{"147":2}}],["source",{"2":{"131":2,"144":8,"147":4,"250":1,"263":1,"419":2,"716":2,"857":2}}],["socekt",{"2":{"106":1}}],["socketserver",{"2":{"106":6}}],["socket",{"0":{"484":1,"485":1},"1":{"485":1,"486":2,"487":2,"488":1,"489":1,"490":1,"491":1,"492":1,"493":1,"494":1},"2":{"106":5,"485":1,"487":2,"819":1,"826":2}}],["sockjsclient",{"2":{"106":2}}],["sockjs",{"2":{"106":6,"107":2}}],["schema",{"2":{"857":2}}],["scheme",{"2":{"149":2}}],["scope",{"2":{"635":1}}],["scopeid",{"2":{"428":12}}],["sctp",{"0":{"572":1},"2":{"569":1,"572":1}}],["scale",{"2":{"234":1}}],["scale=1",{"2":{"131":2,"146":2,"147":4}}],["scanvenge",{"2":{"182":1}}],["scream",{"2":{"345":1}}],["screeny",{"2":{"226":1}}],["screenx",{"2":{"226":1}}],["scrollleft",{"2":{"718":1}}],["scrollwidth",{"2":{"718":1}}],["scrollby",{"2":{"717":1}}],["scrolltop",{"2":{"718":7}}],["scrollto",{"2":{"717":1}}],["scrollintoview",{"2":{"717":2}}],["scrollrestoration",{"2":{"268":1}}],["scroll",{"2":{"188":2,"224":1,"359":1}}],["scrollheight",{"2":{"168":1,"718":1}}],["script=greek",{"2":{"666":2}}],["script｜link｜x",{"2":{"139":2}}],["scripts",{"2":{"108":1}}],["script",{"0":{"310":1},"1":{"311":1,"312":1,"313":1},"2":{"104":4,"131":2,"134":2,"147":2,"168":16,"224":2,"237":1,"675":4,"677":8,"678":12,"679":19,"680":8,"681":20,"682":12,"683":20,"684":8,"713":4,"717":16}}],["scripting",{"2":{"68":1}}],["sum",{"2":{"683":1}}],["supertype",{"2":{"762":25}}],["super",{"2":{"670":6,"864":2,"876":4,"877":2}}],["support",{"0":{"626":1},"2":{"677":2}}],["sudo",{"2":{"421":4}}],["subtype",{"2":{"762":28}}],["subtree",{"2":{"151":1,"160":3,"746":1,"755":3}}],["submit",{"2":{"718":1}}],["subnet",{"2":{"424":4,"545":1,"550":1}}],["subdir",{"2":{"309":1}}],["suggestion",{"2":{"253":2}}],["suggestnextcharacters",{"2":{"14":1}}],["surroundcontents",{"2":{"114":2}}],["sticky",{"2":{"575":1,"666":5}}],["stf0",{"2":{"428":2}}],["stp",{"2":{"427":1,"428":2}}],["stylish",{"2":{"253":2}}],["style1",{"2":{"850":2}}],["style=",{"2":{"188":8}}],["style",{"0":{"357":1,"623":1,"642":1,"659":1},"2":{"114":2,"168":28,"188":2,"224":1,"326":4,"424":2,"591":4,"592":4,"593":4,"594":8,"595":4,"599":4,"641":2,"701":1,"718":15,"850":2}}],["stdin",{"2":{"253":10}}],["str",{"2":{"775":4}}],["strong",{"0":{"692":1}}],["stroke",{"2":{"618":4}}],["strictnullcheckslet",{"2":{"859":1}}],["strictnullchecks",{"2":{"837":1,"859":1}}],["strict",{"2":{"402":1,"575":1,"661":1,"775":2,"801":4}}],["stringvalidator",{"2":{"852":2}}],["string",{"2":{"160":2,"167":2,"201":1,"203":3,"221":1,"222":1,"227":1,"237":1,"253":32,"268":1,"271":1,"304":2,"309":1,"640":1,"641":3,"755":2,"788":1,"832":2,"837":2,"842":4,"843":4,"852":2,"859":7,"860":14,"862":1,"865":2,"866":4,"870":2,"872":1,"876":4}}],["stream",{"2":{"206":1,"572":1}}],["stoppropagation",{"2":{"221":1}}],["stopimmediatepropagation",{"2":{"221":1}}],["stopindex++",{"2":{"191":2}}],["stopindex",{"2":{"190":2,"191":8}}],["stop",{"2":{"184":1,"189":1,"191":1}}],["step",{"2":{"167":3}}],["steps",{"2":{"167":1}}],["staged",{"2":{"262":6,"263":1}}],["starttime",{"2":{"380":2}}],["starttimer",{"2":{"98":10}}],["startmeta",{"2":{"191":6}}],["startindex",{"2":{"190":12,"191":8}}],["startnpm",{"2":{"109":1}}],["start",{"0":{"594":1},"2":{"56":1,"82":8,"86":10,"92":8,"98":2,"109":3,"167":1,"188":2,"189":1,"190":2,"191":3,"598":1,"860":4}}],["state",{"2":{"167":1,"268":3,"876":2}}],["stats",{"2":{"104":2}}],["status",{"0":{"514":1},"2":{"44":1,"500":1}}],["static",{"2":{"20":1}}],["shift",{"2":{"391":1,"764":2}}],["shiftkey",{"2":{"226":1}}],["shown",{"2":{"635":1}}],["show",{"2":{"253":2,"256":2}}],["should",{"2":{"98":2,"253":2}}],["shouldinvoke",{"2":{"98":8}}],["shapes",{"2":{"852":4}}],["sha1",{"2":{"494":2}}],["sha",{"2":{"494":1}}],["sharing",{"2":{"405":1}}],["shareddata",{"2":{"249":2}}],["shaking",{"2":{"50":1,"65":1}}],["shelljs",{"2":{"240":1}}],["side",{"0":{"840":1},"2":{"742":2}}],["since",{"2":{"522":1}}],["single",{"2":{"151":1,"354":1,"746":1}}],["singleentryplugin",{"2":{"143":2}}],["simplex",{"2":{"428":14,"433":1}}],["si",{"0":{"392":1},"2":{"814":1}}],["site",{"2":{"68":1,"354":2,"402":1}}],["size",{"0":{"649":1,"657":1},"2":{"13":4,"131":2,"191":10,"206":1,"618":2,"630":2,"649":5,"655":3,"661":1,"668":2,"718":1}}],["sequences",{"0":{"812":1},"1":{"813":1,"814":1,"815":1}}],["seo语义化",{"0":{"685":1},"1":{"686":1,"687":1,"688":1,"689":1,"690":1,"691":1,"692":1,"693":1,"694":1,"695":1,"696":1,"697":1,"698":1,"699":1}}],["self",{"0":{"594":1},"2":{"806":6}}],["selector",{"2":{"852":2}}],["selected",{"2":{"718":1}}],["selectedindex",{"2":{"718":1}}],["selected||td",{"2":{"616":2}}],["select",{"2":{"224":1}}],["selection",{"2":{"114":6,"195":2,"633":1}}],["selectallchildren",{"2":{"114":1}}],["selectall",{"2":{"113":1}}],["see",{"0":{"521":1}}],["security",{"2":{"701":1}}],["secured",{"2":{"428":2}}],["secure",{"0":{"401":1}}],["secret",{"2":{"554":2,"559":1,"563":1}}],["sec",{"0":{"493":2},"2":{"490":6,"494":6}}],["session",{"2":{"473":1}}],["search",{"2":{"271":2,"382":1}}],["send",{"2":{"106":2}}],["sentry",{"0":{"28":1},"2":{"23":1}}],["servre",{"2":{"487":1}}],["service",{"0":{"332":1,"542":1},"1":{"333":1},"2":{"50":1,"553":1,"554":2,"555":1,"559":1,"560":1,"563":1}}],["servers",{"2":{"102":2,"104":2,"106":2,"108":1}}],["server",{"0":{"539":1},"2":{"23":1,"102":6,"104":2,"106":7,"422":2,"424":6,"425":1}}],["setimmeidate",{"2":{"819":1,"829":1}}],["setimmediate",{"0":{"827":1,"829":1},"2":{"819":3,"824":3,"825":3,"827":2}}],["setimmediated",{"2":{"819":1}}],["setinterval",{"2":{"730":1,"819":1,"821":1}}],["setprototypeof",{"2":{"762":1}}],["setproperty",{"2":{"718":1}}],["setclipboardtext",{"2":{"718":2}}],["settings",{"0":{"249":1},"2":{"249":2}}],["settimeout",{"0":{"827":1},"2":{"76":2,"79":2,"82":2,"89":2,"92":4,"98":2,"157":2,"159":4,"168":1,"730":2,"752":2,"754":4,"797":2,"819":1,"821":3,"827":1}}],["setdata",{"2":{"195":2,"197":1,"718":5}}],["setattribute",{"2":{"158":4,"716":1,"753":4}}],["setattributens",{"2":{"156":4,"751":4}}],["setattrbute",{"2":{"156":2,"751":2}}],["setright",{"2":{"20":1}}],["setleft",{"2":{"20":1}}],["setvalue",{"2":{"20":1}}],["set",{"0":{"17":1,"668":1},"2":{"13":1,"16":4,"421":2,"668":12}}],["csi",{"0":{"815":1},"2":{"815":16}}],["cssvaluetype",{"2":{"718":1}}],["cssvalue",{"2":{"718":1}}],["csstext",{"2":{"718":8}}],["cssul",{"2":{"644":1,"647":1,"649":1,"650":1,"651":1}}],["csscol",{"2":{"616":1}}],["css2",{"2":{"579":1}}],["cssom",{"0":{"372":1},"2":{"357":1}}],["css文件下载完毕",{"2":{"230":1}}],["css文件等外部资源",{"2":{"224":1}}],["cssjs",{"0":{"165":1},"1":{"166":1,"167":1,"168":1}}],["css自由处理",{"2":{"145":2}}],["css",{"0":{"145":1,"167":1,"325":1,"575":1,"604":1,"627":1},"1":{"326":1,"605":1,"606":1,"607":1,"608":1,"609":1,"610":1,"611":1,"612":1,"613":1,"614":1,"615":1,"616":1,"617":1,"618":1,"619":1,"620":1,"621":1,"622":1,"623":1,"624":1,"625":1,"626":1,"628":1,"629":1,"630":1},"2":{"167":1,"168":3,"208":2,"326":1,"351":1,"369":1,"381":2,"580":1,"590":1,"599":2,"602":1,"618":1,"620":1,"637":4,"652":1,"655":1,"659":1,"850":6}}],["cc",{"2":{"672":2}}],["center",{"0":{"594":1}}],["cell",{"2":{"575":1,"628":1}}],["ceil",{"2":{"190":2}}],["c5ab0dc85b11",{"2":{"494":1}}],["c1",{"2":{"428":2,"812":3}}],["c0",{"2":{"428":4,"812":3,"814":1}}],["cfg",{"2":{"425":1}}],["cmd",{"2":{"254":1,"256":4}}],["cwd",{"2":{"253":2}}],["ctrlkey",{"2":{"226":1}}],["ctx",{"2":{"98":4,"301":4}}],["c",{"0":{"443":1},"2":{"143":4,"147":2,"156":2,"253":2,"429":3,"439":1,"440":1,"546":1,"548":1,"669":8,"672":16,"723":2,"737":4,"751":2,"761":4,"815":1,"854":12,"860":16,"866":4,"874":8}}],["cue",{"2":{"633":1}}],["cumulative",{"2":{"391":1}}],["curly",{"2":{"244":2}}],["currnt",{"2":{"877":2}}],["currnode",{"2":{"19":12}}],["curried",{"2":{"810":8}}],["current",{"2":{"256":2,"635":1}}],["currenttarget",{"2":{"221":2}}],["curoffset",{"2":{"191":6}}],["cubic",{"2":{"167":1}}],["cut",{"2":{"113":1,"718":1}}],["cr",{"2":{"814":1}}],["crypto",{"2":{"494":2}}],["credentials",{"0":{"408":1},"2":{"683":2}}],["createref",{"2":{"877":2}}],["createrange",{"2":{"115":1}}],["createinstancewithproto",{"2":{"764":4}}],["createinstance",{"2":{"764":4}}],["createanother",{"2":{"762":2}}],["create",{"2":{"762":3,"810":2,"866":4}}],["createobject",{"2":{"761":2}}],["createtextnode",{"2":{"716":1}}],["createdocumentfragment",{"2":{"716":1}}],["created",{"0":{"508":1}}],["createhash",{"2":{"494":4}}],["createhtmlwebpackpluginhooks",{"2":{"139":2}}],["createcomment",{"2":{"716":1}}],["createcontext",{"2":{"147":2,"876":3}}],["createchildcompiler",{"0":{"141":1},"2":{"132":1,"143":2}}],["createelement",{"2":{"114":2,"158":4,"168":2,"675":2,"716":1,"718":2,"753":4}}],["createlinkt",{"2":{"113":1}}],["createsocketserver",{"2":{"106":2}}],["createserver",{"2":{"102":2,"106":2}}],["crp",{"2":{"369":1}}],["critial",{"2":{"369":1}}],["crossorigin=",{"2":{"683":2}}],["crossorigin",{"0":{"313":1,"683":1},"2":{"683":4}}],["cross",{"2":{"68":1,"402":1,"405":1}}],["capture",{"2":{"712":1,"713":2}}],["cas",{"2":{"568":2}}],["case",{"2":{"211":6,"326":2}}],["ca",{"0":{"562":1,"565":1},"1":{"563":1,"564":1,"565":1,"566":1,"567":1},"2":{"564":4,"565":2,"566":2,"567":1,"568":4}}],["carakan",{"2":{"347":1}}],["cat",{"2":{"318":2,"322":2}}],["catch",{"2":{"200":2,"201":2,"202":2,"203":2,"669":2}}],["cachcable",{"2":{"461":1}}],["caching",{"2":{"253":2}}],["cache",{"2":{"231":1,"253":12}}],["candidate",{"2":{"380":2}}],["cancelbubble",{"2":{"222":1}}],["cancelable",{"2":{"221":2}}],["cancel",{"2":{"95":1,"98":6}}],["canvas",{"2":{"52":1,"638":1}}],["callable",{"2":{"806":2}}],["callee",{"2":{"718":6,"797":2}}],["callbacks",{"0":{"822":1,"826":1},"2":{"820":2}}],["callback",{"0":{"156":1,"751":1},"2":{"131":4,"138":1,"139":1,"143":2,"145":2,"819":2}}],["call",{"2":{"76":2,"98":2,"190":2,"191":2,"669":4,"762":4,"764":2,"803":6,"806":4,"810":2}}],["cd",{"2":{"60":1}}],["cdn",{"2":{"50":1}}],["cite",{"0":{"693":1},"2":{"693":4}}],["cidr",{"2":{"421":1,"429":2,"551":1}}],["ci",{"2":{"60":1}}],["cpu",{"0":{"725":1},"2":{"48":1,"725":2}}],["clone",{"2":{"762":6}}],["clonenode",{"2":{"716":1}}],["close",{"0":{"826":1},"2":{"640":2,"819":2,"820":1,"826":2}}],["clock1",{"2":{"345":1}}],["cleardata",{"2":{"718":1}}],["clearfix",{"0":{"602":1},"2":{"583":3}}],["clear",{"0":{"596":1,"601":1,"603":1},"1":{"597":1,"598":1,"599":1,"600":1,"601":1,"602":2,"603":2},"2":{"575":2,"602":2,"651":1,"668":2}}],["cleartimeout",{"2":{"76":2,"79":2,"82":2,"89":2,"92":4}}],["cls",{"0":{"391":1}}],["clap",{"2":{"345":1}}],["classes",{"0":{"864":1},"2":{"860":1}}],["classic",{"0":{"847":1}}],["classless",{"2":{"551":1}}],["classlist",{"2":{"168":16,"717":1}}],["class=",{"2":{"188":6,"326":6,"591":4,"592":8,"593":8,"594":18,"595":6,"646":32}}],["classname",{"2":{"155":2,"156":6,"157":4,"159":6,"750":2,"751":6,"752":4,"754":6}}],["class",{"0":{"670":1},"2":{"12":2,"13":1,"131":2,"135":1,"143":2,"155":2,"750":2,"852":6,"854":2,"860":1,"864":1,"866":3,"869":1,"874":5,"876":4,"877":1}}],["clip",{"2":{"359":1}}],["clipboarditem",{"0":{"198":1},"2":{"196":1,"200":3,"202":3}}],["clipboard",{"0":{"196":1,"199":1},"1":{"197":1,"198":1,"199":1,"200":2,"201":2,"202":2,"203":2},"2":{"196":2,"198":2,"200":4,"201":2,"202":2,"203":2}}],["clipboarddata",{"2":{"195":2,"718":17}}],["clipboardevent",{"0":{"197":1},"2":{"195":2}}],["cli",{"0":{"253":1,"858":1},"2":{"832":2}}],["cli时是会忽略配置的文件",{"2":{"252":1}}],["click",{"2":{"168":4,"218":2,"219":2,"226":3,"234":1,"713":8}}],["clienty",{"2":{"226":1}}],["clientx",{"2":{"226":1}}],["clients",{"2":{"106":5,"108":1}}],["client",{"2":{"23":1,"106":2,"107":1,"424":2,"487":1,"553":1,"554":2,"555":1,"559":1,"560":1,"563":1}}],["core",{"2":{"857":6}}],["cors",{"0":{"405":1,"406":1},"1":{"406":1,"407":2,"408":2,"409":2,"410":2,"411":2,"412":2,"413":2,"414":2,"415":2,"416":1,"417":1,"418":1,"419":1},"2":{"406":1,"682":6}}],["co",{"2":{"669":1}}],["cost",{"2":{"428":4}}],["cookie",{"0":{"404":1},"2":{"394":3,"395":5,"396":3,"399":2,"400":2,"403":1,"404":2}}],["cookies",{"0":{"393":1},"1":{"394":1,"395":1,"396":1,"397":1,"398":1,"399":1,"400":1,"401":1,"402":1,"403":1,"404":1},"2":{"683":2}}],["coffee",{"2":{"345":1}}],["code",{"0":{"698":1},"2":{"253":4,"500":1,"698":4,"715":6}}],["count++",{"2":{"797":4}}],["counters",{"0":{"641":1},"2":{"640":1,"641":2,"659":1}}],["counter",{"0":{"623":1,"641":1},"2":{"640":1,"860":14}}],["count",{"2":{"167":1,"575":1,"797":4}}],["col",{"2":{"616":1,"635":2}}],["column",{"2":{"575":3,"594":2,"595":2}}],["color",{"2":{"149":2,"168":2,"208":16,"253":6,"616":2,"718":2,"859":2,"876":10}}],["collapsetostart",{"2":{"114":1}}],["collapsetoend",{"2":{"114":1}}],["collapse",{"2":{"114":1}}],["copybind",{"2":{"195":6}}],["copy",{"2":{"113":1,"195":14,"200":2,"201":2,"718":1}}],["copynode",{"2":{"20":1}}],["comodo",{"2":{"568":1}}],["com",{"2":{"268":1,"271":3,"341":2,"419":12}}],["common",{"2":{"672":2}}],["commonjs",{"0":{"305":1,"672":1},"2":{"240":1,"300":1,"672":5,"839":1,"853":1,"857":4}}],["communications",{"2":{"469":1}}],["comments",{"2":{"253":4}}],["commit",{"0":{"361":1},"2":{"60":1,"255":1,"259":2,"265":2}}],["comnent",{"2":{"160":1,"755":1}}],["component",{"2":{"876":8,"877":2}}],["composite",{"2":{"857":2}}],["compositorframe",{"2":{"353":1,"367":1,"368":1}}],["compositor",{"2":{"350":1,"353":1,"359":1,"361":2,"362":1,"363":1,"365":1,"366":1,"367":1}}],["compositing",{"0":{"362":1},"2":{"349":2}}],["compositionend",{"2":{"116":1,"228":1}}],["compositionupdate",{"2":{"116":1,"228":1}}],["compositionstart",{"2":{"116":1,"228":1}}],["computestyle",{"2":{"357":1}}],["compute",{"0":{"332":1},"1":{"333":1}}],["computed",{"2":{"326":2,"865":1}}],["complete",{"2":{"230":1}}],["compatible",{"2":{"701":1}}],["compatmode",{"2":{"224":1}}],["compact",{"2":{"183":1}}],["compileonsave",{"2":{"857":2}}],["compiledtemplate",{"2":{"143":4}}],["compiletmplatepromise",{"2":{"143":2,"145":4}}],["compileroptions",{"2":{"850":4,"857":2}}],["compilername",{"2":{"143":2}}],["compiler子实例",{"2":{"141":1}}],["compiler",{"0":{"136":1,"137":1,"138":1,"139":1},"1":{"137":1,"138":1,"139":1},"2":{"104":7,"106":1,"131":4,"132":5,"135":2,"137":1,"143":6}}],["compilatoin",{"2":{"132":1}}],["compilation",{"2":{"131":4,"137":2,"138":2,"139":2,"141":1,"143":10,"145":6}}],["conditional",{"2":{"837":1}}],["concat",{"2":{"806":2,"810":2}}],["conncet",{"2":{"461":1}}],["connections",{"2":{"820":1}}],["connection",{"2":{"490":4}}],["connect",{"0":{"459":1},"2":{"461":1}}],["contributors",{"2":{"832":1}}],["control",{"0":{"407":1,"408":1,"409":1,"410":1,"411":1,"412":1,"413":1,"414":1},"2":{"467":1,"476":2,"478":1,"571":1,"572":1}}],["continue",{"0":{"502":1},"2":{"256":2,"259":2}}],["contain",{"0":{"656":1},"1":{"657":1,"658":1,"659":1,"660":1,"661":1},"2":{"575":1,"655":3,"658":1,"661":4}}],["containers",{"2":{"575":1}}],["container",{"2":{"168":24,"188":4,"591":4,"592":4,"593":4,"594":8,"595":4,"655":2}}],["containsnode",{"2":{"114":1}}],["contains",{"2":{"20":2,"717":2}}],["contexttype",{"2":{"876":2}}],["contexttypes",{"2":{"876":2}}],["context2",{"2":{"876":4}}],["context1",{"2":{"876":4}}],["contextmenu",{"2":{"230":1}}],["context",{"0":{"309":1,"876":1},"2":{"143":2,"309":3,"574":1,"577":1,"635":1,"876":18}}],["contentwindow",{"2":{"419":1}}],["contentful",{"2":{"379":1,"380":6,"384":1}}],["content",{"0":{"511":1,"512":1,"513":1,"591":1,"639":1,"655":1},"1":{"640":1,"641":1},"2":{"143":2,"352":2,"482":1,"575":1,"595":4,"602":2,"639":1,"641":1,"655":2,"661":2,"701":5}}],["content=",{"2":{"131":2,"146":2,"147":4,"701":1}}],["contenteditable",{"2":{"111":1}}],["configurable",{"2":{"762":1}}],["configuration",{"2":{"253":10,"420":1}}],["config",{"2":{"104":2,"106":1,"144":2,"253":12}}],["consumer",{"2":{"876":6}}],["console",{"2":{"98":14,"153":2,"155":4,"156":2,"157":2,"158":2,"159":6,"200":6,"201":4,"202":4,"203":4,"246":6,"339":2,"380":2,"382":1,"668":4,"684":2,"713":8,"748":2,"750":4,"751":2,"752":2,"753":2,"754":6,"761":18,"762":6,"763":2,"775":2,"776":2,"797":2,"801":2,"802":4,"803":2,"866":2,"874":2}}],["const",{"0":{"663":1},"2":{"98":16,"139":1,"143":4,"147":11,"168":2,"217":2,"218":2,"219":2,"223":4,"380":2,"399":2,"494":5,"666":10,"669":2,"671":6,"675":2,"713":4,"842":2,"852":2,"862":1,"865":2,"876":1,"877":2}}],["constructorparameters",{"2":{"838":1}}],["constructor",{"0":{"764":1},"2":{"13":2,"761":4,"762":2,"764":13,"876":4,"877":2}}],["choices",{"0":{"518":1}}],["chromium",{"0":{"346":1,"348":1},"1":{"347":1,"348":1,"349":2,"350":2,"351":2,"352":2,"353":2,"354":1,"355":1,"356":1,"357":1,"358":1,"359":1,"360":1,"361":1,"362":1,"363":1,"364":1,"365":1,"366":1,"367":1,"368":1},"2":{"347":6}}],["chrome85+",{"2":{"655":1}}],["chrome",{"2":{"208":2,"212":1,"218":1,"225":2,"311":1,"312":1,"347":2,"382":1,"656":1,"674":1}}],["chrome58+",{"2":{"196":1}}],["checks",{"2":{"860":1}}],["checked",{"2":{"635":1}}],["check",{"0":{"825":1},"2":{"253":2,"819":2,"820":1}}],["channel",{"2":{"428":12}}],["changing",{"2":{"253":2}}],["changes",{"2":{"253":2}}],["changed",{"2":{"155":4,"157":4,"159":6,"253":2,"750":4,"752":4,"754":6}}],["chakra",{"2":{"347":2}}],["charset",{"0":{"619":1},"2":{"701":1,"718":1}}],["charset=",{"2":{"131":2,"146":2,"147":4}}],["charcode",{"2":{"227":1}}],["characters",{"2":{"356":1}}],["characterdataoldvalue",{"2":{"160":3,"755":3}}],["characterdata",{"2":{"156":2,"160":3,"751":2,"755":3}}],["character",{"2":{"14":1}}],["childcontexttypes",{"2":{"876":2}}],["childcompilaton",{"2":{"143":4}}],["childcompiler",{"0":{"140":1,"143":1},"1":{"141":1},"2":{"137":2,"143":8}}],["childelementcount",{"2":{"717":1}}],["child2",{"2":{"713":2}}],["child1",{"2":{"713":18}}],["child",{"2":{"635":5,"876":10}}],["childlist",{"2":{"156":6,"160":3,"751":6,"755":3}}],["childnodes",{"2":{"151":1,"717":1,"746":1}}],["children",{"2":{"14":1,"717":1}}],["表达式",{"0":{"741":1}}],["表达层",{"0":{"472":1}}],["表格单元格",{"2":{"575":1}}],["表格类",{"0":{"344":1}}],["表明已经接受客户机的选择",{"2":{"422":1}}],["表单的名称",{"2":{"718":1}}],["表单中控件的数量",{"2":{"718":1}}],["表单中所有控件的集合",{"2":{"718":1}}],["表单脚本",{"2":{"718":1}}],["表单",{"2":{"402":2}}],["表情类",{"0":{"345":1}}],["表示捕获阶段",{"2":{"712":1}}],["表示冒泡阶段",{"2":{"712":1}}],["表示上一个",{"2":{"669":1}}],["表示服务器无法完成明显有效的请求",{"2":{"538":1}}],["表示协议切换",{"2":{"490":1}}],["表示方法",{"0":{"486":1}}],["表示本地网络",{"2":{"446":1}}],["表示",{"2":{"432":1}}],["表示元素已经被用户操作",{"2":{"224":1}}],["表示人为因素",{"2":{"221":1}}],["表示已经调用了",{"2":{"221":1}}],["表示在冒泡阶段调用事件处理程序",{"2":{"218":1}}],["表示在捕获阶段调用事件处理程序",{"2":{"218":1}}],["表示返回正常键盘输入状态",{"2":{"116":1}}],["表示要开始输入了",{"2":{"116":1}}],["表示选区的起点和终点是否重合",{"2":{"114":1}}],["表示法",{"0":{"0":1},"1":{"1":1,"2":1}}],["表",{"0":{"13":1}}],["hybrid",{"2":{"860":1}}],["hypertext",{"2":{"450":1}}],["h6",{"2":{"688":1}}],["hgroup",{"0":{"688":1},"2":{"688":1}}],["hi",{"2":{"717":8,"762":2}}],["hints",{"0":{"505":1}}],["hit",{"2":{"351":1,"352":1}}],["hidden",{"2":{"326":7,"654":1,"655":1,"717":2}}],["history对象中长度length属性保持不变",{"2":{"271":1}}],["history",{"0":{"267":1,"268":1},"1":{"268":1,"269":1,"270":1,"271":1},"2":{"268":6,"271":1}}],["hue2rgb",{"2":{"210":8}}],["hue",{"2":{"210":1}}],["h",{"2":{"210":15,"211":14,"253":2,"815":1}}],["hsl2rgb",{"2":{"210":2}}],["hsl",{"0":{"210":1,"211":1},"2":{"210":1}}],["hwp",{"0":{"131":1,"133":1,"140":1,"142":1},"1":{"132":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":2,"143":1,"144":1,"145":1,"146":1,"147":1},"2":{"130":1,"131":2,"132":3,"136":1,"137":1,"140":1,"143":6}}],["href=",{"2":{"402":2}}],["href",{"2":{"271":2}}],["hr",{"0":{"690":1},"2":{"113":1}}],["h2",{"0":{"688":1},"2":{"113":1}}],["h1",{"0":{"688":1},"2":{"113":1,"688":1}}],["htmloptionelement",{"2":{"718":1}}],["htmlselectelement",{"2":{"718":1}}],["htmlformelement",{"2":{"718":1}}],["htmlcollection",{"2":{"716":1,"718":1}}],["htmldivelement",{"2":{"715":2}}],["htmldocument",{"2":{"715":4}}],["htmlbodyelement",{"2":{"715":4}}],["htmlheadelement",{"2":{"715":2}}],["htmlhtmlelement",{"2":{"715":1}}],["htmlelement",{"2":{"715":9}}],["htmlevents",{"2":{"223":4}}],["html语义化标签你知道多少",{"2":{"685":1}}],["html语义",{"2":{"685":1}}],["html|a",{"2":{"618":2}}],["html5事件",{"0":{"230":1}}],["html模板中",{"2":{"145":2}}],["html$",{"2":{"144":2}}],["htmlwebpackplugin",{"2":{"134":4,"135":2,"146":2,"147":4}}],["htmlwepbackplugin",{"0":{"130":1},"1":{"131":1,"132":1,"133":1,"134":1,"135":1,"136":1,"137":1,"138":1,"139":1,"140":1,"141":1,"142":1,"143":1,"144":1,"145":1,"146":1,"147":1}}],["html",{"0":{"144":1,"146":1,"216":1,"573":1,"700":1},"1":{"147":1,"574":1,"575":1,"576":1,"577":1,"578":1,"579":1,"580":1,"581":1,"582":1,"583":1,"701":1},"2":{"104":3,"106":1,"107":1,"113":1,"130":2,"131":14,"132":1,"134":5,"137":5,"139":1,"142":1,"143":6,"144":2,"145":2,"146":7,"147":26,"168":4,"188":1,"195":1,"216":1,"269":2,"304":2,"326":1,"339":5,"351":1,"369":1,"591":1,"592":1,"593":1,"594":1,"595":1,"599":3,"618":4,"643":2,"644":1,"646":1,"648":1,"675":1,"677":2,"678":1,"679":1,"680":1,"681":1,"682":1,"683":1,"684":1,"689":1,"693":1,"694":1,"698":1,"701":1,"713":1,"715":3,"718":6,"850":2}}],["http1",{"2":{"459":1,"501":1}}],["httponly",{"0":{"403":1},"2":{"402":1,"403":1}}],["https",{"0":{"552":1},"1":{"553":1,"554":1,"555":1,"556":1,"557":1,"558":1,"559":1,"560":1,"561":1,"562":1,"563":1,"564":1,"565":1,"566":1,"567":1,"568":1},"2":{"271":1,"341":2,"401":1,"427":1,"471":1,"559":1,"682":6,"683":4}}],["http3",{"2":{"50":1}}],["http2",{"2":{"50":1}}],["http",{"0":{"450":1,"495":1,"500":1,"510":1},"1":{"451":1,"452":1,"453":1,"454":1,"455":1,"456":1,"457":1,"458":1,"459":1,"460":1,"461":1,"496":1,"497":1,"498":1,"499":1,"501":1,"502":1,"503":1,"504":1,"505":1,"506":1,"507":1,"508":1,"509":1,"510":1,"511":1,"512":1,"513":1,"514":1,"515":1,"516":1,"517":1,"518":1,"519":1,"520":1,"521":1,"522":1,"523":1,"524":1,"525":1,"526":1,"527":1,"528":1,"529":1,"530":1,"531":1,"532":1,"533":1,"534":1,"535":1,"536":1,"537":1,"538":1,"539":1,"540":1,"541":1,"542":1,"543":1,"544":1},"2":{"42":1,"50":1,"101":1,"102":2,"104":1,"106":2,"196":1,"271":1,"393":1,"394":1,"405":2,"409":1,"410":1,"411":1,"413":1,"414":1,"419":12,"427":1,"433":1,"459":1,"471":1,"482":1,"488":1,"489":1,"490":4,"500":1,"505":1,"552":2,"618":4,"701":3,"718":1,"730":1,"843":2}}],["homepage",{"2":{"832":1}}],["hodor",{"2":{"666":4}}],["hover",{"2":{"635":1}}],["horizontal",{"2":{"580":1}}],["holdcnt",{"2":{"428":2}}],["host",{"2":{"271":1,"416":1,"420":1,"429":1,"490":2,"635":3}}],["hostname",{"2":{"102":2,"271":2}}],["hook",{"2":{"137":2,"138":1,"139":1}}],["hooks以及它使用在插件中的作用",{"2":{"136":1}}],["hooks",{"0":{"137":1,"138":1,"139":1},"2":{"60":1,"106":3,"131":2,"137":1,"139":1,"143":2,"145":4}}],["hand",{"2":{"742":2}}],["handling",{"2":{"253":2}}],["handler",{"2":{"352":1,"712":1}}],["handleentries",{"2":{"143":4}}],["handle",{"2":{"98":4,"135":2,"876":2}}],["have",{"2":{"326":2,"666":2}}],["hardlink",{"2":{"318":6,"322":4}}],["hard",{"0":{"319":1},"1":{"320":1,"321":1,"322":1},"2":{"265":2,"266":2}}],["hasfeature",{"2":{"223":4}}],["has",{"2":{"13":1,"155":2,"271":1,"326":4,"635":1,"668":4,"750":2,"876":2}}],["hash字符串",{"2":{"232":1}}],["hash获取url",{"2":{"232":1}}],["hashchange",{"0":{"232":1},"2":{"270":3}}],["hashtable",{"2":{"13":2,"14":1}}],["hash",{"0":{"13":1,"270":1},"2":{"13":1,"270":1,"271":3,"565":1,"566":1}}],["hell",{"2":{"762":2,"803":2}}],["hellotime",{"2":{"428":2}}],["hello",{"2":{"147":4,"155":2,"157":2,"159":2,"216":2,"217":2,"249":2,"338":2,"339":8,"342":3,"419":2,"666":6,"669":2,"672":2,"684":8,"698":9,"750":2,"752":2,"754":2,"761":10,"762":1,"764":4,"802":10,"803":6,"859":2,"863":2}}],["helpers",{"2":{"349":1,"352":1}}],["help",{"2":{"253":4}}],["hex80",{"2":{"812":1}}],["hex00",{"2":{"812":1}}],["hex2rgba",{"2":{"208":2}}],["hex2rgb",{"2":{"208":2}}],["hex",{"2":{"208":19,"209":3}}],["here",{"2":{"131":2,"135":2,"736":6,"737":6,"876":2}}],["header",{"2":{"482":1,"493":1,"701":1}}],["headers",{"0":{"406":1,"409":1,"411":1,"413":1},"1":{"407":1,"408":1,"409":1,"410":1,"411":1,"412":1,"413":1,"414":1,"415":1},"2":{"405":1,"406":1,"494":2}}],["head~1",{"2":{"263":1}}],["head",{"0":{"452":1},"2":{"131":4,"134":2,"146":4,"147":8,"257":1,"264":1,"339":4,"461":3,"715":5}}],["heapifydown",{"2":{"12":2}}],["heapifyup",{"2":{"12":2}}],["heap",{"2":{"12":2}}],["height",{"0":{"629":1},"1":{"630":1},"2":{"20":1,"168":2,"188":4,"190":4,"191":12,"583":6,"586":3,"595":2,"718":4}}],["void",{"2":{"842":4,"859":5,"860":2,"861":1,"872":2}}],["vt",{"2":{"814":1}}],["vlsm",{"2":{"550":1,"551":1}}],["vlan",{"2":{"427":1}}],["vuepress",{"0":{"336":1},"1":{"337":1,"338":1,"339":1,"340":1,"341":1,"342":1,"343":1,"344":1,"345":1},"2":{"338":2}}],["verticla",{"2":{"580":1}}],["vertical无效",{"2":{"651":1}}],["vertical",{"0":{"628":1},"2":{"326":4,"580":1}}],["version",{"2":{"253":4,"490":2,"832":1}}],["validation",{"2":{"852":4}}],["valid",{"2":{"635":1}}],["value=",{"2":{"876":6}}],["values",{"2":{"668":2}}],["value",{"2":{"326":2,"668":1,"669":15,"718":8,"736":6,"737":6,"762":1,"865":1,"876":7}}],["variable",{"2":{"550":1}}],["variables",{"2":{"253":2}}],["var2",{"2":{"241":2}}],["var1",{"2":{"241":2}}],["var",{"2":{"114":6,"210":6,"211":6,"232":2,"303":2,"304":4,"305":4,"666":2,"668":1,"669":6,"715":2,"717":5,"718":11,"723":2,"736":6,"761":14,"762":8,"764":14,"766":1,"775":2,"776":4,"797":2,"801":2,"802":8,"803":4,"806":8,"809":6,"810":6,"835":3,"848":2,"854":2,"859":1}}],["vars",{"2":{"98":2}}],["vscode",{"2":{"252":1}}],["vs",{"0":{"827":1,"829":1},"2":{"227":1,"345":1,"668":1,"837":1}}],["v8",{"0":{"169":1,"171":1},"1":{"170":1,"171":1,"172":2,"173":2,"174":2,"175":1,"176":1,"177":1,"178":1,"179":1,"180":1,"181":1,"182":1,"183":1,"184":1,"185":1},"2":{"175":1,"347":4,"820":1}}],["vmscript",{"2":{"147":6}}],["vmcontext",{"2":{"147":2}}],["vm模块",{"2":{"147":2}}],["vm",{"0":{"147":1},"2":{"147":13}}],["video",{"2":{"638":1}}],["vitals",{"2":{"382":1}}],["vitepress",{"0":{"336":1},"1":{"337":1,"338":1,"339":1,"340":1,"341":1,"342":1,"343":1,"344":1,"345":1},"2":{"336":1}}],["visuals",{"2":{"348":1}}],["visibility",{"0":{"652":1,"654":1,"655":1},"1":{"653":1,"654":1,"655":1,"656":1,"657":1,"658":1,"659":1,"660":1,"661":1},"2":{"586":1,"655":2}}],["visible",{"2":{"326":3,"575":1,"635":1,"654":1,"655":1}}],["visibleitem",{"2":{"190":4}}],["visited",{"2":{"16":1,"635":1}}],["viz",{"0":{"353":1},"2":{"348":1,"353":1,"367":1,"368":1}}],["view2",{"2":{"850":4}}],["view1",{"2":{"850":2}}],["views",{"2":{"850":8}}],["viewport",{"2":{"131":2,"146":2,"147":4,"701":1}}],["view",{"2":{"41":2,"221":1}}],["v",{"2":{"12":2,"253":2}}],["aargs",{"2":{"806":10}}],["audio",{"2":{"638":1}}],["author",{"2":{"701":1,"832":1}}],["authentication",{"0":{"535":1,"544":1}}],["authroritative",{"0":{"510":1}}],["autoselect",{"2":{"428":12}}],["automatically",{"2":{"253":4}}],["auto",{"0":{"590":1},"2":{"188":2,"268":2,"575":1,"590":4,"591":2,"592":2,"593":2,"594":6,"595":2,"655":3}}],["awdl0",{"2":{"428":4}}],["a5",{"2":{"428":4}}],["a7",{"2":{"428":4}}],["ajax",{"2":{"402":1,"730":2}}],["age=300",{"2":{"400":2}}],["age",{"0":{"400":1,"412":1},"2":{"762":8}}],["aggregate",{"0":{"367":1},"2":{"353":1}}],["advanced",{"0":{"837":1}}],["admin",{"2":{"396":6}}],["address",{"2":{"434":1,"467":1}}],["addr",{"2":{"421":2}}],["addrange",{"2":{"114":1}}],["adds",{"2":{"253":2}}],["addition",{"2":{"253":2}}],["additional",{"2":{"253":2}}],["additionalchunkassets",{"2":{"137":1}}],["addednodes",{"2":{"156":5,"751":5}}],["addeventlistener",{"0":{"711":1},"1":{"712":1,"713":1},"2":{"44":1,"168":14,"195":2,"218":3,"269":2,"270":2,"419":4,"711":1,"713":8,"715":2}}],["addlistener",{"2":{"149":2}}],["addword",{"2":{"14":1}}],["add",{"2":{"12":2,"168":16,"421":2,"668":2,"717":1,"718":1,"861":2}}],["ambient",{"0":{"843":1},"2":{"846":1,"865":1}}],["am",{"2":{"802":4}}],["amd",{"0":{"302":1},"1":{"303":1,"304":1},"2":{"240":1,"300":1,"839":1,"854":4,"857":2,"868":1}}],["amp",{"0":{"336":1,"589":1,"596":1,"663":1,"666":4,"668":2,"677":2,"680":2,"846":1,"853":1,"872":1},"1":{"337":1,"338":1,"339":1,"340":1,"341":1,"342":1,"343":1,"344":1,"345":1,"590":1,"591":1,"592":1,"593":1,"594":1,"595":1,"597":1,"598":1,"599":1,"600":1,"601":1,"602":1,"603":1},"2":{"4":3,"48":1,"92":4,"98":12,"191":8,"219":1,"232":4,"253":4,"349":2,"352":1,"378":1,"575":1,"667":1,"669":1,"672":2,"698":8,"703":1,"715":1,"717":6,"739":8,"744":2,"806":4,"815":1,"837":2,"863":1,"865":2,"870":1,"874":3}}],["abbr",{"0":{"689":1},"2":{"689":4}}],["ab",{"2":{"666":6}}],["about",{"2":{"666":2,"859":1}}],["abort",{"2":{"224":1,"256":2,"259":2}}],["abc",{"2":{"242":4,"666":22}}],["abstractview",{"2":{"221":1}}],["absolute",{"2":{"188":6,"575":1,"582":1,"718":2}}],["acceptcharset",{"2":{"718":1}}],["acceptable",{"0":{"534":1}}],["accepted",{"0":{"509":1}}],["accept",{"0":{"493":1},"2":{"482":1,"490":2,"494":3,"718":1}}],["access",{"0":{"407":1,"408":1,"409":1,"410":1,"411":1,"412":1,"413":1,"414":1},"2":{"467":1,"476":1}}],["ack",{"2":{"422":3,"424":1}}],["action",{"2":{"718":2}}],["action=",{"2":{"402":2}}],["activate",{"0":{"365":1}}],["active",{"2":{"168":23,"428":6,"635":1}}],["achromatic",{"2":{"210":2,"211":2}}],["aliases",{"2":{"837":1}}],["align",{"0":{"591":1,"594":1,"628":1},"2":{"326":7}}],["already",{"0":{"515":1}}],["allowsyntheticdefaultimports",{"2":{"857":2}}],["allowed",{"0":{"533":1}}],["allow",{"0":{"407":1,"408":1,"409":1,"410":1},"2":{"380":1,"424":4}}],["all",{"2":{"251":1,"575":1,"666":2}}],["altkey",{"2":{"226":1}}],["alternate",{"2":{"167":2}}],["alterassettaggroups",{"2":{"139":2}}],["alterassettags",{"2":{"139":2}}],["alert",{"2":{"216":2,"217":2,"219":2,"394":1,"717":8,"718":2}}],["alpha",{"2":{"208":11,"641":1}}],["attr",{"2":{"640":1,"716":1}}],["attributeoldvalue",{"2":{"160":3,"755":3}}],["attributefilter",{"2":{"160":3,"755":3}}],["attribute",{"2":{"157":2,"752":2}}],["attributenamespace",{"2":{"156":5,"751":5}}],["attributename",{"2":{"156":5,"751":5}}],["attributes",{"2":{"151":1,"155":2,"156":8,"158":4,"159":4,"160":3,"716":1,"746":1,"750":2,"751":8,"753":4,"754":4,"755":3}}],["attachevent",{"2":{"219":3}}],["attachment",{"2":{"198":1}}],["ansi",{"0":{"812":1},"1":{"813":1,"814":1,"815":1},"2":{"812":1,"815":1}}],["any",{"2":{"496":1,"635":1,"842":6,"859":3,"863":1,"872":3}}],["anything",{"2":{"396":2}}],["anguished",{"2":{"345":1}}],["angry",{"2":{"345":1}}],["an",{"2":{"326":2,"328":2,"876":2}}],["and",{"0":{"863":1},"2":{"253":4,"429":1,"548":3,"737":2,"861":1}}],["animationend",{"2":{"168":2}}],["animationstart",{"2":{"168":2}}],["animation",{"2":{"167":10}}],["anchoroffset",{"2":{"114":1}}],["anchornode",{"2":{"114":2}}],["after",{"2":{"602":2,"633":1,"639":1,"739":2}}],["afteremit",{"2":{"139":2}}],["aftertemplateexecution",{"2":{"139":2}}],["ascii",{"2":{"703":1,"704":1,"705":1,"814":2,"815":1}}],["ascii码",{"2":{"227":1}}],["aside",{"0":{"686":1}}],["async",{"0":{"312":1,"680":1},"2":{"310":1,"376":1,"680":4}}],["asyncserieswaterfallhook",{"2":{"139":16}}],["assertions",{"2":{"859":1}}],["assertion",{"2":{"837":1}}],["assets",{"2":{"131":2}}],["assignment",{"2":{"742":1}}],["assignmentlet",{"2":{"742":1}}],["assign",{"2":{"271":2,"876":1}}],["as",{"2":{"253":2,"843":2,"844":2,"857":2,"859":2,"860":4,"870":2}}],["ast",{"2":{"170":2,"173":1,"766":1}}],["apiresponsetype",{"2":{"841":4}}],["api",{"0":{"154":1,"196":1,"256":1,"259":1,"262":1,"265":1,"267":1,"712":1,"749":1},"1":{"155":1,"156":1,"157":1,"158":1,"159":1,"160":1,"161":1,"162":1,"163":1,"164":1,"197":1,"198":1,"199":1,"200":1,"201":1,"202":1,"203":1,"268":1,"269":1,"270":1,"271":1,"750":1,"751":1,"752":1,"753":1,"754":1,"755":1,"756":1,"757":1,"758":1,"759":1},"2":{"112":1,"154":1,"196":3,"198":3,"199":1,"380":5,"668":4,"716":1,"717":1,"749":1,"762":1,"820":1,"825":1,"841":4,"857":2,"870":2}}],["appid",{"2":{"717":6}}],["applet",{"2":{"638":1}}],["apple",{"2":{"345":1,"693":9}}],["application",{"2":{"205":1,"454":2,"471":1,"701":1}}],["apply",{"2":{"79":2,"82":4,"86":4,"89":2,"92":4,"98":2,"131":2,"135":2,"143":4,"253":2,"764":4,"803":2,"806":6,"810":4}}],["app",{"2":{"102":4,"104":6,"106":2,"131":2,"146":2,"147":4,"217":8,"218":8,"219":8,"339":2,"871":2}}],["appendchild",{"2":{"158":4,"229":1,"675":2,"716":1,"718":2,"753":4}}],["append",{"2":{"18":1}}],["arr",{"2":{"743":4,"859":4,"860":6}}],["arraybuffer",{"0":{"671":1},"2":{"206":1,"671":5}}],["array",{"2":{"13":2,"253":2,"304":1,"668":4,"806":4,"859":3}}],["arg",{"2":{"866":24}}],["arguments",{"2":{"718":6,"764":4,"797":2,"806":4,"810":4}}],["argsarr",{"2":{"803":2}}],["args",{"2":{"76":4,"79":4,"82":6,"86":6,"89":4,"92":6,"98":8,"764":4,"806":6,"842":2}}],["article",{"0":{"687":1}}],["are",{"2":{"677":2}}],["around",{"0":{"593":1},"2":{"593":2}}],["arp",{"2":{"427":1,"480":3}}],["aot",{"2":{"53":1}}],["a",{"0":{"23":1,"441":1,"840":1},"1":{"24":1,"25":1,"26":1,"27":1,"28":1,"29":1,"30":1},"2":{"98":2,"143":8,"147":2,"156":8,"158":4,"239":10,"242":2,"246":2,"253":4,"257":5,"303":8,"304":8,"305":10,"306":8,"309":2,"326":4,"402":5,"429":3,"439":1,"440":1,"546":1,"548":1,"566":2,"618":2,"643":1,"664":2,"666":6,"669":10,"672":34,"723":8,"737":6,"742":2,"751":8,"753":4,"761":10,"762":1,"766":1,"775":6,"776":14,"797":6,"801":8,"802":10,"803":6,"809":6,"814":1,"815":2,"835":4,"837":1,"847":2,"848":3,"849":4,"852":2,"859":3,"860":10,"864":6,"865":2,"866":6,"870":6,"874":12}}],["每段",{"2":{"550":1}}],["每一个",{"2":{"726":1}}],["每一个字节都为",{"2":{"446":1}}],["每一项的高度",{"2":{"191":2}}],["每一项的高度100",{"2":{"188":2}}],["每一项高度",{"2":{"190":2}}],["每一项高度固定",{"2":{"188":1}}],["每次请求都要携带完整的头部",{"2":{"489":1}}],["每次",{"2":{"191":2}}],["每次多展示两条数据",{"2":{"190":2}}],["每次mutationrecord被添加到mutationobserver的记录队列时",{"2":{"162":1,"757":1}}],["每次编译时都触发主",{"2":{"132":1}}],["每次输入完毕",{"2":{"75":1}}],["每次取堆顶元素",{"2":{"12":1}}],["每日定时执行",{"2":{"24":1}}],["每个插件一个进程",{"2":{"729":1}}],["每个盒子由四部分组成",{"2":{"585":1}}],["每个部分",{"2":{"429":1}}],["每个",{"2":{"354":1,"729":1}}],["每个合格的突变",{"2":{"161":1,"756":1}}],["每个阶段",{"2":{"67":1}}],["每个开发者都认领",{"2":{"64":1}}],["每个节点的属性",{"2":{"14":1}}],["每个叶子节点都是黑色的空节点",{"2":{"7":1}}],["实体类型",{"2":{"838":1}}],["实验室工具",{"2":{"382":1}}],["实测工具",{"2":{"382":1}}],["实际引用或者指向硬盘驱动器上的某个点",{"2":{"320":1}}],["实际上",{"2":{"114":1}}],["实际上已经生成",{"2":{"104":1}}],["实时性高",{"2":{"794":1}}],["实时性更强",{"2":{"489":1}}],["实时传输协议",{"2":{"571":1}}],["实时监听滚动的高度",{"2":{"188":1}}],["实时编译",{"2":{"104":1}}],["实例化对象无法访问",{"2":{"864":1}}],["实例化对象和子类都无法访问",{"2":{"864":1}}],["实例类型",{"2":{"838":1}}],["实例属性",{"2":{"206":1}}],["实例对象方法",{"2":{"198":1}}],["实例对象属性",{"2":{"198":1}}],["实例时",{"2":{"163":1,"758":1}}],["实例",{"0":{"159":1,"754":1}}],["实例方法",{"2":{"12":1,"13":1,"14":1,"206":1}}],["实现网络管理和系统支持功能",{"2":{"466":1}}],["实现一个缓冲机制",{"2":{"365":1}}],["实现一个简易热更新",{"0":{"99":1},"1":{"100":1,"101":1,"102":1,"103":1,"104":1,"105":1,"106":1,"107":1,"108":1,"109":1}}],["实现双方通信",{"2":{"105":1}}],["实现思考",{"0":{"100":1},"1":{"101":1,"102":1,"103":1,"104":1,"105":1,"106":1}}],["实现热更新",{"2":{"99":1}}],["实现多种完整版的防抖节流",{"2":{"73":1}}],["实现",{"0":{"8":1,"94":1,"195":1},"1":{"95":1,"96":1,"97":1,"98":1},"2":{"188":1,"466":1}}],["递归调用",{"2":{"820":1}}],["递归遍历根元素",{"2":{"183":1}}],["递归寻找",{"2":{"21":1}}],["递归",{"2":{"14":1}}],["递归左右子节点",{"2":{"12":1}}],["递归父节点",{"2":{"12":1}}],["自带凭证",{"0":{"683":1}}],["自签名证书",{"2":{"567":1}}],["自协议",{"2":{"489":1}}],["自定义数据属性",{"2":{"717":1}}],["自定义应用数据",{"2":{"569":1}}],["自定义压缩算法",{"2":{"489":1}}],["自定义扩展协议",{"2":{"489":1}}],["自定义解析",{"2":{"238":1}}],["自动引用合适的上下文对象",{"2":{"796":1}}],["自动执行器注意的是",{"2":{"669":1}}],["自动执行器",{"2":{"669":2}}],["自动验证",{"2":{"568":1}}],["自动返回错误的信息",{"2":{"480":1}}],["自动化测试",{"2":{"64":1}}],["自动化",{"0":{"24":1},"2":{"23":1}}],["自由匹配规则插入到index",{"2":{"145":2}}],["自由处理规则",{"2":{"144":2}}],["自由实现",{"2":{"131":2}}],["自己注入标签",{"2":{"131":2}}],["自顶向下",{"2":{"12":2}}],["自下向顶",{"2":{"12":2}}],["右关联",{"2":{"744":2}}],["右关联相同操作符按照从右往左的顺序执行",{"2":{"744":1}}],["右移一位",{"2":{"297":1}}],["右",{"2":{"21":3}}],["右节点需要寻找最小节点作为当前删除节点",{"2":{"21":1}}],["右字节点下标",{"2":{"12":1}}],["右旋",{"2":{"8":1}}],["+$",{"2":{"835":2,"852":2}}],["+2",{"2":{"294":3}}],["+0",{"2":{"294":2}}],["++",{"2":{"191":2,"744":1}}],["+1",{"2":{"191":2,"294":3,"345":1}}],["+=",{"2":{"147":2,"188":2,"191":4,"208":6,"210":2}}],["+options",{"2":{"98":2}}],["+wait",{"2":{"98":2}}],["+",{"0":{"295":1,"559":1,"613":1},"1":{"296":1,"297":1,"298":1,"299":1,"560":1,"561":1},"2":{"12":2,"24":5,"53":1,"99":1,"101":1,"143":4,"147":6,"188":6,"190":8,"191":6,"195":2,"210":10,"211":10,"219":2,"234":2,"242":2,"246":8,"268":1,"271":2,"294":4,"298":4,"347":11,"399":4,"419":2,"441":1,"442":1,"443":1,"480":2,"481":1,"494":2,"550":1,"666":6,"718":8,"741":2,"744":1,"815":1,"861":2,"865":4,"874":2}}],["io",{"2":{"428":12}}],["icmp",{"2":{"427":1,"466":1,"480":1}}],["icon",{"2":{"134":2}}],["ipv6",{"0":{"430":1}}],["ipv4",{"0":{"429":1},"2":{"498":1,"546":1}}],["ipconfig",{"2":{"428":1}}],["ipsec",{"2":{"427":1}}],["iproute2",{"2":{"421":1}}],["ip",{"0":{"421":1,"428":1,"431":1,"434":1,"435":1,"436":1,"437":1,"440":1,"447":1,"478":1},"1":{"429":1,"430":1,"431":1,"435":1,"436":1,"437":1,"438":2,"439":2,"440":1,"441":2,"442":2,"443":2,"444":2,"445":2,"446":2,"447":1,"479":1,"480":1,"481":1,"482":1,"483":1},"2":{"421":4,"422":9,"424":2,"425":1,"427":1,"429":4,"432":1,"433":1,"440":2,"446":6,"447":2,"459":1,"465":1,"466":1,"475":1,"478":2,"480":8,"481":1,"483":2,"486":1,"497":1,"499":1,"545":3,"546":3,"547":3,"548":2,"549":1,"550":1,"551":3,"552":1,"562":1}}],["idle",{"0":{"823":1},"2":{"819":1,"820":1}}],["identity",{"2":{"866":14}}],["identifier",{"2":{"494":1}}],["ide",{"2":{"857":2}}],["idempotent",{"2":{"461":1}}],["idconst",{"2":{"309":1}}],["id",{"0":{"606":1},"2":{"303":2,"309":6,"428":2,"446":1,"837":1}}],["id=",{"2":{"104":2,"131":2,"146":2,"147":4,"168":2,"188":2,"195":2,"217":2,"218":2,"219":2,"339":2,"713":6,"715":2}}],["ignore",{"2":{"253":12,"424":2,"872":1}}],["ignorepatterns",{"2":{"252":1}}],["ignoring",{"2":{"253":2}}],["ignition",{"2":{"174":2}}],["iec",{"2":{"812":1}}],["ie=edge",{"2":{"701":1}}],["ie4",{"2":{"311":1}}],["ieee754",{"2":{"284":1}}],["ieee",{"0":{"272":1},"1":{"273":1,"274":1,"275":1,"276":1,"277":1,"278":1,"279":1,"280":1,"281":1,"282":1,"283":1,"284":1,"285":1,"286":1,"287":1,"288":1,"289":1,"290":1,"291":1,"292":1,"293":1,"294":1,"295":1,"296":1,"297":1,"298":1,"299":1},"2":{"283":1}}],["ie7",{"2":{"232":2}}],["ie8",{"2":{"232":2}}],["ie8及之前版本都不支持",{"2":{"226":1}}],["ie5",{"2":{"225":2}}],["ie",{"0":{"219":1,"222":1},"2":{"222":2,"717":1,"718":2}}],["ie9",{"2":{"212":1,"218":1}}],["i++",{"2":{"188":2,"191":2}}],["it",{"0":{"702":1},"2":{"326":2,"666":2,"675":2,"848":3,"849":4}}],["its",{"2":{"326":4}}],["item4",{"2":{"594":2}}],["item3",{"2":{"592":4,"594":10}}],["item2",{"2":{"592":4,"594":12}}],["item1",{"2":{"592":4,"594":6}}],["items",{"0":{"591":1},"2":{"575":1}}],["itemsize",{"2":{"188":12}}],["item",{"2":{"575":1,"591":4,"593":8,"646":24,"716":1,"718":1}}],["itemcount",{"2":{"190":8,"191":8}}],["itemheight",{"2":{"188":10,"190":8}}],["iteration",{"2":{"167":1}}],["italic",{"2":{"113":1}}],["iii",{"2":{"156":2,"751":2,"866":2}}],["ii",{"2":{"156":2,"751":2,"866":2}}],["im",{"0":{"516":1}}],["imports",{"2":{"850":4}}],["importing",{"0":{"841":1}}],["important",{"2":{"718":1}}],["import",{"0":{"620":1,"840":1},"2":{"306":4,"672":3,"675":2,"680":2,"681":2,"682":2,"839":1,"840":1,"841":5,"843":2,"844":5,"847":2,"849":2,"852":2,"857":4,"870":1,"871":1,"876":1}}],["implements",{"2":{"852":2,"860":1}}],["implemented",{"0":{"540":1}}],["implementation",{"2":{"223":4}}],["impliedstrict",{"2":{"237":1}}],["img",{"2":{"224":1,"402":1,"638":1,"643":1}}],["image",{"2":{"205":1,"402":1}}],["ime",{"2":{"116":2}}],["immediate",{"2":{"79":2,"82":2}}],["isrequired",{"2":{"876":4}}],["isacceptable",{"2":{"852":2}}],["ispirme",{"2":{"844":2}}],["isprime",{"2":{"844":8}}],["isprototypeof",{"2":{"762":1}}],["isolatedmodules",{"2":{"841":1}}],["iso",{"2":{"812":1}}],["isview",{"2":{"671":1}}],["ish",{"2":{"265":6}}],["is",{"2":{"253":2,"326":4,"635":1,"666":4,"775":2,"797":2,"801":2,"806":4,"837":1,"850":4,"876":1}}],["issecurecontext",{"2":{"196":1,"200":2}}],["issupported",{"2":{"223":4,"232":2}}],["issupport",{"2":{"168":4}}],["isc",{"2":{"832":1}}],["iscallable",{"2":{"806":2}}],["iscroll",{"0":{"188":1}}],["iscollapsed",{"2":{"114":1}}],["iscompleteword",{"2":{"14":1}}],["isinvoking",{"2":{"98":4}}],["istanbul",{"2":{"25":1}}],["ifc",{"0":{"577":1},"1":{"578":1},"2":{"577":2}}],["ifcost",{"2":{"428":2}}],["ifconfig",{"2":{"421":4,"428":2}}],["ifmaxaddr",{"2":{"428":4}}],["iframe",{"2":{"350":1,"354":1,"380":1,"402":3,"419":1,"638":1}}],["if",{"0":{"722":1},"2":{"19":2,"76":2,"79":4,"82":6,"86":4,"89":4,"92":8,"98":14,"143":2,"168":6,"188":2,"200":2,"210":12,"211":2,"253":2,"271":1,"326":4,"419":4,"522":2,"718":6,"761":2,"806":3,"810":1,"842":6,"848":3,"849":4,"850":2}}],["increment",{"2":{"861":2}}],["incremental",{"2":{"185":1}}],["include",{"2":{"832":1,"857":4}}],["incoming",{"2":{"820":1}}],["inherit",{"2":{"762":2}}],["inheritprototype",{"2":{"762":4}}],["innertext",{"2":{"717":1}}],["innerhtml",{"2":{"717":9}}],["invalid",{"2":{"635":2,"742":2}}],["invocations",{"2":{"98":2}}],["invoke",{"2":{"98":2}}],["invokefunc",{"2":{"98":8}}],["inaddr",{"2":{"496":1}}],["inactive",{"2":{"428":8}}],["infer",{"2":{"837":2}}],["information",{"0":{"510":1},"2":{"253":4}}],["info",{"2":{"253":2}}],["infinite",{"2":{"167":1}}],["int32array",{"2":{"671":2}}],["intrinsic",{"2":{"655":3}}],["into",{"2":{"257":2}}],["int",{"2":{"253":2}}],["intersection",{"0":{"863":1}}],["interval",{"2":{"860":6}}],["interfaces",{"0":{"860":1},"2":{"860":2}}],["interface",{"2":{"837":1,"843":2,"852":2,"860":5,"864":3,"866":7,"874":5}}],["intermediates",{"2":{"568":1}}],["inter",{"2":{"551":1}}],["internal",{"0":{"539":1}}],["internet",{"2":{"347":1,"434":1,"478":1}}],["interconnect",{"2":{"470":1}}],["interim",{"2":{"424":2}}],["interger",{"2":{"221":2}}],["interactive",{"2":{"230":1,"256":4,"388":1}}],["interact",{"2":{"56":1}}],["inline",{"0":{"680":1},"2":{"198":1,"246":2,"253":4,"326":9,"575":1,"577":1,"583":1,"598":2,"627":1,"628":2,"643":3,"644":2,"647":3,"679":6,"680":2}}],["inject",{"2":{"134":2}}],["indeterminate",{"2":{"635":1}}],["indempotent",{"2":{"461":1}}],["inde",{"2":{"137":1}}],["indent",{"2":{"113":1}}],["indexable",{"2":{"860":1}}],["index++",{"2":{"191":2}}],["indexdb",{"2":{"55":1}}],["index",{"0":{"144":1,"146":1},"1":{"147":1},"2":{"12":4,"104":1,"106":5,"114":1,"131":2,"132":1,"134":2,"137":4,"143":6,"144":2,"147":6,"189":2,"191":16,"269":2,"392":1,"660":1,"718":3,"848":4,"849":12,"850":2,"857":4,"858":2,"860":2}}],["insights",{"2":{"382":2}}],["instancetype",{"2":{"838":1}}],["instanceof",{"2":{"761":2,"806":6}}],["instance",{"2":{"354":1,"761":1,"764":6}}],["installhandlers",{"2":{"106":2}}],["insertbefore",{"2":{"229":1,"716":1}}],["insertparagraph",{"2":{"113":1}}],["insertunorderedlist",{"2":{"113":1}}],["insertorderedlist",{"2":{"113":1}}],["insertimage",{"2":{"113":1}}],["inserthorizontalrule",{"2":{"113":1}}],["insert",{"2":{"12":1,"18":1,"20":2}}],["in",{"2":{"98":6,"167":2,"168":2,"232":2,"253":4,"326":6,"635":1,"742":2,"837":2,"862":4}}],["initramfs",{"2":{"423":1,"425":1}}],["initialization",{"2":{"253":2}}],["initial",{"2":{"131":2,"146":2,"147":4,"649":2}}],["init",{"2":{"98":2,"253":2}}],["inputmethod",{"2":{"227":1}}],["input",{"2":{"56":1,"111":1,"349":1,"350":1,"352":1,"390":1,"608":1,"633":1,"638":1,"717":2}}],["i",{"0":{"819":1},"2":{"12":4,"156":2,"188":10,"191":6,"198":1,"256":4,"751":2,"802":4,"819":4,"822":1,"824":3,"827":1,"866":2}}],["左上角",{"2":{"815":1}}],["左关联",{"2":{"744":3}}],["左关联相同操作符按照从左往右的顺序执行",{"2":{"744":1}}],["左边框宽度和右边框宽度",{"2":{"718":1}}],["左边按钮",{"2":{"226":1}}],["左侧侧边栏",{"2":{"686":1}}],["左对齐",{"2":{"113":1}}],["左",{"2":{"21":3}}],["左右",{"2":{"21":1}}],["左字节点下标",{"2":{"12":1}}],["左旋",{"2":{"8":1}}],["数值成员必须为对象",{"2":{"668":1}}],["数表示",{"0":{"284":1}}],["数组只读",{"2":{"860":2}}],["数组参数",{"2":{"803":1}}],["数组去重",{"2":{"668":1}}],["数组结构赋值",{"2":{"664":1}}],["数组",{"2":{"160":2,"198":1,"303":1,"755":2,"761":1,"795":1}}],["数组存储",{"2":{"12":1}}],["数字枚举类型",{"2":{"865":1}}],["数字类型枚举",{"2":{"865":1}}],["数字引用",{"2":{"666":2}}],["数字证书链",{"2":{"568":1}}],["数字证书",{"2":{"568":1}}],["数字证书拓展",{"0":{"568":1}}],["数字证书最核心的内容就是使用其自有的私钥生成的数字签名",{"2":{"567":1}}],["数字签名",{"0":{"565":1}}],["数字",{"2":{"113":1}}],["数量",{"2":{"52":1}}],["数据传输加密过程",{"2":{"552":1}}],["数据包的对",{"2":{"551":1}}],["数据包的长度",{"2":{"481":1}}],["数据包的长度不会超过",{"2":{"481":1}}],["数据包+4",{"2":{"489":1}}],["数据包没有长度限制",{"2":{"481":1}}],["数据包丢失",{"2":{"481":1}}],["数据包被发送到主机上以后",{"2":{"481":1}}],["数据包必须是一块网卡传送到另一块网卡",{"2":{"479":1}}],["数据链表尾",{"2":{"476":1}}],["数据链表头",{"2":{"476":1}}],["数据链路层",{"0":{"476":1},"2":{"464":1,"552":1}}],["数据格式的解析",{"2":{"351":1}}],["数据与",{"2":{"321":1}}],["数据所在的位置",{"2":{"317":1}}],["数据",{"2":{"172":1,"481":1}}],["数据监控",{"0":{"47":1}}],["数据上报",{"0":{"46":1}}],["数据埋点与收集",{"0":{"42":1},"1":{"43":1,"44":1,"45":1,"46":1,"47":1}}],["数据层",{"2":{"33":1}}],["数据模块",{"2":{"33":1}}],["数据结构性能优化",{"2":{"128":1}}],["数据结构辅助记忆",{"0":{"10":1},"1":{"11":1,"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1}}],["数据结构有限",{"2":{"9":1}}],["堆空间的垃圾回收",{"0":{"178":1}}],["堆空间",{"0":{"177":1,"791":1},"2":{"788":1}}],["堆排序",{"2":{"12":1}}],["堆",{"0":{"12":1,"795":1}}],["常量基本类型不能赋值",{"2":{"865":1}}],["常量定义可以为结算",{"2":{"865":1}}],["常规",{"2":{"815":1}}],["常见配置介绍",{"2":{"857":2}}],["常见解析",{"0":{"847":1}}],["常见解决方案",{"0":{"187":1}}],["常见网络协议",{"0":{"427":1}}],["常见的数据结构",{"0":{"11":1},"1":{"12":1,"13":1,"14":1,"15":1,"16":1,"17":1,"18":1,"19":1,"20":1,"21":1}}],["常用于多机测试",{"2":{"497":1}}],["常用配置",{"2":{"134":2}}],["常用的位运算操作",{"0":{"4":1}}],["算法函数计算明文信息",{"2":{"566":1}}],["算法无限",{"2":{"9":1}}],["算法",{"2":{"9":1,"13":1,"182":1}}],["算法的执行时间与数据规模之间的增长关系",{"2":{"2":1}}],["3d",{"2":{"729":1}}],["3xx",{"0":{"517":1},"1":{"518":1,"519":1,"520":1,"521":1,"522":1,"523":1,"524":1,"525":1,"526":1}}],["3a44",{"2":{"428":2}}],["3a",{"2":{"289":1}}],["34",{"2":{"277":1,"283":1}}],["32位的ip地址一分为二",{"2":{"429":1}}],["32",{"2":{"274":1,"283":2,"429":3,"547":1,"671":2}}],["3拖放进来",{"2":{"227":1}}],["3表示数字小键盘",{"2":{"227":1}}],["36028797018963968",{"2":{"282":1}}],["360",{"2":{"210":5,"347":2}}],["3位",{"2":{"208":4}}],["39",{"2":{"98":40,"104":4,"106":8,"114":8,"131":4,"134":12,"139":28,"143":20,"144":8,"147":32,"149":4,"153":4,"155":12,"156":44,"157":16,"158":24,"159":16,"168":120,"188":4,"195":24,"200":24,"201":12,"202":8,"203":8,"216":4,"217":8,"218":8,"219":8,"223":16,"232":4,"269":4,"270":4,"303":8,"304":16,"305":8,"306":8,"309":4,"326":14,"339":4,"380":8,"395":4,"396":4,"399":4,"400":4,"419":32,"494":16,"602":4,"666":76,"667":8,"672":12,"675":12,"680":8,"682":4,"684":4,"713":40,"715":4,"717":28,"718":40,"736":8,"737":16,"741":8,"748":4,"750":12,"751":44,"752":16,"753":24,"754":16,"761":60,"762":8,"763":8,"764":8,"775":8,"801":8,"802":4,"806":8,"835":12,"840":4,"841":8,"843":12,"844":4,"847":4,"850":8,"854":12,"857":22,"859":8,"860":8,"862":12,"865":4,"866":8,"871":4,"876":16}}],["307",{"0":{"525":1}}],["306",{"0":{"524":1}}],["305",{"0":{"523":1}}],["304",{"0":{"522":1}}],["303",{"0":{"521":1}}],["302",{"0":{"520":1}}],["301",{"0":{"519":1}}],["308",{"0":{"526":1},"2":{"280":1}}],["3000",{"2":{"490":2}}],["300",{"0":{"518":1},"2":{"190":2,"191":2}}],["30w+",{"2":{"62":1}}],["30+",{"2":{"62":1}}],["3",{"0":{"295":1,"297":1},"1":{"296":1,"297":1,"298":1,"299":1},"2":{"8":7,"24":1,"112":2,"114":1,"168":2,"210":8,"221":1,"223":8,"226":1,"237":2,"283":2,"290":1,"297":2,"298":1,"311":1,"312":1,"344":2,"441":1,"443":1,"463":1,"594":4,"644":3,"646":9,"647":1,"648":2,"666":1,"668":6,"669":12,"672":10,"678":3,"761":1,"762":1,"809":2,"835":2,"841":1,"862":2,"864":2,"876":1}}],["31",{"2":{"8":1,"429":1,"439":1,"440":1}}],["2const",{"2":{"671":1}}],["2xx",{"0":{"506":1},"1":{"507":1,"508":1,"509":1,"510":1,"511":1,"512":1,"513":1,"514":1,"515":1,"516":1}}],["226",{"0":{"516":1}}],["224",{"2":{"444":1}}],["223",{"2":{"429":1,"440":1}}],["27",{"2":{"429":1,"814":1}}],["28",{"2":{"429":1}}],["29",{"2":{"428":6}}],["2d7c",{"2":{"428":2}}],["25px",{"2":{"718":2}}],["258eafa5",{"2":{"494":1}}],["254",{"2":{"429":1,"440":4}}],["250",{"2":{"424":2}}],["255",{"2":{"208":6,"209":6,"211":6,"422":8,"424":12,"428":2,"429":19,"439":7,"440":13,"444":3,"446":7,"548":12}}],["20bb7",{"2":{"666":2}}],["208",{"0":{"515":1}}],["207",{"0":{"514":1}}],["206",{"0":{"513":1}}],["205",{"0":{"512":1},"2":{"512":1}}],["204",{"0":{"511":1},"2":{"511":1,"512":1}}],["203",{"0":{"510":1}}],["2022",{"2":{"812":1}}],["2020",{"2":{"694":5}}],["202",{"0":{"509":1}}],["2015",{"2":{"666":4}}],["201",{"0":{"508":1}}],["2018",{"2":{"324":2}}],["2097152",{"2":{"440":1}}],["200px",{"2":{"599":4,"718":2}}],["200",{"0":{"507":1}}],["2008",{"2":{"283":1}}],["2000",{"2":{"76":2,"79":2,"428":2,"618":2}}],["234",{"2":{"835":2}}],["23456",{"2":{"717":2}}],["239",{"2":{"444":1}}],["2304",{"2":{"428":2}}],["23",{"2":{"283":1}}],["2×10^",{"2":{"280":1}}],["2^21",{"2":{"440":1}}],["2^14",{"2":{"440":1}}],["2^1024",{"2":{"280":1}}],["2^7",{"2":{"440":1}}],["2^55",{"2":{"282":1}}],["2^54",{"2":{"282":2}}],["2^53",{"2":{"282":3}}],["2^",{"2":{"280":1,"296":1,"297":1,"298":2}}],["240",{"2":{"424":2}}],["24",{"2":{"274":1,"283":1,"421":4,"429":3,"550":2}}],["2粘贴进来",{"2":{"227":1}}],["2表示右侧键盘",{"2":{"227":1}}],["21600",{"2":{"424":2}}],["21",{"2":{"8":1,"429":1}}],["2",{"2":{"8":7,"12":3,"24":1,"112":2,"114":1,"168":2,"188":4,"190":4,"191":2,"208":8,"210":8,"211":6,"221":1,"223":6,"226":1,"237":1,"243":1,"246":2,"268":1,"280":1,"282":1,"283":2,"287":5,"288":10,"289":3,"290":3,"294":1,"296":8,"297":10,"298":1,"303":2,"326":2,"344":2,"379":1,"429":1,"440":1,"442":2,"594":4,"644":3,"646":9,"647":1,"648":2,"664":1,"666":5,"669":14,"671":3,"672":10,"678":3,"679":3,"681":4,"713":2,"723":2,"761":3,"762":1,"776":8,"797":2,"803":2,"809":2,"815":2,"844":6,"859":6,"860":4,"862":2,"864":2,"866":2,"874":2,"877":2}}],["着色",{"2":{"8":4}}],["rhs",{"0":{"768":1},"2":{"768":1,"770":2}}],["r2",{"2":{"666":4}}],["r1",{"2":{"666":4}}],["rl",{"2":{"580":1}}],["rtcp",{"0":{"571":1},"2":{"571":1}}],["rtp",{"0":{"571":1},"2":{"569":1,"571":3}}],["rtmp",{"2":{"427":1}}],["rfc",{"0":{"504":1,"505":1,"513":1,"514":1,"515":1,"516":1,"526":1,"529":1,"535":1}}],["rxcsum",{"2":{"428":4}}],["rpc",{"2":{"427":1}}],["rapidssl",{"2":{"568":1}}],["random",{"2":{"553":2,"554":4,"555":2,"559":2,"560":2,"563":2}}],["range",{"2":{"114":6,"635":2}}],["rangecount",{"2":{"114":1}}],["rasterization",{"2":{"364":1}}],["raster",{"0":{"364":1},"2":{"359":1,"363":1,"364":1,"365":1}}],["rm",{"2":{"318":2,"322":2}}],["r",{"2":{"210":8,"211":14,"309":8,"666":10}}],["roman",{"2":{"641":2}}],["routing",{"2":{"551":1}}],["router",{"2":{"466":1}}],["routers",{"2":{"424":2}}],["round",{"2":{"208":6}}],["rose",{"2":{"345":1}}],["rootdir",{"2":{"857":2}}],["rootdirs",{"2":{"850":3,"857":2}}],["root",{"2":{"250":1,"256":2,"333":2,"568":1,"575":1,"635":1,"715":10,"847":8,"848":11,"849":25,"870":2}}],["rotation",{"2":{"234":1}}],["row",{"2":{"188":4,"594":2}}],["rgb2hsl",{"2":{"211":2}}],["rgb2hex",{"2":{"209":2}}],["rgb",{"0":{"208":1,"209":1,"210":1,"211":1},"2":{"208":7,"209":7}}],["rulesdir",{"2":{"253":2}}],["rules",{"0":{"243":1},"1":{"244":1,"245":1,"246":1,"247":1},"2":{"236":1,"242":2,"247":4,"253":8}}],["rule",{"2":{"144":2,"242":2,"246":2,"253":2}}],["running",{"2":{"167":1,"428":20,"433":1}}],["runincontext",{"2":{"147":2}}],["runaschild",{"2":{"143":2}}],["run",{"2":{"109":2,"253":4}}],["rdd",{"2":{"34":1}}],["reg",{"2":{"835":4}}],["regexgreeksymbol",{"2":{"666":4}}],["regexp",{"2":{"309":1,"666":5}}],["refcb",{"2":{"877":4}}],["ref=",{"2":{"877":8}}],["ref",{"0":{"877":1},"2":{"877":22}}],["references",{"2":{"857":2}}],["reference",{"2":{"852":2,"854":8,"857":4,"871":2}}],["referenceerror",{"2":{"769":1,"770":1,"775":2,"797":2}}],["referenct",{"2":{"843":2}}],["refresh",{"2":{"701":1}}],["re",{"2":{"666":22}}],["req",{"2":{"494":2}}],["requre",{"2":{"853":1}}],["requrie",{"2":{"309":3}}],["request",{"0":{"413":1,"414":1,"528":1,"536":1},"2":{"402":1,"422":4,"424":1,"456":1,"461":2}}],["requestanimationframe",{"2":{"168":5}}],["requirejs",{"2":{"839":1}}],["required",{"0":{"530":1,"535":1,"544":1},"2":{"635":1,"838":1}}],["require",{"0":{"304":1,"309":1},"2":{"139":2,"143":2,"144":2,"147":2,"303":7,"304":15,"305":4,"494":2,"672":5,"842":6,"848":2,"854":4,"870":1,"871":2}}],["rect",{"2":{"718":10}}],["receivemessage",{"2":{"419":8}}],["record",{"2":{"838":1}}],["records",{"0":{"156":1,"751":1},"2":{"156":1,"163":1,"751":1,"758":1}}],["recommended",{"2":{"251":2}}],["rebase",{"0":{"255":1},"1":{"256":1,"257":1},"2":{"256":6,"257":2}}],["reply",{"2":{"422":1}}],["replaced",{"2":{"636":2}}],["replace",{"2":{"271":2,"666":2,"835":2,"876":1}}],["replacestate",{"2":{"268":3}}],["replacechild",{"2":{"20":1,"229":2,"716":1}}],["reported",{"0":{"515":1},"2":{"253":2}}],["report",{"2":{"253":6}}],["reportunuseddisabledirectives",{"2":{"248":1}}],["realtime",{"2":{"571":1}}],["readme",{"2":{"850":2}}],["readonlyarray",{"2":{"860":4}}],["readonly",{"2":{"241":2,"838":1,"860":6,"864":1}}],["readablestream",{"2":{"206":2}}],["readtext",{"0":{"203":1}}],["read",{"0":{"202":1},"2":{"202":2,"203":2,"635":2}}],["readystate",{"2":{"230":1}}],["readystatechange",{"2":{"43":1,"230":1}}],["ready",{"2":{"56":1}}],["react",{"0":{"189":1},"1":{"190":1,"191":1},"2":{"189":1,"191":2,"251":1,"857":8,"876":7,"877":7}}],["reloption",{"2":{"718":1}}],["reload",{"2":{"106":1,"271":2}}],["relative",{"2":{"253":2,"850":2}}],["rel=",{"2":{"134":2,"402":1}}],["reomverange",{"2":{"114":1}}],["remainingwait",{"2":{"98":4}}],["remaining",{"2":{"98":2}}],["removeproperty",{"2":{"718":1}}],["removeattribute",{"2":{"716":1}}],["removeallranges",{"2":{"114":1}}],["removeeventlistener",{"2":{"168":2,"195":2,"218":1,"715":2}}],["removednodes",{"2":{"156":5,"751":5}}],["removelistener",{"2":{"149":2}}],["removeformat",{"2":{"113":1}}],["removechild",{"2":{"20":1,"229":1,"716":1,"718":2}}],["remove",{"2":{"12":2,"20":2,"717":1,"718":1}}],["rest",{"2":{"861":1}}],["restore",{"0":{"261":1},"1":{"262":1,"263":1,"264":1,"265":1,"266":1},"2":{"262":6,"263":3}}],["res",{"2":{"764":12}}],["response",{"2":{"461":2}}],["responsibility",{"2":{"34":1}}],["resolution",{"0":{"845":1},"1":{"846":1,"847":1,"848":1,"849":1,"850":1,"851":1}}],["resolved",{"2":{"253":2}}],["resolve",{"2":{"144":2,"198":1,"206":1,"253":2,"309":3}}],["resource",{"2":{"405":1}}],["reset",{"0":{"264":1,"512":1},"2":{"265":8,"266":2,"718":1,"860":6}}],["resize",{"2":{"224":1}}],["result",{"2":{"98":10,"156":2,"202":4,"203":4,"678":1,"679":1,"680":1,"681":1,"682":1,"713":4,"751":2}}],["returntype",{"2":{"838":1}}],["returnvalue",{"2":{"222":1,"230":2}}],["return",{"2":{"76":2,"79":2,"82":2,"86":2,"89":2,"92":2,"98":22,"131":4,"139":2,"143":2,"144":2,"147":4,"190":4,"191":4,"200":2,"208":6,"209":2,"210":10,"211":2,"419":4,"669":8,"718":8,"737":6,"761":9,"762":4,"764":4,"806":10,"810":4,"852":2,"854":2,"860":4,"861":2,"866":10,"876":2,"877":2}}],["revert",{"0":{"258":1},"1":{"259":1,"260":1},"2":{"259":4,"266":1}}],["reverse",{"2":{"18":1,"167":2}}],["review",{"2":{"64":1}}],["rendering",{"2":{"347":1,"369":1}}],["render",{"0":{"373":1},"2":{"56":1,"188":2,"349":2,"353":1,"354":3,"357":1}}],["redirect",{"0":{"525":1,"526":1}}],["red",{"2":{"6":1,"208":18,"209":8,"718":2,"859":2}}],["rightheight",{"2":{"20":1}}],["right",{"2":{"8":6,"586":2,"590":2,"592":2,"598":1,"603":1,"635":1,"647":2,"718":4}}],["红色节点不能相邻",{"2":{"7":1}}],["红黑树",{"0":{"6":1},"1":{"7":1,"8":1},"2":{"6":1,"53":1}}],["0m",{"2":{"815":1}}],["03",{"2":{"694":2}}],["0const",{"2":{"671":1}}],["02",{"2":{"666":4}}],["0这个网络",{"2":{"548":2}}],["0a",{"2":{"428":2}}],["01",{"2":{"428":8,"666":4}}],["011001",{"2":{"297":1}}],["01111111",{"2":{"294":1}}],["0x7e",{"2":{"815":1}}],["0x3f",{"2":{"815":1}}],["0x30",{"2":{"815":1}}],["0x40",{"2":{"814":1,"815":1}}],["0xd",{"2":{"428":2}}],["0xc",{"2":{"428":2}}],["0xb",{"2":{"428":2}}],["0xa",{"2":{"428":2}}],["0x2f",{"2":{"815":1}}],["0x20",{"2":{"815":1}}],["0x2",{"2":{"428":2}}],["0xffffff00",{"2":{"428":2}}],["0xff000000",{"2":{"428":2}}],["0x5f",{"2":{"814":1}}],["0x5",{"2":{"428":2}}],["0x1b",{"2":{"814":1}}],["0x1",{"2":{"428":2}}],["0️⃣",{"2":{"345":1}}],["000",{"2":{"616":2}}],["00000001",{"2":{"294":2}}],["00000000",{"2":{"294":1,"548":6}}],["00000010",{"2":{"294":3}}],["0011",{"2":{"298":1}}],["001111",{"2":{"290":1}}],["00111010",{"2":{"289":1}}],["001",{"2":{"296":1,"298":1}}],["0开始",{"2":{"234":1}}],["0肖像模式",{"2":{"233":1}}],["0不确定输入",{"2":{"227":1}}],["0表示默认键盘",{"2":{"227":1}}],["0px",{"2":{"188":2}}],["0",{"0":{"295":3,"296":1,"297":1,"496":4,"499":2},"1":{"296":3,"297":3,"298":3,"299":3,"497":4,"498":4},"2":{"4":1,"58":1,"92":2,"98":8,"114":2,"131":2,"146":2,"147":4,"156":4,"157":2,"159":4,"162":1,"168":10,"188":4,"190":8,"191":10,"208":4,"210":13,"211":6,"223":14,"226":1,"243":1,"271":1,"283":1,"287":3,"288":14,"294":5,"296":11,"297":15,"298":5,"421":8,"422":4,"424":8,"425":1,"428":58,"429":27,"439":7,"440":13,"441":1,"444":3,"446":13,"490":4,"501":1,"548":10,"550":2,"590":1,"592":4,"602":1,"649":3,"655":2,"671":9,"717":1,"718":4,"736":4,"751":4,"752":2,"754":4,"757":1,"797":4,"815":4,"876":1}}],["1f",{"2":{"812":1}}],["1function",{"2":{"809":1}}],["1890ff",{"2":{"876":2}}],["18",{"2":{"762":2}}],["180",{"2":{"424":2}}],["18000",{"2":{"424":2}}],["18014398509481984",{"2":{"282":1}}],["1$",{"2":{"666":4}}],["1d",{"2":{"666":2}}],["1px",{"2":{"644":2,"647":2,"718":2}}],["1xx",{"0":{"501":1},"1":{"502":1,"503":1,"504":1,"505":1},"2":{"501":1}}],["14",{"2":{"429":1}}],["1484",{"2":{"428":2}}],["149c",{"2":{"428":2}}],["1a",{"2":{"428":10}}],["1380",{"2":{"428":2}}],["13",{"2":{"428":6,"490":2,"694":5}}],["1位符号位",{"2":{"295":1}}],["12",{"2":{"671":2,"860":2}}],["1234567890",{"2":{"835":2}}],["123",{"2":{"646":3}}],["126",{"2":{"440":1}}],["122",{"2":{"429":1}}],["1200",{"2":{"428":2}}],["127",{"0":{"499":1},"2":{"283":1,"294":1,"428":2,"429":2,"440":1,"446":5,"490":2}}],["1280",{"2":{"428":4}}],["128",{"2":{"277":1,"283":2,"294":1,"428":2,"429":1,"430":1,"440":1}}],["1999",{"2":{"618":2}}],["191",{"2":{"429":1,"440":1}}],["192",{"2":{"424":10,"428":4,"429":4,"439":2,"440":3,"548":4,"550":1}}],["19",{"2":{"276":1,"283":1}}],["172",{"2":{"429":2,"439":2,"440":2}}],["17",{"2":{"275":1,"290":1}}],["15",{"2":{"275":1,"283":4,"876":1}}],["1500",{"2":{"428":10,"433":3}}],["150",{"2":{"191":2}}],["1键盘输入",{"2":{"227":1}}],["1表示左侧键盘",{"2":{"227":1}}],["1开始",{"2":{"226":1,"234":1}}],["110",{"2":{"443":1}}],["1100",{"2":{"298":1}}],["110101",{"2":{"290":1}}],["11位指数位",{"2":{"295":1}}],["11110",{"2":{"446":1}}],["1111",{"2":{"445":1}}],["11111101",{"2":{"294":1}}],["11111110",{"2":{"294":3}}],["11111111",{"2":{"294":1,"548":6}}],["1110",{"2":{"444":1}}],["11100",{"2":{"298":1}}],["11100111",{"2":{"289":1}}],["113",{"2":{"283":1}}],["112",{"2":{"283":1}}],["11",{"2":{"225":2,"280":1,"283":2,"284":1,"548":2,"667":1}}],["16777214",{"2":{"429":1,"440":1}}],["16384",{"2":{"428":2,"440":1}}],["16383",{"2":{"283":2}}],["168",{"2":{"424":10,"428":4,"429":2,"439":2,"440":2,"548":6,"550":1}}],["16",{"2":{"208":18,"209":6,"277":1,"279":1,"283":2,"289":3,"429":2,"439":1,"440":1,"674":1,"876":1}}],["1+",{"2":{"196":1,"225":2}}],["103",{"0":{"505":1}}],["10mbps",{"2":{"463":1}}],["101",{"0":{"503":1},"2":{"298":2,"490":3}}],["102",{"0":{"504":1}}],["1023",{"2":{"283":1}}],["1022",{"2":{"280":1}}],["10^308",{"2":{"280":1}}],["10",{"2":{"188":11,"283":1,"296":2,"297":1,"421":4,"429":3,"439":2,"440":2,"442":1,"548":6,"674":1,"860":4}}],["100ms",{"2":{"821":2}}],["100vh",{"2":{"595":2}}],["1001",{"2":{"296":5,"297":2,"298":1}}],["100",{"0":{"502":1},"2":{"188":11,"190":3,"191":2,"298":1,"345":1,"428":2,"429":1,"463":1,"666":6,"821":2}}],["100px",{"2":{"168":4,"188":4,"644":2,"647":2,"655":2,"718":4}}],["10000mbps",{"2":{"463":1}}],["100000000",{"2":{"294":2}}],["10000000",{"2":{"294":1}}],["10000",{"2":{"190":2,"191":2}}],["1000",{"2":{"86":2,"89":2,"92":2,"287":1,"463":1}}],["10+",{"2":{"62":1}}],["1",{"0":{"499":1,"510":2},"2":{"4":5,"8":4,"12":1,"24":1,"112":2,"114":1,"168":6,"179":1,"188":2,"190":8,"191":2,"208":4,"210":20,"221":1,"226":1,"243":1,"246":2,"253":2,"263":1,"268":2,"271":1,"280":1,"283":5,"284":1,"287":1,"288":5,"294":8,"296":6,"297":7,"298":5,"303":2,"326":2,"344":2,"345":1,"348":4,"421":4,"424":12,"428":6,"429":12,"440":4,"441":1,"443":1,"446":4,"459":1,"490":10,"494":1,"575":1,"579":1,"594":4,"618":2,"644":3,"646":9,"647":1,"648":2,"663":1,"664":5,"666":5,"668":10,"669":10,"671":2,"672":14,"674":1,"678":3,"679":3,"680":2,"681":8,"683":10,"713":2,"723":2,"742":2,"743":2,"761":3,"762":2,"766":1,"775":4,"776":4,"801":6,"802":6,"803":2,"806":2,"809":3,"810":2,"815":9,"835":2,"859":6,"860":4,"862":2,"864":2,"865":4,"866":2,"874":2,"877":2}}],["x2",{"2":{"671":4}}],["x1",{"2":{"671":6}}],["xml",{"2":{"514":1}}],["xhtml",{"2":{"618":2}}],["xhc20",{"2":{"428":2}}],["xhr",{"2":{"44":1}}],["xsrf",{"2":{"402":1}}],["xss",{"0":{"68":1},"1":{"69":1,"70":1,"71":1,"72":1},"2":{"72":1}}],["xx2",{"2":{"321":4}}],["xx3",{"2":{"317":1}}],["xx1",{"2":{"317":2,"321":6,"322":8}}],["xx",{"2":{"304":2,"870":1}}],["xxx",{"2":{"137":1,"143":2,"832":5}}],["xxxx",{"2":{"104":1,"106":4}}],["x^",{"2":{"298":1}}],["x86",{"2":{"283":1}}],["x",{"2":{"4":6,"158":4,"280":1,"345":1,"454":1,"586":1,"663":4,"701":1,"753":4,"844":2,"859":2,"861":4,"864":4,"866":10,"874":10}}],["均摊时间复杂度",{"2":{"2":1}}],["平均情况时间复杂度",{"2":{"2":1}}],["最接近的",{"2":{"806":2}}],["最理想的继承范式",{"2":{"762":1}}],["最权威的机构",{"2":{"567":1}}],["最高位必须为",{"2":{"445":1}}],["最终字节",{"2":{"815":1}}],["最终会导致dom渲染的结果不可预期",{"2":{"731":1}}],["最终可能不会被执行",{"2":{"509":1}}],["最终输出到屏幕上",{"2":{"368":1}}],["最终版",{"2":{"94":1}}],["最好不要在此修改",{"2":{"312":1}}],["最好情况时间复杂度",{"2":{"2":1}}],["最大网络数",{"2":{"440":1}}],["最大传输单元",{"2":{"433":1}}],["最大主机数",{"2":{"429":1}}],["最大内容绘制控制在",{"2":{"379":1}}],["最大内容绘制",{"2":{"379":1}}],["最大偏移高度",{"2":{"191":2}}],["最大单元格数",{"0":{"126":1}}],["最小的单个字符或字符串",{"2":{"172":1}}],["最初提供给mutationobserver构造函数",{"2":{"162":1,"757":1}}],["最后使用",{"2":{"353":1}}],["最后一位表示透明度",{"2":{"208":2}}],["最后一个元素替换删除元素",{"2":{"12":1}}],["最后再根据字节码来执行程序",{"2":{"170":1}}],["最后再生成处理器能够理解的机器码",{"2":{"170":1}}],["最后的二进制文件也不会生成成功",{"2":{"170":1}}],["最后在执行一次",{"2":{"95":1}}],["最后定时器再执行一次",{"2":{"81":1}}],["最坏情况时间复杂度",{"2":{"2":1}}],["乘法法则",{"2":{"1":1}}],["fbound",{"2":{"806":6}}],["ftobind",{"2":{"806":4}}],["ftp",{"2":{"471":1,"478":1,"482":1}}],["fe1a",{"2":{"428":4}}],["fe80",{"2":{"428":12}}],["f8",{"2":{"428":4}}],["fwddelay",{"2":{"428":2}}],["ff",{"2":{"422":12,"814":1}}],["friends",{"2":{"761":16}}],["franklin",{"2":{"666":2}}],["frames",{"0":{"624":1},"2":{"419":1}}],["from",{"0":{"840":1},"2":{"253":8,"262":2,"265":2,"306":4,"668":4,"672":2,"675":2,"680":2,"841":4,"843":2,"844":2,"847":2,"849":2,"857":4,"876":2}}],["fromcharcode",{"2":{"227":1}}],["fromarray",{"2":{"18":1}}],["fmp",{"0":{"386":1}}],["fcp",{"0":{"384":1}}],["fp",{"0":{"383":1}}],["flase",{"2":{"664":2}}],["flags",{"2":{"428":2,"433":1,"666":1}}],["flags=3",{"2":{"428":4}}],["flags=8943",{"2":{"428":2}}],["flags=8963",{"2":{"428":4}}],["flags=8843",{"2":{"428":2}}],["flags=8863",{"2":{"428":6}}],["flags=8051",{"2":{"428":4}}],["flags=8010",{"2":{"428":2}}],["flags=8049",{"2":{"428":2}}],["flags=0",{"2":{"428":4}}],["flex",{"0":{"588":1,"589":1,"594":2,"651":1},"1":{"589":1,"590":2,"591":2,"592":2,"593":2,"594":2,"595":2},"2":{"575":2,"589":2,"590":2,"591":2,"592":2,"593":2,"594":8,"595":4,"651":2}}],["float",{"0":{"596":1,"597":1,"598":1,"650":1},"1":{"597":1,"598":2,"599":2,"600":2,"601":1,"602":1,"603":1},"2":{"575":3,"576":1,"582":1,"599":2,"650":2}}],["flow",{"0":{"579":1},"2":{"326":4,"575":1}}],["floor",{"2":{"188":4,"190":2}}],["flushed",{"2":{"345":1}}],["flush",{"2":{"95":1,"98":6}}],["funding",{"2":{"832":1}}],["functon",{"2":{"869":1}}],["functions",{"0":{"861":1}}],["function",{"2":{"76":3,"79":3,"82":3,"86":3,"89":3,"92":3,"98":23,"106":2,"139":2,"144":2,"147":6,"167":2,"168":26,"188":2,"190":4,"191":6,"195":4,"208":4,"209":2,"210":4,"211":1,"217":2,"218":2,"219":2,"221":3,"268":5,"269":2,"270":2,"271":3,"301":4,"303":4,"304":9,"339":2,"419":4,"669":7,"672":2,"675":2,"684":2,"713":8,"715":4,"718":5,"737":6,"761":23,"762":24,"764":6,"775":1,"797":6,"801":4,"802":2,"806":18,"810":8,"821":2,"842":4,"843":2,"844":2,"854":6,"860":9,"861":3,"863":2,"866":7,"870":2}}],["func",{"2":{"98":4,"740":2,"866":2}}],["future",{"2":{"635":1}}],["fullscreen",{"2":{"635":1}}],["full",{"2":{"428":4}}],["fulltemplate",{"2":{"143":4}}],["fallback",{"2":{"677":2}}],["falsefunction",{"2":{"761":1}}],["false",{"2":{"77":2,"87":2,"96":4,"112":2,"114":1,"160":19,"218":3,"221":1,"230":1,"253":12,"269":2,"309":2,"419":4,"666":6,"668":1,"669":8,"712":1,"716":1,"723":2,"737":2,"755":19,"761":3,"857":6,"858":1,"866":2}}],["fast",{"2":{"433":2}}],["facepunch",{"2":{"345":1}}],["factory",{"2":{"301":4,"303":3}}],["favicon",{"0":{"145":1},"2":{"134":2}}],["found",{"0":{"520":1,"532":1}}],["four",{"2":{"345":1}}],["folder",{"2":{"253":2,"847":4}}],["footer",{"2":{"595":6}}],["footprints",{"2":{"345":1}}],["football",{"2":{"345":1}}],["foo",{"2":{"246":2,"664":2,"666":8,"667":6,"739":10,"741":2,"775":4,"776":6,"797":16,"801":7,"802":8,"809":10}}],["focusout",{"2":{"225":2}}],["focusoffset",{"2":{"114":2}}],["focusin",{"2":{"225":2}}],["focus",{"2":{"225":2,"635":3}}],["focusevent",{"2":{"223":2}}],["focusnode",{"2":{"114":3}}],["forwareref",{"2":{"877":2}}],["forwardref",{"2":{"877":3}}],["forward",{"2":{"231":1,"268":1}}],["forwards",{"2":{"167":1}}],["foreach",{"2":{"668":2}}],["forecolor",{"2":{"113":1}}],["forbidden",{"0":{"531":1}}],["forms",{"2":{"717":1}}],["form",{"2":{"402":2,"454":2}}],["formatting",{"2":{"574":1,"577":1}}],["format",{"2":{"253":4}}],["formatblock",{"2":{"113":2}}],["forgery",{"2":{"402":1}}],["fork",{"2":{"257":2}}],["force",{"2":{"253":2}}],["for",{"2":{"191":2,"253":4,"380":2,"667":5,"669":2,"837":1}}],["fontface",{"0":{"625":1}}],["font",{"0":{"649":1},"2":{"618":2,"630":2,"649":4}}],["fontsize",{"2":{"113":1}}],["fontname",{"2":{"113":1}}],["fs",{"2":{"104":1}}],["fnop",{"2":{"806":8}}],["fn",{"2":{"76":4,"77":2,"79":4,"82":6,"83":2,"86":6,"87":2,"89":4,"92":6,"93":2,"95":1,"96":2,"97":2,"98":4,"806":8,"810":6}}],["fish",{"2":{"863":4}}],["fields",{"2":{"832":1}}],["figcaption",{"0":{"695":1}}],["figure",{"0":{"695":1}}],["finally",{"2":{"669":2}}],["findmin",{"2":{"20":1}}],["find",{"2":{"12":1,"18":1,"20":1}}],["fi",{"2":{"511":1}}],["fixed",{"2":{"575":1}}],["fixes",{"2":{"253":2}}],["fix",{"2":{"253":10}}],["fixing",{"2":{"253":2}}],["firefox",{"2":{"212":1,"218":1,"226":1,"231":1,"311":1,"312":1,"347":1,"404":1,"674":1}}],["firefox4+",{"2":{"196":1}}],["firstchild",{"2":{"717":1}}],["firstelementchild",{"2":{"717":1}}],["first",{"2":{"56":1,"143":2,"383":1,"384":1,"386":1,"390":1,"633":2,"635":3,"859":2}}],["file=",{"2":{"262":2,"265":2}}],["fileeslint",{"2":{"253":1}}],["file",{"2":{"253":21,"262":4,"265":4}}],["files",{"2":{"239":2,"247":2,"253":8,"269":2,"832":3,"857":2}}],["filename",{"2":{"104":1,"134":2,"143":2,"147":2,"253":4,"424":1}}],["fill",{"2":{"167":1}}],["fid",{"0":{"390":1},"2":{"56":1}}],["f",{"2":{"0":2,"208":2,"253":2,"668":2,"669":30,"715":4,"762":6,"815":1}}],["====",{"2":{"548":2,"661":2}}],["===",{"0":{"721":1},"2":{"98":8,"168":4,"206":1,"208":3,"219":2,"232":2,"402":1,"444":1,"480":1,"550":1,"566":1,"667":2,"668":2,"761":6,"810":2,"832":1}}],["==",{"0":{"720":1},"2":{"4":1,"147":2,"210":2,"211":2,"303":1,"419":4,"669":2,"672":2,"723":2,"761":2,"806":2,"821":2,"877":4}}],["=",{"0":{"295":1,"723":1},"1":{"296":1,"297":1,"298":1,"299":1},"2":{"0":2,"4":1,"13":6,"19":14,"76":8,"79":12,"82":16,"86":8,"89":10,"92":24,"98":76,"102":6,"104":8,"106":4,"112":2,"114":8,"131":6,"132":3,"134":4,"139":2,"143":18,"144":6,"145":4,"146":2,"147":20,"149":2,"153":4,"155":6,"156":11,"157":10,"158":10,"159":14,"160":3,"168":26,"181":2,"188":20,"190":16,"191":28,"195":8,"200":8,"201":6,"202":4,"203":4,"208":28,"209":6,"210":20,"211":28,"217":4,"218":2,"219":2,"222":1,"223":4,"226":1,"227":3,"229":3,"230":3,"231":2,"232":2,"233":1,"234":2,"237":3,"250":1,"252":3,"271":7,"280":1,"287":3,"288":6,"289":3,"290":3,"294":4,"296":6,"297":7,"303":4,"304":4,"305":10,"309":3,"347":8,"380":2,"395":2,"396":2,"399":4,"400":2,"419":2,"429":3,"494":6,"580":1,"600":1,"664":6,"666":24,"667":4,"668":2,"669":20,"671":14,"672":22,"675":4,"693":1,"694":1,"698":1,"713":4,"715":36,"716":2,"717":18,"718":31,"723":8,"736":6,"739":6,"740":2,"741":2,"742":4,"743":2,"744":1,"748":4,"750":6,"751":11,"752":10,"753":10,"754":14,"755":3,"761":50,"762":30,"764":18,"766":1,"770":1,"775":2,"776":12,"794":1,"797":4,"801":6,"802":8,"803":4,"806":14,"809":8,"810":10,"815":1,"835":6,"837":4,"842":2,"843":2,"848":4,"849":2,"852":6,"854":4,"857":14,"859":19,"860":26,"861":6,"862":4,"863":1,"864":2,"865":4,"866":21,"870":6,"871":2,"874":4,"876":12,"877":16}}],["nbsp",{"2":{"717":2}}],["nbar",{"2":{"666":4}}],["nth",{"2":{"635":6}}],["nh",{"2":{"475":1}}],["npmignore",{"2":{"832":1}}],["npm",{"2":{"330":2,"832":1}}],["nginxlocation",{"2":{"269":1}}],["nginx",{"2":{"269":1}}],["nubmer",{"2":{"866":2,"874":2}}],["numeric",{"2":{"862":1,"865":1}}],["number",{"2":{"167":4,"188":2,"237":1,"253":4,"259":2,"268":1,"630":1,"718":2,"788":1,"837":3,"844":2,"859":11,"860":14,"861":12,"864":6,"865":1,"866":2,"872":1,"874":4}}],["nul",{"2":{"262":2,"265":2}}],["null除外",{"2":{"668":1}}],["null",{"2":{"19":4,"76":4,"79":8,"82":8,"86":4,"89":6,"92":10,"112":4,"113":18,"114":1,"147":2,"149":2,"156":19,"168":2,"664":2,"666":2,"718":2,"735":1,"736":2,"737":7,"738":1,"751":19,"769":1,"788":1,"808":2,"837":3,"838":1,"859":3,"865":1,"877":4}}],["nreturn",{"2":{"147":2}}],["nvar",{"2":{"147":2}}],["native",{"2":{"715":6}}],["nav",{"0":{"697":1}}],["navigator",{"0":{"199":1},"1":{"200":1,"201":1,"202":1,"203":1},"2":{"198":1,"200":4,"201":2,"202":1,"203":1}}],["navigationstart",{"2":{"43":1}}],["nan",{"2":{"664":2,"668":3}}],["namedmodule",{"2":{"854":4}}],["namednodemap",{"2":{"716":1}}],["nameitem",{"2":{"716":1}}],["namesapce",{"2":{"852":1}}],["namespaces",{"0":{"852":1,"853":1},"2":{"853":1}}],["namespace",{"0":{"618":1},"2":{"618":4,"844":2,"852":7,"853":1,"870":2,"874":7}}],["names",{"2":{"155":2,"750":2}}],["name=",{"2":{"131":2,"146":2,"147":4,"854":2}}],["name",{"2":{"112":2,"141":1,"143":4,"167":1,"345":3,"641":2,"701":3,"718":2,"761":54,"762":13,"764":8,"832":2}}],["nolib",{"2":{"854":1}}],["noresolve",{"2":{"851":1,"854":1}}],["noresolvetsc",{"2":{"851":1}}],["normalize",{"2":{"716":1}}],["normal",{"2":{"326":2,"630":1,"640":1}}],["noimplicitthis",{"2":{"838":1}}],["noinlineconfig",{"2":{"248":1}}],["noscript",{"0":{"677":1},"2":{"677":5}}],["nomodule",{"0":{"677":1},"2":{"677":3}}],["note",{"2":{"859":1}}],["noticetext",{"2":{"330":2}}],["notice",{"2":{"330":3}}],["not",{"0":{"522":1,"532":1,"533":1,"534":1,"540":1},"2":{"326":2,"635":1,"677":2,"682":2,"775":2,"797":2,"801":2,"806":2}}],["nonnullable",{"2":{"838":1}}],["non",{"0":{"510":1}}],["nonzero",{"2":{"253":2}}],["none",{"2":{"167":1,"168":15,"402":1,"522":1,"598":1,"603":1,"636":1,"640":1,"653":2}}],["no",{"0":{"511":1},"2":{"246":2,"253":10,"259":2,"326":2,"461":14,"640":2,"682":4,"761":5,"762":5,"764":2,"854":2}}],["nowrap",{"2":{"326":2}}],["now",{"2":{"82":12,"86":10,"92":10,"98":4,"399":2,"841":2}}],["nodes",{"2":{"160":1,"356":1,"755":1}}],["nodelist",{"2":{"156":11,"716":1,"751":11}}],["nodejs",{"0":{"147":1,"817":1},"1":{"818":1,"819":1,"820":1,"821":1,"822":1,"823":1,"824":1,"825":1,"826":1,"827":1,"828":1,"829":1,"830":1},"2":{"35":1,"99":1,"101":1,"147":1,"305":1,"868":1}}],["node",{"0":{"848":1},"2":{"19":2,"23":1,"106":2,"114":4,"168":50,"240":1,"715":6,"824":1,"832":2,"842":2,"843":4,"848":9,"849":24,"850":2,"857":4,"877":8}}],["never",{"2":{"859":2}}],["network",{"0":{"544":1},"2":{"475":1}}],["netmask",{"2":{"424":2,"428":4}}],["net",{"2":{"421":1,"433":1}}],["nexttickqueue",{"2":{"828":1}}],["nexttick",{"0":{"820":1,"828":1,"829":1,"830":1},"1":{"829":1,"830":1},"2":{"820":4,"826":1,"828":1,"829":1}}],["nextelementsibling",{"2":{"717":1}}],["nextsibling",{"2":{"156":5,"717":1,"751":5}}],["nextnode",{"2":{"19":8}}],["next",{"2":{"16":1,"19":4,"246":4,"424":2,"669":16}}],["newoption",{"2":{"718":1}}],["newbase",{"2":{"256":4,"257":1}}],["newurl",{"2":{"232":1}}],["newsource",{"2":{"147":6}}],["new",{"0":{"804":1},"2":{"13":2,"102":2,"104":2,"106":4,"134":2,"139":12,"143":2,"153":2,"155":2,"156":2,"157":2,"158":2,"159":2,"160":2,"200":4,"380":1,"399":2,"668":2,"669":5,"670":1,"671":10,"748":2,"750":2,"751":2,"752":2,"753":2,"754":2,"755":2,"761":16,"762":8,"764":1,"804":3,"805":2,"806":5,"852":2,"866":8}}],["n",{"2":{"0":6,"147":32,"259":2,"265":2,"666":1,"736":4,"815":20}}],["tuple",{"2":{"859":1}}],["turbofan",{"2":{"174":2}}],["tsexport",{"2":{"870":1}}],["tsfunction",{"2":{"866":3}}],["tstype",{"2":{"862":2}}],["tsinterface",{"2":{"860":3,"866":1}}],["tsimport",{"2":{"840":1,"871":1}}],["tslet",{"2":{"859":3,"861":1}}],["tsnamespace",{"2":{"852":1}}],["tsclass",{"2":{"864":1,"874":2}}],["tsc",{"2":{"851":2,"858":9}}],["tsconfig",{"0":{"856":1},"1":{"857":1,"858":1},"2":{"846":1,"850":2,"857":6,"858":2,"870":2}}],["tsx",{"2":{"849":8}}],["ts",{"0":{"870":1,"872":1},"2":{"841":1,"842":1,"843":6,"844":3,"847":11,"849":21,"850":10,"852":6,"854":5,"857":4,"858":4,"859":2,"860":2,"863":1,"865":1,"866":2,"869":4,"870":4,"871":2,"872":1}}],["tso6",{"2":{"428":6}}],["tso4",{"2":{"428":6}}],["twice",{"2":{"666":18}}],["two",{"2":{"666":2,"859":2}}],["tc",{"2":{"646":32}}],["tcp",{"0":{"478":1},"1":{"479":1,"480":1,"481":1,"482":1,"483":1},"2":{"427":1,"433":1,"447":1,"459":1,"466":1,"474":1,"478":2,"481":4,"483":2,"488":1,"552":1,"819":1,"822":1}}],["tb",{"2":{"580":1}}],["tbt",{"0":{"389":1},"2":{"56":1}}],["tls",{"2":{"459":1,"552":1}}],["txstatus",{"2":{"428":2}}],["txcsum",{"2":{"428":4}}],["txtsrc",{"2":{"850":1}}],["txtday1",{"2":{"850":1}}],["txtip",{"2":{"548":1}}],["txthttp",{"2":{"490":1}}],["txtget",{"2":{"490":1}}],["txtalign",{"2":{"326":1}}],["txtls",{"2":{"318":1}}],["txt",{"2":{"294":1,"318":11,"322":12}}],["txtthe",{"2":{"326":1}}],["txtt",{"2":{"0":1}}],["tftp",{"2":{"425":3}}],["typeacquisition",{"2":{"857":4}}],["typeroots",{"2":{"857":2}}],["typeerror",{"2":{"769":1,"801":2,"806":2}}],["typedarray",{"2":{"671":1}}],["typeof",{"2":{"663":1,"718":2,"761":2,"806":2,"837":1,"842":1}}],["type=image",{"2":{"638":1}}],["type=",{"0":{"673":1},"1":{"674":1,"675":1,"676":1,"677":1,"678":1,"679":1,"680":1,"681":1,"682":1,"683":1,"684":1},"2":{"608":1,"675":2,"677":2,"678":2,"679":2,"680":4,"681":6,"682":6,"683":8,"684":2,"717":2}}],["types=",{"2":{"854":2,"871":2}}],["typescriptlang",{"2":{"843":2}}],["typescript",{"0":{"836":1,"849":1,"855":1,"867":1},"1":{"837":1,"838":1,"839":1,"840":1,"841":1,"842":1,"843":1,"844":1,"845":1,"846":1,"847":1,"848":1,"849":1,"850":1,"851":1,"852":1,"853":1,"854":1,"856":1,"857":1,"858":1,"859":1,"860":1,"861":1,"862":1,"863":1,"864":1,"865":1,"866":1,"868":1,"869":1,"870":1,"871":1,"872":1,"873":1,"874":1},"2":{"238":1,"841":1,"859":1,"867":1}}],["types",{"0":{"838":1,"841":1,"862":1,"863":1},"2":{"198":1,"253":2,"837":3,"849":7,"857":4,"860":4,"861":1,"863":1,"876":2}}],["type",{"0":{"205":1,"537":1,"684":1,"837":1,"859":1},"2":{"156":5,"195":2,"198":1,"200":2,"205":1,"206":2,"221":1,"222":1,"253":2,"380":2,"428":2,"482":1,"635":5,"701":1,"715":16,"751":5,"832":2,"837":5,"838":21,"841":3,"854":1,"857":2,"859":1,"862":2,"874":4}}],["table",{"2":{"575":2,"628":1}}],["tab",{"2":{"350":1,"354":2,"726":1,"729":1,"814":1}}],["tada",{"2":{"345":1}}],["takerecords",{"0":{"163":1,"758":1}}],["targetorigin",{"2":{"419":3}}],["target",{"2":{"156":5,"158":2,"221":2,"230":1,"635":2,"670":1,"716":2,"718":2,"751":5,"753":2,"857":4}}],["tapable",{"2":{"139":3}}],["tapasync",{"2":{"131":2,"138":1,"139":1,"143":2,"145":2}}],["tap",{"2":{"106":2,"137":2}}],["telnet",{"2":{"471":1}}],["temporary",{"0":{"525":1}}],["temporarily",{"0":{"520":1}}],["temp",{"2":{"252":1,"718":12}}],["template1",{"2":{"850":4}}],["templates",{"2":{"304":2,"850":4}}],["templatepath",{"2":{"304":2}}],["templateparams",{"2":{"147":6}}],["template绝对地址为",{"2":{"143":2}}],["template",{"2":{"134":2,"143":2,"147":4}}],["textcontent",{"2":{"675":2,"717":1}}],["textinput输入实际字符的键时会触发",{"2":{"227":1}}],["textinput",{"2":{"227":2}}],["text=",{"2":{"195":2}}],["text",{"2":{"160":1,"195":4,"200":8,"201":4,"205":1,"206":1,"608":1,"675":4,"701":1,"718":8,"755":1}}],["textnode",{"2":{"151":1,"746":1}}],["textarea",{"2":{"111":1,"195":2}}],["tester",{"2":{"352":1}}],["testing",{"2":{"351":1}}],["tests",{"2":{"250":1}}],["test",{"2":{"144":2,"250":1,"419":12,"666":20,"852":2,"857":6}}],["tick",{"2":{"829":1}}],["tirm",{"2":{"494":2}}],["tiling",{"0":{"363":1}}],["tips",{"2":{"364":1}}],["tip",{"2":{"343":2,"378":1}}],["tip带符号位的机器数对应的真正数值称为机器数的真值带符号位的机器数对应的真正数值称为机器数的真值",{"2":{"291":1}}],["timing",{"2":{"167":2,"380":1}}],["timestamp",{"2":{"428":2}}],["timesincelastinvoke",{"2":{"98":10}}],["timesincelastcall",{"2":{"98":12}}],["timewating",{"2":{"98":6}}],["timers",{"0":{"821":1},"2":{"820":1}}],["timer",{"2":{"98":4,"819":1}}],["timerexpired",{"2":{"98":10}}],["timerid2",{"2":{"92":12}}],["timerid",{"2":{"76":8,"79":14,"82":12,"89":12,"92":8,"98":16}}],["timeout",{"0":{"536":1,"543":1},"2":{"89":2,"92":2,"428":2}}],["time",{"0":{"694":1},"2":{"56":3,"98":48,"388":1,"389":1,"424":6,"694":4}}],["title=",{"2":{"689":2}}],["title",{"0":{"146":1},"1":{"147":1},"2":{"131":4,"134":10,"146":6,"147":12}}],["tight",{"2":{"98":2}}],["thunk",{"2":{"669":1}}],["that",{"2":{"666":2}}],["thawte",{"2":{"568":1}}],["than",{"2":{"326":2}}],["th",{"2":{"474":1}}],["throw",{"2":{"669":3,"806":2}}],["throttle",{"0":{"97":1},"2":{"86":2,"87":2,"89":2,"92":2,"93":2,"94":1,"97":2}}],["thrread",{"2":{"359":1}}],["thread",{"2":{"349":2,"353":2,"367":1}}],["those",{"2":{"253":2}}],["them",{"2":{"666":2}}],["the",{"2":{"184":1,"253":18,"326":23,"666":2,"861":1}}],["then",{"2":{"145":2,"200":2,"201":2,"202":2,"203":2,"762":2}}],["thistype",{"2":{"838":1}}],["thisparametertype",{"2":{"838":1}}],["thiscompilation",{"0":{"137":1},"2":{"132":2,"137":2,"143":2}}],["this",{"0":{"796":1,"798":1,"808":1},"1":{"797":1,"798":1,"799":2,"800":2,"801":2,"802":2,"803":2,"804":2,"805":2,"806":2,"807":2,"808":2,"809":2,"810":2,"811":2},"2":{"13":4,"98":2,"219":2,"221":1,"222":1,"253":4,"669":14,"670":2,"682":2,"761":33,"762":12,"764":10,"794":1,"796":4,"797":9,"799":1,"800":1,"801":6,"802":4,"803":4,"804":1,"806":18,"808":1,"810":9,"811":1,"838":4,"850":4,"861":4,"864":1,"876":4,"877":12}}],["tti",{"0":{"388":1},"2":{"56":1}}],["ttsr",{"2":{"56":1}}],["toggle",{"2":{"717":1}}],["tools",{"2":{"421":1}}],["toc",{"2":{"340":2}}],["toutcstring",{"2":{"399":3}}],["tourl",{"2":{"304":3}}],["touchcancel",{"2":{"234":1}}],["touchend",{"2":{"234":2}}],["touchmove",{"2":{"234":1}}],["touchstart",{"2":{"234":2}}],["tofixed",{"2":{"299":1}}],["todo",{"2":{"256":2}}],["toprecision",{"2":{"299":1}}],["top",{"0":{"188":1,"600":1},"2":{"188":16,"255":1,"326":1,"583":3,"586":2,"590":2,"594":2,"595":2,"600":3,"718":8}}],["token",{"2":{"172":2,"356":1,"766":1}}],["tokenize",{"2":{"172":1}}],["total",{"2":{"56":1,"389":1}}],["to",{"2":{"56":2,"208":3,"209":3,"253":24,"388":1,"806":2,"850":2,"876":1}}],["tostring",{"2":{"18":1,"20":2,"98":2,"114":1,"208":6,"209":6,"271":1}}],["toarray",{"2":{"18":1}}],["trying",{"2":{"806":2}}],["try",{"2":{"269":2,"669":2}}],["triple",{"0":{"854":1}}],["triangle",{"2":{"852":2}}],["trim",{"2":{"586":1}}],["trident",{"2":{"347":2}}],["trigger",{"2":{"253":2}}],["trie",{"2":{"14":1}}],["trusted",{"2":{"221":1}}],["truefunction",{"2":{"761":1}}],["truevar",{"2":{"723":1}}],["trueconst",{"2":{"666":1}}],["true",{"2":{"77":2,"83":4,"87":2,"93":4,"95":1,"97":4,"98":4,"134":2,"147":2,"155":2,"156":2,"157":2,"158":4,"159":4,"160":1,"168":2,"218":1,"219":2,"221":3,"231":1,"242":2,"250":1,"380":2,"408":1,"666":17,"667":2,"668":1,"669":7,"712":1,"713":4,"716":1,"723":3,"737":2,"750":2,"751":2,"752":2,"753":4,"754":4,"755":1,"761":1,"762":2,"854":2,"857":2,"858":1,"860":2,"866":4,"870":2,"871":1}}],["traversal",{"2":{"717":1}}],["traverseinorder",{"2":{"20":1}}],["traceresolution",{"2":{"851":2}}],["trace",{"0":{"457":1},"2":{"461":1}}],["transimission",{"2":{"572":1}}],["transitionend",{"2":{"168":15}}],["transitionstart",{"2":{"168":4}}],["transition",{"2":{"167":6,"168":2}}],["transmission",{"2":{"478":1}}],["transport",{"2":{"474":1,"571":2}}],["transferable",{"2":{"419":1}}],["transfer",{"2":{"419":3,"450":1}}],["transfom",{"2":{"168":2}}],["transform",{"0":{"188":1},"2":{"168":2,"359":1}}],["trailingedge",{"2":{"98":4}}],["trailing",{"2":{"77":2,"83":2,"87":2,"93":2,"95":1,"96":2,"97":2,"98":16}}],["trees",{"2":{"359":1}}],["tree",{"0":{"373":1},"2":{"6":1,"50":1,"65":1,"262":6,"265":6,"356":2,"357":2}}],["t",{"2":{"0":2,"147":6,"210":20,"815":1,"866":62}}],["omitthisparameter",{"2":{"838":1}}],["omit",{"2":{"838":1}}],["othis",{"2":{"806":6}}],["otherwindow",{"2":{"419":2}}],["other",{"0":{"521":1},"2":{"326":2,"683":4}}],["o2",{"2":{"776":8}}],["o1",{"2":{"776":6}}],["ov",{"2":{"568":2}}],["overloads",{"2":{"861":1,"872":1}}],["overriding",{"2":{"253":2}}],["overrides",{"0":{"247":1},"2":{"239":5,"247":2}}],["overscancount",{"2":{"188":4,"190":6,"191":6}}],["overflow",{"2":{"188":2,"326":10,"575":1,"586":3}}],["ok",{"0":{"507":1},"2":{"844":2,"859":4,"874":6}}],["oy4nraq13jhfonc7bp8dtkb4ptu=",{"2":{"490":1}}],["oy4nraq13jhfonc7bp8dtkb4ptu=http",{"2":{"490":1}}],["osi",{"0":{"470":1},"1":{"471":1,"472":1,"473":1,"474":1,"475":1,"476":1,"477":1},"2":{"464":1,"470":1}}],["ospf",{"2":{"427":1}}],["occurred",{"2":{"328":2}}],["of",{"2":{"253":14,"326":8,"380":2,"635":6,"666":4,"669":2}}],["offer",{"2":{"324":1,"422":2}}],["off",{"2":{"243":1,"244":2,"245":2}}],["offstart",{"2":{"190":4}}],["offsettop",{"2":{"718":1}}],["offsetleft",{"2":{"718":1}}],["offsetwidth",{"2":{"718":1}}],["offsetheight",{"2":{"168":1,"718":1}}],["offset",{"2":{"114":2,"188":6,"190":10,"191":24,"424":2,"718":16}}],["opiton",{"2":{"638":1}}],["optional",{"0":{"842":1},"2":{"461":5,"635":1,"860":1,"861":1}}],["options=201",{"2":{"428":14}}],["options",{"0":{"458":1},"2":{"95":2,"98":14,"134":2,"146":2,"147":4,"253":8,"256":4,"262":6,"461":1,"718":1}}],["open",{"2":{"419":3,"470":1,"640":2}}],["opera",{"2":{"212":1,"218":1,"225":2,"231":1,"347":1,"656":1}}],["opera45+",{"2":{"196":1}}],["opacity",{"2":{"168":6}}],["objb",{"2":{"809":4}}],["obja",{"2":{"809":4}}],["obj",{"2":{"669":10,"739":10,"740":4,"741":4,"742":4,"763":1,"776":4,"802":4,"803":6,"806":2,"810":4,"866":4}}],["object创建了一个childcompiler",{"2":{"140":1}}],["object",{"2":{"72":1,"98":6,"141":1,"143":4,"253":4,"356":1,"638":1,"667":1,"668":2,"669":12,"712":1,"715":10,"761":6,"762":12,"763":3,"788":1,"810":2,"859":1,"876":2}}],["observe",{"0":{"155":1,"160":1,"750":1,"755":1},"2":{"155":2,"156":2,"157":2,"158":4,"159":4,"380":2,"750":2,"751":2,"752":2,"753":4,"754":4}}],["observer",{"2":{"153":2,"155":4,"156":4,"157":8,"158":8,"159":8,"160":2,"748":2,"750":4,"751":4,"752":8,"753":8,"754":8,"755":2}}],["ouputoptions",{"2":{"141":1}}],["outdir",{"2":{"857":2}}],["outdent",{"2":{"113":1}}],["outfile",{"2":{"853":1,"854":1,"857":2}}],["outertext",{"2":{"717":1}}],["outerhtml",{"2":{"717":1}}],["out",{"2":{"167":2,"635":1,"854":1,"862":4}}],["outputoptions",{"2":{"143":2}}],["output",{"2":{"106":1,"139":1,"253":12,"736":4,"835":2}}],["output=",{"2":{"104":1}}],["oldurl",{"2":{"232":1}}],["oldvalue",{"2":{"156":5,"751":5}}],["ol",{"0":{"697":1},"2":{"113":1}}],["one",{"2":{"666":2}}],["onerror",{"2":{"44":1}}],["onload",{"2":{"387":1,"842":2}}],["only",{"0":{"840":1},"2":{"253":4,"394":1,"635":3}}],["onto",{"2":{"256":4,"257":3}}],["onhashchange",{"2":{"232":2}}],["on",{"2":{"219":2,"253":4,"666":2,"819":1}}],["once",{"2":{"712":1,"713":2}}],["onclick=",{"2":{"216":2}}],["onclick",{"2":{"195":4,"217":2,"219":2}}],["onclose",{"2":{"106":4}}],["onchange",{"2":{"149":2}}],["onconnection",{"2":{"106":2}}],["onmessage",{"2":{"106":4}}],["onopen",{"2":{"106":2}}],["org",{"2":{"618":4,"843":2}}],["original",{"2":{"762":4}}],["origin",{"0":{"407":1,"415":1},"2":{"380":1,"405":1,"416":1,"419":6,"490":2,"683":4}}],["orientation",{"2":{"233":1}}],["orientationchange",{"2":{"233":1}}],["orangered",{"2":{"168":2,"876":6}}],["orange",{"2":{"114":2,"644":2,"647":2}}],["or",{"2":{"4":1,"109":2,"208":1,"243":3,"253":4,"263":2,"326":2,"737":2,"796":1,"832":5,"866":4,"870":2,"876":2,"877":4}}],["o",{"0":{"0":1,"819":1},"1":{"1":1,"2":1},"2":{"0":2,"198":1,"253":2,"666":6,"736":4,"761":24,"762":4,"802":6,"819":4,"822":1,"824":3,"826":1,"827":1,"828":1}}],["大端字节序",{"2":{"671":1}}],["大于0xffff的unicode字符码",{"2":{"666":1}}],["大学所学的知识让我充满了迷茫与惆怅",{"2":{"324":1}}],["大数据",{"0":{"125":1}}],["大型项目痛点",{"0":{"62":1},"1":{"63":1,"64":1,"65":1,"66":1}}],["大任务拆解",{"2":{"53":1}}],["大小",{"2":{"13":1,"586":1}}],["大顶堆",{"2":{"12":1}}],["大o表示的并不是程序执行的时间",{"2":{"1":1}}],["大",{"0":{"0":1},"1":{"1":1,"2":1}}]],"serializationVersion":2}';export{t as default};
diff --git a/assets/chunks/VPLocalSearchBox.527b26d1.js b/assets/chunks/VPLocalSearchBox.edacac2c.js
similarity index 99%
rename from assets/chunks/VPLocalSearchBox.527b26d1.js
rename to assets/chunks/VPLocalSearchBox.edacac2c.js
index 08642c7..0428ae0 100644
--- a/assets/chunks/VPLocalSearchBox.527b26d1.js
+++ b/assets/chunks/VPLocalSearchBox.edacac2c.js
@@ -1,4 +1,4 @@
-import{X as pt,h as ie,x as Be,ah as kt,ai as Nt,d as It,E as be,aj as et,g as we,ak as Dt,al as _t,y as Ot,am as Rt,j as De,O as he,V as xe,an as Mt,S as Lt,U as Pt,ao as zt,Y as Bt,s as Vt,ap as $t,o as X,b as Wt,k as F,a1 as jt,l as U,aq as Kt,ar as Jt,as as Ut,c as te,n as tt,e as Fe,D as rt,F as at,a as de,t as ve,at as Ht,p as Gt,m as qt,au as nt,av as Qt,a6 as Yt,ac as Zt,_ as Xt}from"./framework.7c0fadea.js";import{u as er,c as tr}from"./theme.668a0457.js";const rr={root:()=>pt(()=>import("./@localSearchIndexroot.2339654d.js"),[])};/*!
+import{X as pt,h as ie,x as Be,ah as kt,ai as Nt,d as It,E as be,aj as et,g as we,ak as Dt,al as _t,y as Ot,am as Rt,j as De,O as he,V as xe,an as Mt,S as Lt,U as Pt,ao as zt,Y as Bt,s as Vt,ap as $t,o as X,b as Wt,k as F,a1 as jt,l as U,aq as Kt,ar as Jt,as as Ut,c as te,n as tt,e as Fe,D as rt,F as at,a as de,t as ve,at as Ht,p as Gt,m as qt,au as nt,av as Qt,a6 as Yt,ac as Zt,_ as Xt}from"./framework.0e8ae64e.js";import{u as er,c as tr}from"./theme.c533df5a.js";const rr={root:()=>pt(()=>import("./@localSearchIndexroot.a8619f7e.js"),[])};/*!
 * tabbable 6.2.0
 * @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE
 */var yt=["input:not([inert])","select:not([inert])","textarea:not([inert])","a[href]:not([inert])","button:not([inert])","[tabindex]:not(slot):not([inert])","audio[controls]:not([inert])","video[controls]:not([inert])",'[contenteditable]:not([contenteditable="false"]):not([inert])',"details>summary:first-of-type:not([inert])","details:not([inert])"],Ae=yt.join(","),mt=typeof Element>"u",se=mt?function(){}:Element.prototype.matches||Element.prototype.msMatchesSelector||Element.prototype.webkitMatchesSelector,Ce=!mt&&Element.prototype.getRootNode?function(o){var e;return o==null||(e=o.getRootNode)===null||e===void 0?void 0:e.call(o)}:function(o){return o==null?void 0:o.ownerDocument},Te=function o(e,t){var r;t===void 0&&(t=!0);var n=e==null||(r=e.getAttribute)===null||r===void 0?void 0:r.call(e,"inert"),a=n===""||n==="true",i=a||t&&e&&o(e.parentNode);return i},ar=function(e){var t,r=e==null||(t=e.getAttribute)===null||t===void 0?void 0:t.call(e,"contenteditable");return r===""||r==="true"},gt=function(e,t,r){if(Te(e))return[];var n=Array.prototype.slice.apply(e.querySelectorAll(Ae));return t&&se.call(e,Ae)&&n.unshift(e),n=n.filter(r),n},bt=function o(e,t,r){for(var n=[],a=Array.from(e);a.length;){var i=a.shift();if(!Te(i,!1))if(i.tagName==="SLOT"){var s=i.assignedElements(),u=s.length?s:i.children,l=o(u,!0,r);r.flatten?n.push.apply(n,l):n.push({scopeParent:i,candidates:l})}else{var h=se.call(i,Ae);h&&r.filter(i)&&(t||!e.includes(i))&&n.push(i);var d=i.shadowRoot||typeof r.getShadowRoot=="function"&&r.getShadowRoot(i),v=!Te(d,!1)&&(!r.shadowRootFilter||r.shadowRootFilter(i));if(d&&v){var m=o(d===!0?i.children:d.children,!0,r);r.flatten?n.push.apply(n,m):n.push({scopeParent:i,candidates:m})}else a.unshift.apply(a,i.children)}}return n},wt=function(e){return!isNaN(parseInt(e.getAttribute("tabindex"),10))},oe=function(e){if(!e)throw new Error("No node provided");return e.tabIndex<0&&(/^(AUDIO|VIDEO|DETAILS)$/.test(e.tagName)||ar(e))&&!wt(e)?0:e.tabIndex},nr=function(e,t){var r=oe(e);return r<0&&t&&!wt(e)?0:r},ir=function(e,t){return e.tabIndex===t.tabIndex?e.documentOrder-t.documentOrder:e.tabIndex-t.tabIndex},xt=function(e){return e.tagName==="INPUT"},or=function(e){return xt(e)&&e.type==="hidden"},sr=function(e){var t=e.tagName==="DETAILS"&&Array.prototype.slice.apply(e.children).some(function(r){return r.tagName==="SUMMARY"});return t},ur=function(e,t){for(var r=0;r<e.length;r++)if(e[r].checked&&e[r].form===t)return e[r]},lr=function(e){if(!e.name)return!0;var t=e.form||Ce(e),r=function(s){return t.querySelectorAll('input[type="radio"][name="'+s+'"]')},n;if(typeof window<"u"&&typeof window.CSS<"u"&&typeof window.CSS.escape=="function")n=r(window.CSS.escape(e.name));else try{n=r(e.name)}catch(i){return console.error("Looks like you have a radio button with a name attribute containing invalid CSS selector characters and need the CSS.escape polyfill: %s",i.message),!1}var a=ur(n,e.form);return!a||a===e},cr=function(e){return xt(e)&&e.type==="radio"},fr=function(e){return cr(e)&&!lr(e)},hr=function(e){var t,r=e&&Ce(e),n=(t=r)===null||t===void 0?void 0:t.host,a=!1;if(r&&r!==e){var i,s,u;for(a=!!((i=n)!==null&&i!==void 0&&(s=i.ownerDocument)!==null&&s!==void 0&&s.contains(n)||e!=null&&(u=e.ownerDocument)!==null&&u!==void 0&&u.contains(e));!a&&n;){var l,h,d;r=Ce(n),n=(l=r)===null||l===void 0?void 0:l.host,a=!!((h=n)!==null&&h!==void 0&&(d=h.ownerDocument)!==null&&d!==void 0&&d.contains(n))}}return a},it=function(e){var t=e.getBoundingClientRect(),r=t.width,n=t.height;return r===0&&n===0},dr=function(e,t){var r=t.displayCheck,n=t.getShadowRoot;if(getComputedStyle(e).visibility==="hidden")return!0;var a=se.call(e,"details>summary:first-of-type"),i=a?e.parentElement:e;if(se.call(i,"details:not([open]) *"))return!0;if(!r||r==="full"||r==="legacy-full"){if(typeof n=="function"){for(var s=e;e;){var u=e.parentElement,l=Ce(e);if(u&&!u.shadowRoot&&n(u)===!0)return it(e);e.assignedSlot?e=e.assignedSlot:!u&&l!==e.ownerDocument?e=l.host:e=u}e=s}if(hr(e))return!e.getClientRects().length;if(r!=="legacy-full")return!0}else if(r==="non-zero-area")return it(e);return!1},vr=function(e){if(/^(INPUT|BUTTON|SELECT|TEXTAREA)$/.test(e.tagName))for(var t=e.parentElement;t;){if(t.tagName==="FIELDSET"&&t.disabled){for(var r=0;r<t.children.length;r++){var n=t.children.item(r);if(n.tagName==="LEGEND")return se.call(t,"fieldset[disabled] *")?!0:!n.contains(e)}return!0}t=t.parentElement}return!1},ke=function(e,t){return!(t.disabled||Te(t)||or(t)||dr(t,e)||sr(t)||vr(t))},Ve=function(e,t){return!(fr(t)||oe(t)<0||!ke(e,t))},pr=function(e){var t=parseInt(e.getAttribute("tabindex"),10);return!!(isNaN(t)||t>=0)},yr=function o(e){var t=[],r=[];return e.forEach(function(n,a){var i=!!n.scopeParent,s=i?n.scopeParent:n,u=nr(s,i),l=i?o(n.candidates):s;u===0?i?t.push.apply(t,l):t.push(s):r.push({documentOrder:a,tabIndex:u,item:n,isScope:i,content:l})}),r.sort(ir).reduce(function(n,a){return a.isScope?n.push.apply(n,a.content):n.push(a.content),n},[]).concat(t)},mr=function(e,t){t=t||{};var r;return t.getShadowRoot?r=bt([e],t.includeContainer,{filter:Ve.bind(null,t),flatten:!1,getShadowRoot:t.getShadowRoot,shadowRootFilter:pr}):r=gt(e,t.includeContainer,Ve.bind(null,t)),yr(r)},gr=function(e,t){t=t||{};var r;return t.getShadowRoot?r=bt([e],t.includeContainer,{filter:ke.bind(null,t),flatten:!0,getShadowRoot:t.getShadowRoot}):r=gt(e,t.includeContainer,ke.bind(null,t)),r},ue=function(e,t){if(t=t||{},!e)throw new Error("No node provided");return se.call(e,Ae)===!1?!1:Ve(t,e)},br=yt.concat("iframe").join(","),_e=function(e,t){if(t=t||{},!e)throw new Error("No node provided");return se.call(e,br)===!1?!1:ke(t,e)};/*!
diff --git a/assets/chunks/framework.7c0fadea.js b/assets/chunks/framework.0e8ae64e.js
similarity index 79%
rename from assets/chunks/framework.7c0fadea.js
rename to assets/chunks/framework.0e8ae64e.js
index b630ed5..8d74ade 100644
--- a/assets/chunks/framework.7c0fadea.js
+++ b/assets/chunks/framework.0e8ae64e.js
@@ -1,2 +1,2 @@
-function mr(e,t){const n=Object.create(null),r=e.split(",");for(let s=0;s<r.length;s++)n[r[s]]=!0;return t?s=>!!n[s.toLowerCase()]:s=>!!n[s]}const te={},mt=[],Oe=()=>{},di=()=>!1,hi=/^on[^a-z]/,zt=e=>hi.test(e),yr=e=>e.startsWith("onUpdate:"),ue=Object.assign,_r=(e,t)=>{const n=e.indexOf(t);n>-1&&e.splice(n,1)},pi=Object.prototype.hasOwnProperty,X=(e,t)=>pi.call(e,t),U=Array.isArray,yt=e=>An(e)==="[object Map]",Vs=e=>An(e)==="[object Set]",W=e=>typeof e=="function",ne=e=>typeof e=="string",Tn=e=>typeof e=="symbol",ee=e=>e!==null&&typeof e=="object",qs=e=>(ee(e)||W(e))&&W(e.then)&&W(e.catch),zs=Object.prototype.toString,An=e=>zs.call(e),gi=e=>An(e).slice(8,-1),Ys=e=>An(e)==="[object Object]",br=e=>ne(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,It=mr(",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"),Sn=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},mi=/-(\w)/g,Ne=Sn(e=>e.replace(mi,(t,n)=>n?n.toUpperCase():"")),yi=/\B([A-Z])/g,ft=Sn(e=>e.replace(yi,"-$1").toLowerCase()),Rn=Sn(e=>e.charAt(0).toUpperCase()+e.slice(1)),dn=Sn(e=>e?`on${Rn(e)}`:""),ut=(e,t)=>!Object.is(e,t),hn=(e,t)=>{for(let n=0;n<e.length;n++)e[n](t)},mn=(e,t,n)=>{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,value:n})},er=e=>{const t=parseFloat(e);return isNaN(t)?e:t},_i=e=>{const t=ne(e)?Number(e):NaN;return isNaN(t)?e:t};let Yr;const tr=()=>Yr||(Yr=typeof globalThis<"u"?globalThis:typeof self<"u"?self:typeof window<"u"?window:typeof global<"u"?global:{});function vr(e){if(U(e)){const t={};for(let n=0;n<e.length;n++){const r=e[n],s=ne(r)?Ci(r):vr(r);if(s)for(const o in s)t[o]=s[o]}return t}else if(ne(e)||ee(e))return e}const bi=/;(?![^(]*\))/g,vi=/:([^]+)/,wi=/\/\*[^]*?\*\//g;function Ci(e){const t={};return e.replace(wi,"").split(bi).forEach(n=>{if(n){const r=n.split(vi);r.length>1&&(t[r[0].trim()]=r[1].trim())}}),t}function wr(e){let t="";if(ne(e))t=e;else if(U(e))for(let n=0;n<e.length;n++){const r=wr(e[n]);r&&(t+=r+" ")}else if(ee(e))for(const n in e)e[n]&&(t+=n+" ");return t.trim()}const Ei="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly",xi=mr(Ei);function Js(e){return!!e||e===""}const La=e=>ne(e)?e:e==null?"":U(e)||ee(e)&&(e.toString===zs||!W(e.toString))?JSON.stringify(e,Xs,2):String(e),Xs=(e,t)=>t&&t.__v_isRef?Xs(e,t.value):yt(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((n,[r,s])=>(n[`${r} =>`]=s,n),{})}:Vs(t)?{[`Set(${t.size})`]:[...t.values()]}:ee(t)&&!U(t)&&!Ys(t)?String(t):t;let be;class Ti{constructor(t=!1){this.detached=t,this._active=!0,this.effects=[],this.cleanups=[],this.parent=be,!t&&be&&(this.index=(be.scopes||(be.scopes=[])).push(this)-1)}get active(){return this._active}run(t){if(this._active){const n=be;try{return be=this,t()}finally{be=n}}}on(){be=this}off(){be=this.parent}stop(t){if(this._active){let n,r;for(n=0,r=this.effects.length;n<r;n++)this.effects[n].stop();for(n=0,r=this.cleanups.length;n<r;n++)this.cleanups[n]();if(this.scopes)for(n=0,r=this.scopes.length;n<r;n++)this.scopes[n].stop(!0);if(!this.detached&&this.parent&&!t){const s=this.parent.scopes.pop();s&&s!==this&&(this.parent.scopes[this.index]=s,s.index=this.index)}this.parent=void 0,this._active=!1}}}function Ai(e,t=be){t&&t.active&&t.effects.push(e)}function Qs(){return be}function Si(e){be&&be.cleanups.push(e)}const Cr=e=>{const t=new Set(e);return t.w=0,t.n=0,t},Zs=e=>(e.w&Qe)>0,Gs=e=>(e.n&Qe)>0,Ri=({deps:e})=>{if(e.length)for(let t=0;t<e.length;t++)e[t].w|=Qe},Oi=e=>{const{deps:t}=e;if(t.length){let n=0;for(let r=0;r<t.length;r++){const s=t[r];Zs(s)&&!Gs(s)?s.delete(e):t[n++]=s,s.w&=~Qe,s.n&=~Qe}t.length=n}},yn=new WeakMap;let Mt=0,Qe=1;const nr=30;let Se;const lt=Symbol(""),rr=Symbol("");class Er{constructor(t,n=null,r){this.fn=t,this.scheduler=n,this.active=!0,this.deps=[],this.parent=void 0,Ai(this,r)}run(){if(!this.active)return this.fn();let t=Se,n=Ye;for(;t;){if(t===this)return;t=t.parent}try{return this.parent=Se,Se=this,Ye=!0,Qe=1<<++Mt,Mt<=nr?Ri(this):Jr(this),this.fn()}finally{Mt<=nr&&Oi(this),Qe=1<<--Mt,Se=this.parent,Ye=n,this.parent=void 0,this.deferStop&&this.stop()}}stop(){Se===this?this.deferStop=!0:this.active&&(Jr(this),this.onStop&&this.onStop(),this.active=!1)}}function Jr(e){const{deps:t}=e;if(t.length){for(let n=0;n<t.length;n++)t[n].delete(e);t.length=0}}let Ye=!0;const eo=[];function At(){eo.push(Ye),Ye=!1}function St(){const e=eo.pop();Ye=e===void 0?!0:e}function ye(e,t,n){if(Ye&&Se){let r=yn.get(e);r||yn.set(e,r=new Map);let s=r.get(n);s||r.set(n,s=Cr()),to(s)}}function to(e,t){let n=!1;Mt<=nr?Gs(e)||(e.n|=Qe,n=!Zs(e)):n=!e.has(Se),n&&(e.add(Se),Se.deps.push(e))}function De(e,t,n,r,s,o){const i=yn.get(e);if(!i)return;let l=[];if(t==="clear")l=[...i.values()];else if(n==="length"&&U(e)){const c=Number(r);i.forEach((a,f)=>{(f==="length"||!Tn(f)&&f>=c)&&l.push(a)})}else switch(n!==void 0&&l.push(i.get(n)),t){case"add":U(e)?br(n)&&l.push(i.get("length")):(l.push(i.get(lt)),yt(e)&&l.push(i.get(rr)));break;case"delete":U(e)||(l.push(i.get(lt)),yt(e)&&l.push(i.get(rr)));break;case"set":yt(e)&&l.push(i.get(lt));break}if(l.length===1)l[0]&&sr(l[0]);else{const c=[];for(const a of l)a&&c.push(...a);sr(Cr(c))}}function sr(e,t){const n=U(e)?e:[...e];for(const r of n)r.computed&&Xr(r);for(const r of n)r.computed||Xr(r)}function Xr(e,t){(e!==Se||e.allowRecurse)&&(e.scheduler?e.scheduler():e.run())}function Pi(e,t){var n;return(n=yn.get(e))==null?void 0:n.get(t)}const Mi=mr("__proto__,__v_isRef,__isVue"),no=new Set(Object.getOwnPropertyNames(Symbol).filter(e=>e!=="arguments"&&e!=="caller").map(e=>Symbol[e]).filter(Tn)),Qr=Fi();function Fi(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const r=Q(this);for(let o=0,i=this.length;o<i;o++)ye(r,"get",o+"");const s=r[t](...n);return s===-1||s===!1?r[t](...n.map(Q)):s}}),["push","pop","shift","unshift","splice"].forEach(t=>{e[t]=function(...n){At();const r=Q(this)[t].apply(this,n);return St(),r}}),e}function Ii(e){const t=Q(this);return ye(t,"has",e),t.hasOwnProperty(e)}class ro{constructor(t=!1,n=!1){this._isReadonly=t,this._shallow=n}get(t,n,r){const s=this._isReadonly,o=this._shallow;if(n==="__v_isReactive")return!s;if(n==="__v_isReadonly")return s;if(n==="__v_isShallow")return o;if(n==="__v_raw"&&r===(s?o?qi:lo:o?io:oo).get(t))return t;const i=U(t);if(!s){if(i&&X(Qr,n))return Reflect.get(Qr,n,r);if(n==="hasOwnProperty")return Ii}const l=Reflect.get(t,n,r);return(Tn(n)?no.has(n):Mi(n))||(s||ye(t,"get",n),o)?l:ce(l)?i&&br(n)?l:l.value:ee(l)?s?Mn(l):Pn(l):l}}class so extends ro{constructor(t=!1){super(!1,t)}set(t,n,r,s){let o=t[n];if(Ct(o)&&ce(o)&&!ce(r))return!1;if(!this._shallow&&(!_n(r)&&!Ct(r)&&(o=Q(o),r=Q(r)),!U(t)&&ce(o)&&!ce(r)))return o.value=r,!0;const i=U(t)&&br(n)?Number(n)<t.length:X(t,n),l=Reflect.set(t,n,r,s);return t===Q(s)&&(i?ut(r,o)&&De(t,"set",n,r):De(t,"add",n,r)),l}deleteProperty(t,n){const r=X(t,n);t[n];const s=Reflect.deleteProperty(t,n);return s&&r&&De(t,"delete",n,void 0),s}has(t,n){const r=Reflect.has(t,n);return(!Tn(n)||!no.has(n))&&ye(t,"has",n),r}ownKeys(t){return ye(t,"iterate",U(t)?"length":lt),Reflect.ownKeys(t)}}class Li extends ro{constructor(t=!1){super(!0,t)}set(t,n){return!0}deleteProperty(t,n){return!0}}const Ni=new so,Hi=new Li,$i=new so(!0),xr=e=>e,On=e=>Reflect.getPrototypeOf(e);function Zt(e,t,n=!1,r=!1){e=e.__v_raw;const s=Q(e),o=Q(t);n||(ut(t,o)&&ye(s,"get",t),ye(s,"get",o));const{has:i}=On(s),l=r?xr:n?Sr:Bt;if(i.call(s,t))return l(e.get(t));if(i.call(s,o))return l(e.get(o));e!==s&&e.get(t)}function Gt(e,t=!1){const n=this.__v_raw,r=Q(n),s=Q(e);return t||(ut(e,s)&&ye(r,"has",e),ye(r,"has",s)),e===s?n.has(e):n.has(e)||n.has(s)}function en(e,t=!1){return e=e.__v_raw,!t&&ye(Q(e),"iterate",lt),Reflect.get(e,"size",e)}function Zr(e){e=Q(e);const t=Q(this);return On(t).has.call(t,e)||(t.add(e),De(t,"add",e,e)),this}function Gr(e,t){t=Q(t);const n=Q(this),{has:r,get:s}=On(n);let o=r.call(n,e);o||(e=Q(e),o=r.call(n,e));const i=s.call(n,e);return n.set(e,t),o?ut(t,i)&&De(n,"set",e,t):De(n,"add",e,t),this}function es(e){const t=Q(this),{has:n,get:r}=On(t);let s=n.call(t,e);s||(e=Q(e),s=n.call(t,e)),r&&r.call(t,e);const o=t.delete(e);return s&&De(t,"delete",e,void 0),o}function ts(){const e=Q(this),t=e.size!==0,n=e.clear();return t&&De(e,"clear",void 0,void 0),n}function tn(e,t){return function(r,s){const o=this,i=o.__v_raw,l=Q(i),c=t?xr:e?Sr:Bt;return!e&&ye(l,"iterate",lt),i.forEach((a,f)=>r.call(s,c(a),c(f),o))}}function nn(e,t,n){return function(...r){const s=this.__v_raw,o=Q(s),i=yt(o),l=e==="entries"||e===Symbol.iterator&&i,c=e==="keys"&&i,a=s[e](...r),f=n?xr:t?Sr:Bt;return!t&&ye(o,"iterate",c?rr:lt),{next(){const{value:h,done:m}=a.next();return m?{value:h,done:m}:{value:l?[f(h[0]),f(h[1])]:f(h),done:m}},[Symbol.iterator](){return this}}}}function Ue(e){return function(...t){return e==="delete"?!1:this}}function ji(){const e={get(o){return Zt(this,o)},get size(){return en(this)},has:Gt,add:Zr,set:Gr,delete:es,clear:ts,forEach:tn(!1,!1)},t={get(o){return Zt(this,o,!1,!0)},get size(){return en(this)},has:Gt,add:Zr,set:Gr,delete:es,clear:ts,forEach:tn(!1,!0)},n={get(o){return Zt(this,o,!0)},get size(){return en(this,!0)},has(o){return Gt.call(this,o,!0)},add:Ue("add"),set:Ue("set"),delete:Ue("delete"),clear:Ue("clear"),forEach:tn(!0,!1)},r={get(o){return Zt(this,o,!0,!0)},get size(){return en(this,!0)},has(o){return Gt.call(this,o,!0)},add:Ue("add"),set:Ue("set"),delete:Ue("delete"),clear:Ue("clear"),forEach:tn(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(o=>{e[o]=nn(o,!1,!1),n[o]=nn(o,!0,!1),t[o]=nn(o,!1,!0),r[o]=nn(o,!0,!0)}),[e,n,t,r]}const[Di,Bi,ki,Ui]=ji();function Tr(e,t){const n=t?e?Ui:ki:e?Bi:Di;return(r,s,o)=>s==="__v_isReactive"?!e:s==="__v_isReadonly"?e:s==="__v_raw"?r:Reflect.get(X(n,s)&&s in r?n:r,s,o)}const Ki={get:Tr(!1,!1)},Wi={get:Tr(!1,!0)},Vi={get:Tr(!0,!1)},oo=new WeakMap,io=new WeakMap,lo=new WeakMap,qi=new WeakMap;function zi(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function Yi(e){return e.__v_skip||!Object.isExtensible(e)?0:zi(gi(e))}function Pn(e){return Ct(e)?e:Ar(e,!1,Ni,Ki,oo)}function Ji(e){return Ar(e,!1,$i,Wi,io)}function Mn(e){return Ar(e,!0,Hi,Vi,lo)}function Ar(e,t,n,r,s){if(!ee(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;const o=s.get(e);if(o)return o;const i=Yi(e);if(i===0)return e;const l=new Proxy(e,i===2?r:n);return s.set(e,l),l}function _t(e){return Ct(e)?_t(e.__v_raw):!!(e&&e.__v_isReactive)}function Ct(e){return!!(e&&e.__v_isReadonly)}function _n(e){return!!(e&&e.__v_isShallow)}function co(e){return _t(e)||Ct(e)}function Q(e){const t=e&&e.__v_raw;return t?Q(t):e}function Lt(e){return mn(e,"__v_skip",!0),e}const Bt=e=>ee(e)?Pn(e):e,Sr=e=>ee(e)?Mn(e):e;function Rr(e){Ye&&Se&&(e=Q(e),to(e.dep||(e.dep=Cr())))}function Or(e,t){e=Q(e);const n=e.dep;n&&sr(n)}function ce(e){return!!(e&&e.__v_isRef===!0)}function ae(e){return ao(e,!1)}function Pr(e){return ao(e,!0)}function ao(e,t){return ce(e)?e:new Xi(e,t)}class Xi{constructor(t,n){this.__v_isShallow=n,this.dep=void 0,this.__v_isRef=!0,this._rawValue=n?t:Q(t),this._value=n?t:Bt(t)}get value(){return Rr(this),this._value}set value(t){const n=this.__v_isShallow||_n(t)||Ct(t);t=n?t:Q(t),ut(t,this._rawValue)&&(this._rawValue=t,this._value=n?t:Bt(t),Or(this))}}function Mr(e){return ce(e)?e.value:e}const Qi={get:(e,t,n)=>Mr(Reflect.get(e,t,n)),set:(e,t,n,r)=>{const s=e[t];return ce(s)&&!ce(n)?(s.value=n,!0):Reflect.set(e,t,n,r)}};function uo(e){return _t(e)?e:new Proxy(e,Qi)}class Zi{constructor(t){this.dep=void 0,this.__v_isRef=!0;const{get:n,set:r}=t(()=>Rr(this),()=>Or(this));this._get=n,this._set=r}get value(){return this._get()}set value(t){this._set(t)}}function Gi(e){return new Zi(e)}class el{constructor(t,n,r){this._object=t,this._key=n,this._defaultValue=r,this.__v_isRef=!0}get value(){const t=this._object[this._key];return t===void 0?this._defaultValue:t}set value(t){this._object[this._key]=t}get dep(){return Pi(Q(this._object),this._key)}}class tl{constructor(t){this._getter=t,this.__v_isRef=!0,this.__v_isReadonly=!0}get value(){return this._getter()}}function nl(e,t,n){return ce(e)?e:W(e)?new tl(e):ee(e)&&arguments.length>1?rl(e,t,n):ae(e)}function rl(e,t,n){const r=e[t];return ce(r)?r:new el(e,t,n)}class sl{constructor(t,n,r,s){this._setter=n,this.dep=void 0,this.__v_isRef=!0,this.__v_isReadonly=!1,this._dirty=!0,this.effect=new Er(t,()=>{this._dirty||(this._dirty=!0,Or(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!s,this.__v_isReadonly=r}get value(){const t=Q(this);return Rr(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}function ol(e,t,n=!1){let r,s;const o=W(e);return o?(r=e,s=Oe):(r=e.get,s=e.set),new sl(r,s,o||!s,n)}function Je(e,t,n,r){let s;try{s=r?e(...r):e()}catch(o){Yt(o,t,n)}return s}function xe(e,t,n,r){if(W(e)){const o=Je(e,t,n,r);return o&&qs(o)&&o.catch(i=>{Yt(i,t,n)}),o}const s=[];for(let o=0;o<e.length;o++)s.push(xe(e[o],t,n,r));return s}function Yt(e,t,n,r=!0){const s=t?t.vnode:null;if(t){let o=t.parent;const i=t.proxy,l=n;for(;o;){const a=o.ec;if(a){for(let f=0;f<a.length;f++)if(a[f](e,i,l)===!1)return}o=o.parent}const c=t.appContext.config.errorHandler;if(c){Je(c,null,10,[e,i,l]);return}}il(e,n,s,r)}function il(e,t,n,r=!0){console.error(e)}let kt=!1,or=!1;const he=[];let Le=0;const bt=[];let je=null,rt=0;const fo=Promise.resolve();let Fr=null;function Fn(e){const t=Fr||fo;return e?t.then(this?e.bind(this):e):t}function ll(e){let t=Le+1,n=he.length;for(;t<n;){const r=t+n>>>1,s=he[r],o=Ut(s);o<e||o===e&&s.pre?t=r+1:n=r}return t}function In(e){(!he.length||!he.includes(e,kt&&e.allowRecurse?Le+1:Le))&&(e.id==null?he.push(e):he.splice(ll(e.id),0,e),ho())}function ho(){!kt&&!or&&(or=!0,Fr=fo.then(po))}function cl(e){const t=he.indexOf(e);t>Le&&he.splice(t,1)}function al(e){U(e)?bt.push(...e):(!je||!je.includes(e,e.allowRecurse?rt+1:rt))&&bt.push(e),ho()}function ns(e,t=kt?Le+1:0){for(;t<he.length;t++){const n=he[t];n&&n.pre&&(he.splice(t,1),t--,n())}}function bn(e){if(bt.length){const t=[...new Set(bt)];if(bt.length=0,je){je.push(...t);return}for(je=t,je.sort((n,r)=>Ut(n)-Ut(r)),rt=0;rt<je.length;rt++)je[rt]();je=null,rt=0}}const Ut=e=>e.id==null?1/0:e.id,ul=(e,t)=>{const n=Ut(e)-Ut(t);if(n===0){if(e.pre&&!t.pre)return-1;if(t.pre&&!e.pre)return 1}return n};function po(e){or=!1,kt=!0,he.sort(ul);const t=Oe;try{for(Le=0;Le<he.length;Le++){const n=he[Le];n&&n.active!==!1&&Je(n,null,14)}}finally{Le=0,he.length=0,bn(),kt=!1,Fr=null,(he.length||bt.length)&&po()}}function fl(e,t,...n){if(e.isUnmounted)return;const r=e.vnode.props||te;let s=n;const o=t.startsWith("update:"),i=o&&t.slice(7);if(i&&i in r){const f=`${i==="modelValue"?"model":i}Modifiers`,{number:h,trim:m}=r[f]||te;m&&(s=n.map(w=>ne(w)?w.trim():w)),h&&(s=n.map(er))}let l,c=r[l=dn(t)]||r[l=dn(Ne(t))];!c&&o&&(c=r[l=dn(ft(t))]),c&&xe(c,e,6,s);const a=r[l+"Once"];if(a){if(!e.emitted)e.emitted={};else if(e.emitted[l])return;e.emitted[l]=!0,xe(a,e,6,s)}}function go(e,t,n=!1){const r=t.emitsCache,s=r.get(e);if(s!==void 0)return s;const o=e.emits;let i={},l=!1;if(!W(e)){const c=a=>{const f=go(a,t,!0);f&&(l=!0,ue(i,f))};!n&&t.mixins.length&&t.mixins.forEach(c),e.extends&&c(e.extends),e.mixins&&e.mixins.forEach(c)}return!o&&!l?(ee(e)&&r.set(e,null),null):(U(o)?o.forEach(c=>i[c]=null):ue(i,o),ee(e)&&r.set(e,i),i)}function Ln(e,t){return!e||!zt(t)?!1:(t=t.slice(2).replace(/Once$/,""),X(e,t[0].toLowerCase()+t.slice(1))||X(e,ft(t))||X(e,t))}let de=null,Nn=null;function vn(e){const t=de;return de=e,Nn=e&&e.type.__scopeId||null,t}function Na(e){Nn=e}function Ha(){Nn=null}function dl(e,t=de,n){if(!t||e._n)return e;const r=(...s)=>{r._d&&gs(-1);const o=vn(t);let i;try{i=e(...s)}finally{vn(o),r._d&&gs(1)}return i};return r._n=!0,r._c=!0,r._d=!0,r}function Wn(e){const{type:t,vnode:n,proxy:r,withProxy:s,props:o,propsOptions:[i],slots:l,attrs:c,emit:a,render:f,renderCache:h,data:m,setupState:w,ctx:E,inheritAttrs:T}=e;let L,B;const k=vn(e);try{if(n.shapeFlag&4){const p=s||r;L=Ae(f.call(p,p,h,o,w,m,E)),B=c}else{const p=t;L=Ae(p.length>1?p(o,{attrs:c,slots:l,emit:a}):p(o,null)),B=t.props?c:hl(c)}}catch(p){jt.length=0,Yt(p,e,1),L=re(ve)}let y=L;if(B&&T!==!1){const p=Object.keys(B),{shapeFlag:F}=y;p.length&&F&7&&(i&&p.some(yr)&&(B=pl(B,i)),y=Ze(y,B))}return n.dirs&&(y=Ze(y),y.dirs=y.dirs?y.dirs.concat(n.dirs):n.dirs),n.transition&&(y.transition=n.transition),L=y,vn(k),L}const hl=e=>{let t;for(const n in e)(n==="class"||n==="style"||zt(n))&&((t||(t={}))[n]=e[n]);return t},pl=(e,t)=>{const n={};for(const r in e)(!yr(r)||!(r.slice(9)in t))&&(n[r]=e[r]);return n};function gl(e,t,n){const{props:r,children:s,component:o}=e,{props:i,children:l,patchFlag:c}=t,a=o.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&c>=0){if(c&1024)return!0;if(c&16)return r?rs(r,i,a):!!i;if(c&8){const f=t.dynamicProps;for(let h=0;h<f.length;h++){const m=f[h];if(i[m]!==r[m]&&!Ln(a,m))return!0}}}else return(s||l)&&(!l||!l.$stable)?!0:r===i?!1:r?i?rs(r,i,a):!0:!!i;return!1}function rs(e,t,n){const r=Object.keys(t);if(r.length!==Object.keys(e).length)return!0;for(let s=0;s<r.length;s++){const o=r[s];if(t[o]!==e[o]&&!Ln(n,o))return!0}return!1}function ml({vnode:e,parent:t},n){for(;t&&t.subTree===e;)(e=t.vnode).el=n,t=t.parent}const yl=e=>e.__isSuspense;function mo(e,t){t&&t.pendingBranch?U(e)?t.effects.push(...e):t.effects.push(e):al(e)}function Ir(e,t){return Hn(e,null,t)}function $a(e,t){return Hn(e,null,{flush:"post"})}const rn={};function Xe(e,t,n){return Hn(e,t,n)}function Hn(e,t,{immediate:n,deep:r,flush:s,onTrack:o,onTrigger:i}=te){var l;const c=Qs()===((l=le)==null?void 0:l.scope)?le:null;let a,f=!1,h=!1;if(ce(e)?(a=()=>e.value,f=_n(e)):_t(e)?(a=()=>e,r=!0):U(e)?(h=!0,f=e.some(p=>_t(p)||_n(p)),a=()=>e.map(p=>{if(ce(p))return p.value;if(_t(p))return it(p);if(W(p))return Je(p,c,2)})):W(e)?t?a=()=>Je(e,c,2):a=()=>{if(!(c&&c.isUnmounted))return m&&m(),xe(e,c,3,[w])}:a=Oe,t&&r){const p=a;a=()=>it(p())}let m,w=p=>{m=k.onStop=()=>{Je(p,c,4)}},E;if(Tt)if(w=Oe,t?n&&xe(t,c,3,[a(),h?[]:void 0,w]):a(),s==="sync"){const p=hc();E=p.__watcherHandles||(p.__watcherHandles=[])}else return Oe;let T=h?new Array(e.length).fill(rn):rn;const L=()=>{if(k.active)if(t){const p=k.run();(r||f||(h?p.some((F,K)=>ut(F,T[K])):ut(p,T)))&&(m&&m(),xe(t,c,3,[p,T===rn?void 0:h&&T[0]===rn?[]:T,w]),T=p)}else k.run()};L.allowRecurse=!!t;let B;s==="sync"?B=L:s==="post"?B=()=>ge(L,c&&c.suspense):(L.pre=!0,c&&(L.id=c.uid),B=()=>In(L));const k=new Er(a,B);t?n?L():T=k.run():s==="post"?ge(k.run.bind(k),c&&c.suspense):k.run();const y=()=>{k.stop(),c&&c.scope&&_r(c.scope.effects,k)};return E&&E.push(y),y}function _l(e,t,n){const r=this.proxy,s=ne(e)?e.includes(".")?yo(r,e):()=>r[e]:e.bind(r,r);let o;W(t)?o=t:(o=t.handler,n=t);const i=le;xt(this);const l=Hn(s,o.bind(r),n);return i?xt(i):ct(),l}function yo(e,t){const n=t.split(".");return()=>{let r=e;for(let s=0;s<n.length&&r;s++)r=r[n[s]];return r}}function it(e,t){if(!ee(e)||e.__v_skip||(t=t||new Set,t.has(e)))return e;if(t.add(e),ce(e))it(e.value,t);else if(U(e))for(let n=0;n<e.length;n++)it(e[n],t);else if(Vs(e)||yt(e))e.forEach(n=>{it(n,t)});else if(Ys(e))for(const n in e)it(e[n],t);return e}function ja(e,t){const n=de;if(n===null)return e;const r=kn(n)||n.proxy,s=e.dirs||(e.dirs=[]);for(let o=0;o<t.length;o++){let[i,l,c,a=te]=t[o];i&&(W(i)&&(i={mounted:i,updated:i}),i.deep&&it(l),s.push({dir:i,instance:r,value:l,oldValue:void 0,arg:c,modifiers:a}))}return e}function Ie(e,t,n,r){const s=e.dirs,o=t&&t.dirs;for(let i=0;i<s.length;i++){const l=s[i];o&&(l.oldValue=o[i].value);let c=l.dir[r];c&&(At(),xe(c,n,8,[e.el,l,e,t]),St())}}const qe=Symbol("_leaveCb"),sn=Symbol("_enterCb");function bl(){const e={isMounted:!1,isLeaving:!1,isUnmounting:!1,leavingVNodes:new Map};return Rt(()=>{e.isMounted=!0}),Co(()=>{e.isUnmounting=!0}),e}const we=[Function,Array],_o={mode:String,appear:Boolean,persisted:Boolean,onBeforeEnter:we,onEnter:we,onAfterEnter:we,onEnterCancelled:we,onBeforeLeave:we,onLeave:we,onAfterLeave:we,onLeaveCancelled:we,onBeforeAppear:we,onAppear:we,onAfterAppear:we,onAppearCancelled:we},vl={name:"BaseTransition",props:_o,setup(e,{slots:t}){const n=Bn(),r=bl();let s;return()=>{const o=t.default&&vo(t.default(),!0);if(!o||!o.length)return;let i=o[0];if(o.length>1){for(const T of o)if(T.type!==ve){i=T;break}}const l=Q(e),{mode:c}=l;if(r.isLeaving)return Vn(i);const a=ss(i);if(!a)return Vn(i);const f=ir(a,l,r,n);lr(a,f);const h=n.subTree,m=h&&ss(h);let w=!1;const{getTransitionKey:E}=a.type;if(E){const T=E();s===void 0?s=T:T!==s&&(s=T,w=!0)}if(m&&m.type!==ve&&(!st(a,m)||w)){const T=ir(m,l,r,n);if(lr(m,T),c==="out-in")return r.isLeaving=!0,T.afterLeave=()=>{r.isLeaving=!1,n.update.active!==!1&&n.update()},Vn(i);c==="in-out"&&a.type!==ve&&(T.delayLeave=(L,B,k)=>{const y=bo(r,m);y[String(m.key)]=m,L[qe]=()=>{B(),L[qe]=void 0,delete f.delayedLeave},f.delayedLeave=k})}return i}}},wl=vl;function bo(e,t){const{leavingVNodes:n}=e;let r=n.get(t.type);return r||(r=Object.create(null),n.set(t.type,r)),r}function ir(e,t,n,r){const{appear:s,mode:o,persisted:i=!1,onBeforeEnter:l,onEnter:c,onAfterEnter:a,onEnterCancelled:f,onBeforeLeave:h,onLeave:m,onAfterLeave:w,onLeaveCancelled:E,onBeforeAppear:T,onAppear:L,onAfterAppear:B,onAppearCancelled:k}=t,y=String(e.key),p=bo(n,e),F=(v,M)=>{v&&xe(v,r,9,M)},K=(v,M)=>{const R=M[1];F(v,M),U(v)?v.every(z=>z.length<=1)&&R():v.length<=1&&R()},N={mode:o,persisted:i,beforeEnter(v){let M=l;if(!n.isMounted)if(s)M=T||l;else return;v[qe]&&v[qe](!0);const R=p[y];R&&st(e,R)&&R.el[qe]&&R.el[qe](),F(M,[v])},enter(v){let M=c,R=a,z=f;if(!n.isMounted)if(s)M=L||c,R=B||a,z=k||f;else return;let O=!1;const q=v[sn]=oe=>{O||(O=!0,oe?F(z,[v]):F(R,[v]),N.delayedLeave&&N.delayedLeave(),v[sn]=void 0)};M?K(M,[v,q]):q()},leave(v,M){const R=String(e.key);if(v[sn]&&v[sn](!0),n.isUnmounting)return M();F(h,[v]);let z=!1;const O=v[qe]=q=>{z||(z=!0,M(),q?F(E,[v]):F(w,[v]),v[qe]=void 0,p[R]===e&&delete p[R])};p[R]=e,m?K(m,[v,O]):O()},clone(v){return ir(v,t,n,r)}};return N}function Vn(e){if(Jt(e))return e=Ze(e),e.children=null,e}function ss(e){return Jt(e)?e.children?e.children[0]:void 0:e}function lr(e,t){e.shapeFlag&6&&e.component?lr(e.component.subTree,t):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function vo(e,t=!1,n){let r=[],s=0;for(let o=0;o<e.length;o++){let i=e[o];const l=n==null?i.key:String(n)+String(i.key!=null?i.key:o);i.type===me?(i.patchFlag&128&&s++,r=r.concat(vo(i.children,t,l))):(t||i.type!==ve)&&r.push(l!=null?Ze(i,{key:l}):i)}if(s>1)for(let o=0;o<r.length;o++)r[o].patchFlag=-2;return r}/*! #__NO_SIDE_EFFECTS__ */function Lr(e,t){return W(e)?(()=>ue({name:e.name},t,{setup:e}))():e}const vt=e=>!!e.type.__asyncLoader;/*! #__NO_SIDE_EFFECTS__ */function Da(e){W(e)&&(e={loader:e});const{loader:t,loadingComponent:n,errorComponent:r,delay:s=200,timeout:o,suspensible:i=!0,onError:l}=e;let c=null,a,f=0;const h=()=>(f++,c=null,m()),m=()=>{let w;return c||(w=c=t().catch(E=>{if(E=E instanceof Error?E:new Error(String(E)),l)return new Promise((T,L)=>{l(E,()=>T(h()),()=>L(E),f+1)});throw E}).then(E=>w!==c&&c?c:(E&&(E.__esModule||E[Symbol.toStringTag]==="Module")&&(E=E.default),a=E,E)))};return Lr({name:"AsyncComponentWrapper",__asyncLoader:m,get __asyncResolved(){return a},setup(){const w=le;if(a)return()=>qn(a,w);const E=k=>{c=null,Yt(k,w,13,!r)};if(i&&w.suspense||Tt)return m().then(k=>()=>qn(k,w)).catch(k=>(E(k),()=>r?re(r,{error:k}):null));const T=ae(!1),L=ae(),B=ae(!!s);return s&&setTimeout(()=>{B.value=!1},s),o!=null&&setTimeout(()=>{if(!T.value&&!L.value){const k=new Error(`Async component timed out after ${o}ms.`);E(k),L.value=k}},o),m().then(()=>{T.value=!0,w.parent&&Jt(w.parent.vnode)&&In(w.parent.update)}).catch(k=>{E(k),L.value=k}),()=>{if(T.value&&a)return qn(a,w);if(L.value&&r)return re(r,{error:L.value});if(n&&!B.value)return re(n)}}})}function qn(e,t){const{ref:n,props:r,children:s,ce:o}=t.vnode,i=re(e,r,s);return i.ref=n,i.ce=o,delete t.vnode.ce,i}const Jt=e=>e.type.__isKeepAlive;function Cl(e,t){wo(e,"a",t)}function El(e,t){wo(e,"da",t)}function wo(e,t,n=le){const r=e.__wdc||(e.__wdc=()=>{let s=n;for(;s;){if(s.isDeactivated)return;s=s.parent}return e()});if($n(t,r,n),n){let s=n.parent;for(;s&&s.parent;)Jt(s.parent.vnode)&&xl(r,t,n,s),s=s.parent}}function xl(e,t,n,r){const s=$n(t,e,r,!0);jn(()=>{_r(r[t],s)},n)}function $n(e,t,n=le,r=!1){if(n){const s=n[e]||(n[e]=[]),o=t.__weh||(t.__weh=(...i)=>{if(n.isUnmounted)return;At(),xt(n);const l=xe(t,n,e,i);return ct(),St(),l});return r?s.unshift(o):s.push(o),o}}const ke=e=>(t,n=le)=>(!Tt||e==="sp")&&$n(e,(...r)=>t(...r),n),Tl=ke("bm"),Rt=ke("m"),Al=ke("bu"),Sl=ke("u"),Co=ke("bum"),jn=ke("um"),Rl=ke("sp"),Ol=ke("rtg"),Pl=ke("rtc");function Ml(e,t=le){$n("ec",e,t)}const Nr="components";function Ba(e,t){return xo(Nr,e,!0,t)||e}const Eo=Symbol.for("v-ndc");function ka(e){return ne(e)?xo(Nr,e,!1)||e:e||Eo}function xo(e,t,n=!0,r=!1){const s=de||le;if(s){const o=s.type;if(e===Nr){const l=uc(o,!1);if(l&&(l===t||l===Ne(t)||l===Rn(Ne(t))))return o}const i=os(s[e]||o[e],t)||os(s.appContext[e],t);return!i&&r?o:i}}function os(e,t){return e&&(e[t]||e[Ne(t)]||e[Rn(Ne(t))])}function Ua(e,t,n,r){let s;const o=n&&n[r];if(U(e)||ne(e)){s=new Array(e.length);for(let i=0,l=e.length;i<l;i++)s[i]=t(e[i],i,void 0,o&&o[i])}else if(typeof e=="number"){s=new Array(e);for(let i=0;i<e;i++)s[i]=t(i+1,i,void 0,o&&o[i])}else if(ee(e))if(e[Symbol.iterator])s=Array.from(e,(i,l)=>t(i,l,void 0,o&&o[l]));else{const i=Object.keys(e);s=new Array(i.length);for(let l=0,c=i.length;l<c;l++){const a=i[l];s[l]=t(e[a],a,l,o&&o[l])}}else s=[];return n&&(n[r]=s),s}function Ka(e,t,n={},r,s){if(de.isCE||de.parent&&vt(de.parent)&&de.parent.isCE)return t!=="default"&&(n.name=t),re("slot",n,r&&r());let o=e[t];o&&o._c&&(o._d=!1),Ho();const i=o&&To(o(n)),l=jo(me,{key:n.key||i&&i.key||`_${t}`},i||(r?r():[]),i&&e._===1?64:-2);return!s&&l.scopeId&&(l.slotScopeIds=[l.scopeId+"-s"]),o&&o._c&&(o._d=!0),l}function To(e){return e.some(t=>xn(t)?!(t.type===ve||t.type===me&&!To(t.children)):!0)?e:null}function Wa(e,t){const n={};for(const r in e)n[t&&/[A-Z]/.test(r)?`on:${r}`:dn(r)]=e[r];return n}const cr=e=>e?Uo(e)?kn(e)||e.proxy:cr(e.parent):null,Nt=ue(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>cr(e.parent),$root:e=>cr(e.root),$emit:e=>e.emit,$options:e=>Hr(e),$forceUpdate:e=>e.f||(e.f=()=>In(e.update)),$nextTick:e=>e.n||(e.n=Fn.bind(e.proxy)),$watch:e=>_l.bind(e)}),zn=(e,t)=>e!==te&&!e.__isScriptSetup&&X(e,t),Fl={get({_:e},t){const{ctx:n,setupState:r,data:s,props:o,accessCache:i,type:l,appContext:c}=e;let a;if(t[0]!=="$"){const w=i[t];if(w!==void 0)switch(w){case 1:return r[t];case 2:return s[t];case 4:return n[t];case 3:return o[t]}else{if(zn(r,t))return i[t]=1,r[t];if(s!==te&&X(s,t))return i[t]=2,s[t];if((a=e.propsOptions[0])&&X(a,t))return i[t]=3,o[t];if(n!==te&&X(n,t))return i[t]=4,n[t];ar&&(i[t]=0)}}const f=Nt[t];let h,m;if(f)return t==="$attrs"&&ye(e,"get",t),f(e);if((h=l.__cssModules)&&(h=h[t]))return h;if(n!==te&&X(n,t))return i[t]=4,n[t];if(m=c.config.globalProperties,X(m,t))return m[t]},set({_:e},t,n){const{data:r,setupState:s,ctx:o}=e;return zn(s,t)?(s[t]=n,!0):r!==te&&X(r,t)?(r[t]=n,!0):X(e.props,t)||t[0]==="$"&&t.slice(1)in e?!1:(o[t]=n,!0)},has({_:{data:e,setupState:t,accessCache:n,ctx:r,appContext:s,propsOptions:o}},i){let l;return!!n[i]||e!==te&&X(e,i)||zn(t,i)||(l=o[0])&&X(l,i)||X(r,i)||X(Nt,i)||X(s.config.globalProperties,i)},defineProperty(e,t,n){return n.get!=null?e._.accessCache[t]=0:X(n,"value")&&this.set(e,t,n.value,null),Reflect.defineProperty(e,t,n)}};function Va(){return Il().slots}function Il(){const e=Bn();return e.setupContext||(e.setupContext=Wo(e))}function is(e){return U(e)?e.reduce((t,n)=>(t[n]=null,t),{}):e}let ar=!0;function Ll(e){const t=Hr(e),n=e.proxy,r=e.ctx;ar=!1,t.beforeCreate&&ls(t.beforeCreate,e,"bc");const{data:s,computed:o,methods:i,watch:l,provide:c,inject:a,created:f,beforeMount:h,mounted:m,beforeUpdate:w,updated:E,activated:T,deactivated:L,beforeDestroy:B,beforeUnmount:k,destroyed:y,unmounted:p,render:F,renderTracked:K,renderTriggered:N,errorCaptured:v,serverPrefetch:M,expose:R,inheritAttrs:z,components:O,directives:q,filters:oe}=t;if(a&&Nl(a,r,null),i)for(const Y in i){const D=i[Y];W(D)&&(r[Y]=D.bind(n))}if(s){const Y=s.call(n,n);ee(Y)&&(e.data=Pn(Y))}if(ar=!0,o)for(const Y in o){const D=o[Y],He=W(D)?D.bind(n,n):W(D.get)?D.get.bind(n,n):Oe,Xt=!W(D)&&W(D.set)?D.set.bind(n):Oe,Ge=ie({get:He,set:Xt});Object.defineProperty(r,Y,{enumerable:!0,configurable:!0,get:()=>Ge.value,set:Me=>Ge.value=Me})}if(l)for(const Y in l)Ao(l[Y],r,n,Y);if(c){const Y=W(c)?c.call(n):c;Reflect.ownKeys(Y).forEach(D=>{kl(D,Y[D])})}f&&ls(f,e,"c");function H(Y,D){U(D)?D.forEach(He=>Y(He.bind(n))):D&&Y(D.bind(n))}if(H(Tl,h),H(Rt,m),H(Al,w),H(Sl,E),H(Cl,T),H(El,L),H(Ml,v),H(Pl,K),H(Ol,N),H(Co,k),H(jn,p),H(Rl,M),U(R))if(R.length){const Y=e.exposed||(e.exposed={});R.forEach(D=>{Object.defineProperty(Y,D,{get:()=>n[D],set:He=>n[D]=He})})}else e.exposed||(e.exposed={});F&&e.render===Oe&&(e.render=F),z!=null&&(e.inheritAttrs=z),O&&(e.components=O),q&&(e.directives=q)}function Nl(e,t,n=Oe){U(e)&&(e=ur(e));for(const r in e){const s=e[r];let o;ee(s)?"default"in s?o=wt(s.from||r,s.default,!0):o=wt(s.from||r):o=wt(s),ce(o)?Object.defineProperty(t,r,{enumerable:!0,configurable:!0,get:()=>o.value,set:i=>o.value=i}):t[r]=o}}function ls(e,t,n){xe(U(e)?e.map(r=>r.bind(t.proxy)):e.bind(t.proxy),t,n)}function Ao(e,t,n,r){const s=r.includes(".")?yo(n,r):()=>n[r];if(ne(e)){const o=t[e];W(o)&&Xe(s,o)}else if(W(e))Xe(s,e.bind(n));else if(ee(e))if(U(e))e.forEach(o=>Ao(o,t,n,r));else{const o=W(e.handler)?e.handler.bind(n):t[e.handler];W(o)&&Xe(s,o,e)}}function Hr(e){const t=e.type,{mixins:n,extends:r}=t,{mixins:s,optionsCache:o,config:{optionMergeStrategies:i}}=e.appContext,l=o.get(t);let c;return l?c=l:!s.length&&!n&&!r?c=t:(c={},s.length&&s.forEach(a=>wn(c,a,i,!0)),wn(c,t,i)),ee(t)&&o.set(t,c),c}function wn(e,t,n,r=!1){const{mixins:s,extends:o}=t;o&&wn(e,o,n,!0),s&&s.forEach(i=>wn(e,i,n,!0));for(const i in t)if(!(r&&i==="expose")){const l=Hl[i]||n&&n[i];e[i]=l?l(e[i],t[i]):t[i]}return e}const Hl={data:cs,props:as,emits:as,methods:Ft,computed:Ft,beforeCreate:pe,created:pe,beforeMount:pe,mounted:pe,beforeUpdate:pe,updated:pe,beforeDestroy:pe,beforeUnmount:pe,destroyed:pe,unmounted:pe,activated:pe,deactivated:pe,errorCaptured:pe,serverPrefetch:pe,components:Ft,directives:Ft,watch:jl,provide:cs,inject:$l};function cs(e,t){return t?e?function(){return ue(W(e)?e.call(this,this):e,W(t)?t.call(this,this):t)}:t:e}function $l(e,t){return Ft(ur(e),ur(t))}function ur(e){if(U(e)){const t={};for(let n=0;n<e.length;n++)t[e[n]]=e[n];return t}return e}function pe(e,t){return e?[...new Set([].concat(e,t))]:t}function Ft(e,t){return e?ue(Object.create(null),e,t):t}function as(e,t){return e?U(e)&&U(t)?[...new Set([...e,...t])]:ue(Object.create(null),is(e),is(t??{})):t}function jl(e,t){if(!e)return t;if(!t)return e;const n=ue(Object.create(null),e);for(const r in t)n[r]=pe(e[r],t[r]);return n}function So(){return{app:null,config:{isNativeTag:di,performance:!1,globalProperties:{},optionMergeStrategies:{},errorHandler:void 0,warnHandler:void 0,compilerOptions:{}},mixins:[],components:{},directives:{},provides:Object.create(null),optionsCache:new WeakMap,propsCache:new WeakMap,emitsCache:new WeakMap}}let Dl=0;function Bl(e,t){return function(r,s=null){W(r)||(r=ue({},r)),s!=null&&!ee(s)&&(s=null);const o=So(),i=new WeakSet;let l=!1;const c=o.app={_uid:Dl++,_component:r,_props:s,_container:null,_context:o,_instance:null,version:pc,get config(){return o.config},set config(a){},use(a,...f){return i.has(a)||(a&&W(a.install)?(i.add(a),a.install(c,...f)):W(a)&&(i.add(a),a(c,...f))),c},mixin(a){return o.mixins.includes(a)||o.mixins.push(a),c},component(a,f){return f?(o.components[a]=f,c):o.components[a]},directive(a,f){return f?(o.directives[a]=f,c):o.directives[a]},mount(a,f,h){if(!l){const m=re(r,s);return m.appContext=o,f&&t?t(m,a):e(m,a,h),l=!0,c._container=a,a.__vue_app__=c,kn(m.component)||m.component.proxy}},unmount(){l&&(e(null,c._container),delete c._container.__vue_app__)},provide(a,f){return o.provides[a]=f,c},runWithContext(a){Cn=c;try{return a()}finally{Cn=null}}};return c}}let Cn=null;function kl(e,t){if(le){let n=le.provides;const r=le.parent&&le.parent.provides;r===n&&(n=le.provides=Object.create(r)),n[e]=t}}function wt(e,t,n=!1){const r=le||de;if(r||Cn){const s=r?r.parent==null?r.vnode.appContext&&r.vnode.appContext.provides:r.parent.provides:Cn._context.provides;if(s&&e in s)return s[e];if(arguments.length>1)return n&&W(t)?t.call(r&&r.proxy):t}}function Ul(e,t,n,r=!1){const s={},o={};mn(o,Dn,1),e.propsDefaults=Object.create(null),Ro(e,t,s,o);for(const i in e.propsOptions[0])i in s||(s[i]=void 0);n?e.props=r?s:Ji(s):e.type.props?e.props=s:e.props=o,e.attrs=o}function Kl(e,t,n,r){const{props:s,attrs:o,vnode:{patchFlag:i}}=e,l=Q(s),[c]=e.propsOptions;let a=!1;if((r||i>0)&&!(i&16)){if(i&8){const f=e.vnode.dynamicProps;for(let h=0;h<f.length;h++){let m=f[h];if(Ln(e.emitsOptions,m))continue;const w=t[m];if(c)if(X(o,m))w!==o[m]&&(o[m]=w,a=!0);else{const E=Ne(m);s[E]=fr(c,l,E,w,e,!1)}else w!==o[m]&&(o[m]=w,a=!0)}}}else{Ro(e,t,s,o)&&(a=!0);let f;for(const h in l)(!t||!X(t,h)&&((f=ft(h))===h||!X(t,f)))&&(c?n&&(n[h]!==void 0||n[f]!==void 0)&&(s[h]=fr(c,l,h,void 0,e,!0)):delete s[h]);if(o!==l)for(const h in o)(!t||!X(t,h))&&(delete o[h],a=!0)}a&&De(e,"set","$attrs")}function Ro(e,t,n,r){const[s,o]=e.propsOptions;let i=!1,l;if(t)for(let c in t){if(It(c))continue;const a=t[c];let f;s&&X(s,f=Ne(c))?!o||!o.includes(f)?n[f]=a:(l||(l={}))[f]=a:Ln(e.emitsOptions,c)||(!(c in r)||a!==r[c])&&(r[c]=a,i=!0)}if(o){const c=Q(n),a=l||te;for(let f=0;f<o.length;f++){const h=o[f];n[h]=fr(s,c,h,a[h],e,!X(a,h))}}return i}function fr(e,t,n,r,s,o){const i=e[n];if(i!=null){const l=X(i,"default");if(l&&r===void 0){const c=i.default;if(i.type!==Function&&!i.skipFactory&&W(c)){const{propsDefaults:a}=s;n in a?r=a[n]:(xt(s),r=a[n]=c.call(null,t),ct())}else r=c}i[0]&&(o&&!l?r=!1:i[1]&&(r===""||r===ft(n))&&(r=!0))}return r}function Oo(e,t,n=!1){const r=t.propsCache,s=r.get(e);if(s)return s;const o=e.props,i={},l=[];let c=!1;if(!W(e)){const f=h=>{c=!0;const[m,w]=Oo(h,t,!0);ue(i,m),w&&l.push(...w)};!n&&t.mixins.length&&t.mixins.forEach(f),e.extends&&f(e.extends),e.mixins&&e.mixins.forEach(f)}if(!o&&!c)return ee(e)&&r.set(e,mt),mt;if(U(o))for(let f=0;f<o.length;f++){const h=Ne(o[f]);us(h)&&(i[h]=te)}else if(o)for(const f in o){const h=Ne(f);if(us(h)){const m=o[f],w=i[h]=U(m)||W(m)?{type:m}:ue({},m);if(w){const E=hs(Boolean,w.type),T=hs(String,w.type);w[0]=E>-1,w[1]=T<0||E<T,(E>-1||X(w,"default"))&&l.push(h)}}}const a=[i,l];return ee(e)&&r.set(e,a),a}function us(e){return e[0]!=="$"}function fs(e){const t=e&&e.toString().match(/^\s*(function|class) (\w+)/);return t?t[2]:e===null?"null":""}function ds(e,t){return fs(e)===fs(t)}function hs(e,t){return U(t)?t.findIndex(n=>ds(n,e)):W(t)&&ds(t,e)?0:-1}const Po=e=>e[0]==="_"||e==="$stable",$r=e=>U(e)?e.map(Ae):[Ae(e)],Wl=(e,t,n)=>{if(t._n)return t;const r=dl((...s)=>$r(t(...s)),n);return r._c=!1,r},Mo=(e,t,n)=>{const r=e._ctx;for(const s in e){if(Po(s))continue;const o=e[s];if(W(o))t[s]=Wl(s,o,r);else if(o!=null){const i=$r(o);t[s]=()=>i}}},Fo=(e,t)=>{const n=$r(t);e.slots.default=()=>n},Vl=(e,t)=>{if(e.vnode.shapeFlag&32){const n=t._;n?(e.slots=Q(t),mn(t,"_",n)):Mo(t,e.slots={})}else e.slots={},t&&Fo(e,t);mn(e.slots,Dn,1)},ql=(e,t,n)=>{const{vnode:r,slots:s}=e;let o=!0,i=te;if(r.shapeFlag&32){const l=t._;l?n&&l===1?o=!1:(ue(s,t),!n&&l===1&&delete s._):(o=!t.$stable,Mo(t,s)),i=t}else t&&(Fo(e,t),i={default:1});if(o)for(const l in s)!Po(l)&&i[l]==null&&delete s[l]};function En(e,t,n,r,s=!1){if(U(e)){e.forEach((m,w)=>En(m,t&&(U(t)?t[w]:t),n,r,s));return}if(vt(r)&&!s)return;const o=r.shapeFlag&4?kn(r.component)||r.component.proxy:r.el,i=s?null:o,{i:l,r:c}=e,a=t&&t.r,f=l.refs===te?l.refs={}:l.refs,h=l.setupState;if(a!=null&&a!==c&&(ne(a)?(f[a]=null,X(h,a)&&(h[a]=null)):ce(a)&&(a.value=null)),W(c))Je(c,l,12,[i,f]);else{const m=ne(c),w=ce(c);if(m||w){const E=()=>{if(e.f){const T=m?X(h,c)?h[c]:f[c]:c.value;s?U(T)&&_r(T,o):U(T)?T.includes(o)||T.push(o):m?(f[c]=[o],X(h,c)&&(h[c]=f[c])):(c.value=[o],e.k&&(f[e.k]=c.value))}else m?(f[c]=i,X(h,c)&&(h[c]=i)):w&&(c.value=i,e.k&&(f[e.k]=i))};i?(E.id=-1,ge(E,n)):E()}}}let Ke=!1;const on=e=>/svg/.test(e.namespaceURI)&&e.tagName!=="foreignObject",ln=e=>e.nodeType===8;function zl(e){const{mt:t,p:n,o:{patchProp:r,createText:s,nextSibling:o,parentNode:i,remove:l,insert:c,createComment:a}}=e,f=(y,p)=>{if(!p.hasChildNodes()){n(null,y,p),bn(),p._vnode=y;return}Ke=!1,h(p.firstChild,y,null,null,null),bn(),p._vnode=y,Ke&&console.error("Hydration completed but contains mismatches.")},h=(y,p,F,K,N,v=!1)=>{const M=ln(y)&&y.data==="[",R=()=>T(y,p,F,K,N,M),{type:z,ref:O,shapeFlag:q,patchFlag:oe}=p;let fe=y.nodeType;p.el=y,oe===-2&&(v=!1,p.dynamicChildren=null);let H=null;switch(z){case Et:fe!==3?p.children===""?(c(p.el=s(""),i(y),y),H=y):H=R():(y.data!==p.children&&(Ke=!0,y.data=p.children),H=o(y));break;case ve:if(fe!==8||M)if(y.tagName.toLowerCase()==="template"){const Y=p.el.content.firstChild;B(Y,y,F),p.el=y=Y,H=o(y)}else H=R();else H=o(y);break;case $t:if(M&&(y=o(y),fe=y.nodeType),fe===1||fe===3){H=y;const Y=!p.children.length;for(let D=0;D<p.staticCount;D++)Y&&(p.children+=H.nodeType===1?H.outerHTML:H.data),D===p.staticCount-1&&(p.anchor=H),H=o(H);return M?o(H):H}else R();break;case me:M?H=E(y,p,F,K,N,v):H=R();break;default:if(q&1)(fe!==1||p.type.toLowerCase()!==y.tagName.toLowerCase())&&!k(y)?H=R():H=m(y,p,F,K,N,v);else if(q&6){p.slotScopeIds=N;const Y=i(y);if(M?H=L(y):ln(y)&&y.data==="teleport start"?H=L(y,y.data,"teleport end"):H=o(y),t(p,Y,null,F,K,on(Y),v),vt(p)){let D;M?(D=re(me),D.anchor=H?H.previousSibling:Y.lastChild):D=y.nodeType===3?ko(""):re("div"),D.el=y,p.component.subTree=D}}else q&64?fe!==8?H=R():H=p.type.hydrate(y,p,F,K,N,v,e,w):q&128&&(H=p.type.hydrate(y,p,F,K,on(i(y)),N,v,e,h))}return O!=null&&En(O,null,K,p),H},m=(y,p,F,K,N,v)=>{v=v||!!p.dynamicChildren;const{type:M,props:R,patchFlag:z,shapeFlag:O,dirs:q,transition:oe}=p,fe=M==="input"&&q||M==="option";if(fe||z!==-1){if(q&&Ie(p,null,F,"created"),R)if(fe||!v||z&48)for(const D in R)(fe&&D.endsWith("value")||zt(D)&&!It(D))&&r(y,D,null,R[D],!1,void 0,F);else R.onClick&&r(y,"onClick",null,R.onClick,!1,void 0,F);let H;(H=R&&R.onVnodeBeforeMount)&&Ce(H,F,p);let Y=!1;if(k(y)){Y=Lo(K,oe)&&F&&F.vnode.props&&F.vnode.props.appear;const D=y.content.firstChild;Y&&oe.beforeEnter(D),B(D,y,F),p.el=y=D}if(q&&Ie(p,null,F,"beforeMount"),((H=R&&R.onVnodeMounted)||q||Y)&&mo(()=>{H&&Ce(H,F,p),Y&&oe.enter(y),q&&Ie(p,null,F,"mounted")},K),O&16&&!(R&&(R.innerHTML||R.textContent))){let D=w(y.firstChild,p,y,F,K,N,v);for(;D;){Ke=!0;const He=D;D=D.nextSibling,l(He)}}else O&8&&y.textContent!==p.children&&(Ke=!0,y.textContent=p.children)}return y.nextSibling},w=(y,p,F,K,N,v,M)=>{M=M||!!p.dynamicChildren;const R=p.children,z=R.length;for(let O=0;O<z;O++){const q=M?R[O]:R[O]=Ae(R[O]);if(y)y=h(y,q,K,N,v,M);else{if(q.type===Et&&!q.children)continue;Ke=!0,n(null,q,F,null,K,N,on(F),v)}}return y},E=(y,p,F,K,N,v)=>{const{slotScopeIds:M}=p;M&&(N=N?N.concat(M):M);const R=i(y),z=w(o(y),p,R,F,K,N,v);return z&&ln(z)&&z.data==="]"?o(p.anchor=z):(Ke=!0,c(p.anchor=a("]"),R,z),z)},T=(y,p,F,K,N,v)=>{if(Ke=!0,p.el=null,v){const z=L(y);for(;;){const O=o(y);if(O&&O!==z)l(O);else break}}const M=o(y),R=i(y);return l(y),n(null,p,R,M,F,K,on(R),N),M},L=(y,p="[",F="]")=>{let K=0;for(;y;)if(y=o(y),y&&ln(y)&&(y.data===p&&K++,y.data===F)){if(K===0)return o(y);K--}return y},B=(y,p,F)=>{const K=p.parentNode;K&&K.replaceChild(y,p);let N=F;for(;N;)N.vnode.el===p&&(N.vnode.el=y,N.subTree.el=y),N=N.parent},k=y=>y.nodeType===1&&y.tagName.toLowerCase()==="template";return[f,h]}const ge=mo;function Yl(e){return Io(e)}function Jl(e){return Io(e,zl)}function Io(e,t){const n=tr();n.__VUE__=!0;const{insert:r,remove:s,patchProp:o,createElement:i,createText:l,createComment:c,setText:a,setElementText:f,parentNode:h,nextSibling:m,setScopeId:w=Oe,insertStaticContent:E}=e,T=(u,d,g,_=null,b=null,A=null,P=!1,x=null,S=!!d.dynamicChildren)=>{if(u===d)return;u&&!st(u,d)&&(_=Qt(u),Me(u,b,A,!0),u=null),d.patchFlag===-2&&(S=!1,d.dynamicChildren=null);const{type:C,ref:$,shapeFlag:I}=d;switch(C){case Et:L(u,d,g,_);break;case ve:B(u,d,g,_);break;case $t:u==null&&k(d,g,_,P);break;case me:O(u,d,g,_,b,A,P,x,S);break;default:I&1?F(u,d,g,_,b,A,P,x,S):I&6?q(u,d,g,_,b,A,P,x,S):(I&64||I&128)&&C.process(u,d,g,_,b,A,P,x,S,dt)}$!=null&&b&&En($,u&&u.ref,A,d||u,!d)},L=(u,d,g,_)=>{if(u==null)r(d.el=l(d.children),g,_);else{const b=d.el=u.el;d.children!==u.children&&a(b,d.children)}},B=(u,d,g,_)=>{u==null?r(d.el=c(d.children||""),g,_):d.el=u.el},k=(u,d,g,_)=>{[u.el,u.anchor]=E(u.children,d,g,_,u.el,u.anchor)},y=({el:u,anchor:d},g,_)=>{let b;for(;u&&u!==d;)b=m(u),r(u,g,_),u=b;r(d,g,_)},p=({el:u,anchor:d})=>{let g;for(;u&&u!==d;)g=m(u),s(u),u=g;s(d)},F=(u,d,g,_,b,A,P,x,S)=>{P=P||d.type==="svg",u==null?K(d,g,_,b,A,P,x,S):M(u,d,b,A,P,x,S)},K=(u,d,g,_,b,A,P,x)=>{let S,C;const{type:$,props:I,shapeFlag:j,transition:V,dirs:J}=u;if(S=u.el=i(u.type,A,I&&I.is,I),j&8?f(S,u.children):j&16&&v(u.children,S,null,_,b,A&&$!=="foreignObject",P,x),J&&Ie(u,null,_,"created"),N(S,u,u.scopeId,P,_),I){for(const Z in I)Z!=="value"&&!It(Z)&&o(S,Z,null,I[Z],A,u.children,_,b,$e);"value"in I&&o(S,"value",null,I.value),(C=I.onVnodeBeforeMount)&&Ce(C,_,u)}J&&Ie(u,null,_,"beforeMount");const G=Lo(b,V);G&&V.beforeEnter(S),r(S,d,g),((C=I&&I.onVnodeMounted)||G||J)&&ge(()=>{C&&Ce(C,_,u),G&&V.enter(S),J&&Ie(u,null,_,"mounted")},b)},N=(u,d,g,_,b)=>{if(g&&w(u,g),_)for(let A=0;A<_.length;A++)w(u,_[A]);if(b){let A=b.subTree;if(d===A){const P=b.vnode;N(u,P,P.scopeId,P.slotScopeIds,b.parent)}}},v=(u,d,g,_,b,A,P,x,S=0)=>{for(let C=S;C<u.length;C++){const $=u[C]=x?ze(u[C]):Ae(u[C]);T(null,$,d,g,_,b,A,P,x)}},M=(u,d,g,_,b,A,P)=>{const x=d.el=u.el;let{patchFlag:S,dynamicChildren:C,dirs:$}=d;S|=u.patchFlag&16;const I=u.props||te,j=d.props||te;let V;g&&et(g,!1),(V=j.onVnodeBeforeUpdate)&&Ce(V,g,d,u),$&&Ie(d,u,g,"beforeUpdate"),g&&et(g,!0);const J=b&&d.type!=="foreignObject";if(C?R(u.dynamicChildren,C,x,g,_,J,A):P||D(u,d,x,null,g,_,J,A,!1),S>0){if(S&16)z(x,d,I,j,g,_,b);else if(S&2&&I.class!==j.class&&o(x,"class",null,j.class,b),S&4&&o(x,"style",I.style,j.style,b),S&8){const G=d.dynamicProps;for(let Z=0;Z<G.length;Z++){const se=G[Z],Te=I[se],ht=j[se];(ht!==Te||se==="value")&&o(x,se,Te,ht,b,u.children,g,_,$e)}}S&1&&u.children!==d.children&&f(x,d.children)}else!P&&C==null&&z(x,d,I,j,g,_,b);((V=j.onVnodeUpdated)||$)&&ge(()=>{V&&Ce(V,g,d,u),$&&Ie(d,u,g,"updated")},_)},R=(u,d,g,_,b,A,P)=>{for(let x=0;x<d.length;x++){const S=u[x],C=d[x],$=S.el&&(S.type===me||!st(S,C)||S.shapeFlag&70)?h(S.el):g;T(S,C,$,null,_,b,A,P,!0)}},z=(u,d,g,_,b,A,P)=>{if(g!==_){if(g!==te)for(const x in g)!It(x)&&!(x in _)&&o(u,x,g[x],null,P,d.children,b,A,$e);for(const x in _){if(It(x))continue;const S=_[x],C=g[x];S!==C&&x!=="value"&&o(u,x,C,S,P,d.children,b,A,$e)}"value"in _&&o(u,"value",g.value,_.value)}},O=(u,d,g,_,b,A,P,x,S)=>{const C=d.el=u?u.el:l(""),$=d.anchor=u?u.anchor:l("");let{patchFlag:I,dynamicChildren:j,slotScopeIds:V}=d;V&&(x=x?x.concat(V):V),u==null?(r(C,g,_),r($,g,_),v(d.children,g,$,b,A,P,x,S)):I>0&&I&64&&j&&u.dynamicChildren?(R(u.dynamicChildren,j,g,b,A,P,x),(d.key!=null||b&&d===b.subTree)&&jr(u,d,!0)):D(u,d,g,$,b,A,P,x,S)},q=(u,d,g,_,b,A,P,x,S)=>{d.slotScopeIds=x,u==null?d.shapeFlag&512?b.ctx.activate(d,g,_,P,S):oe(d,g,_,b,A,P,S):fe(u,d,S)},oe=(u,d,g,_,b,A,P)=>{const x=u.component=ic(u,_,b);if(Jt(u)&&(x.ctx.renderer=dt),lc(x),x.asyncDep){if(b&&b.registerDep(x,H),!u.el){const S=x.subTree=re(ve);B(null,S,d,g)}return}H(x,u,d,g,b,A,P)},fe=(u,d,g)=>{const _=d.component=u.component;if(gl(u,d,g))if(_.asyncDep&&!_.asyncResolved){Y(_,d,g);return}else _.next=d,cl(_.update),_.update();else d.el=u.el,_.vnode=d},H=(u,d,g,_,b,A,P)=>{const x=()=>{if(u.isMounted){let{next:$,bu:I,u:j,parent:V,vnode:J}=u,G=$,Z;et(u,!1),$?($.el=J.el,Y(u,$,P)):$=J,I&&hn(I),(Z=$.props&&$.props.onVnodeBeforeUpdate)&&Ce(Z,V,$,J),et(u,!0);const se=Wn(u),Te=u.subTree;u.subTree=se,T(Te,se,h(Te.el),Qt(Te),u,b,A),$.el=se.el,G===null&&ml(u,se.el),j&&ge(j,b),(Z=$.props&&$.props.onVnodeUpdated)&&ge(()=>Ce(Z,V,$,J),b)}else{let $;const{el:I,props:j}=d,{bm:V,m:J,parent:G}=u,Z=vt(d);if(et(u,!1),V&&hn(V),!Z&&($=j&&j.onVnodeBeforeMount)&&Ce($,G,d),et(u,!0),I&&Kn){const se=()=>{u.subTree=Wn(u),Kn(I,u.subTree,u,b,null)};Z?d.type.__asyncLoader().then(()=>!u.isUnmounted&&se()):se()}else{const se=u.subTree=Wn(u);T(null,se,g,_,u,b,A),d.el=se.el}if(J&&ge(J,b),!Z&&($=j&&j.onVnodeMounted)){const se=d;ge(()=>Ce($,G,se),b)}(d.shapeFlag&256||G&&vt(G.vnode)&&G.vnode.shapeFlag&256)&&u.a&&ge(u.a,b),u.isMounted=!0,d=g=_=null}},S=u.effect=new Er(x,()=>In(C),u.scope),C=u.update=()=>S.run();C.id=u.uid,et(u,!0),C()},Y=(u,d,g)=>{d.component=u;const _=u.vnode.props;u.vnode=d,u.next=null,Kl(u,d.props,_,g),ql(u,d.children,g),At(),ns(),St()},D=(u,d,g,_,b,A,P,x,S=!1)=>{const C=u&&u.children,$=u?u.shapeFlag:0,I=d.children,{patchFlag:j,shapeFlag:V}=d;if(j>0){if(j&128){Xt(C,I,g,_,b,A,P,x,S);return}else if(j&256){He(C,I,g,_,b,A,P,x,S);return}}V&8?($&16&&$e(C,b,A),I!==C&&f(g,I)):$&16?V&16?Xt(C,I,g,_,b,A,P,x,S):$e(C,b,A,!0):($&8&&f(g,""),V&16&&v(I,g,_,b,A,P,x,S))},He=(u,d,g,_,b,A,P,x,S)=>{u=u||mt,d=d||mt;const C=u.length,$=d.length,I=Math.min(C,$);let j;for(j=0;j<I;j++){const V=d[j]=S?ze(d[j]):Ae(d[j]);T(u[j],V,g,null,b,A,P,x,S)}C>$?$e(u,b,A,!0,!1,I):v(d,g,_,b,A,P,x,S,I)},Xt=(u,d,g,_,b,A,P,x,S)=>{let C=0;const $=d.length;let I=u.length-1,j=$-1;for(;C<=I&&C<=j;){const V=u[C],J=d[C]=S?ze(d[C]):Ae(d[C]);if(st(V,J))T(V,J,g,null,b,A,P,x,S);else break;C++}for(;C<=I&&C<=j;){const V=u[I],J=d[j]=S?ze(d[j]):Ae(d[j]);if(st(V,J))T(V,J,g,null,b,A,P,x,S);else break;I--,j--}if(C>I){if(C<=j){const V=j+1,J=V<$?d[V].el:_;for(;C<=j;)T(null,d[C]=S?ze(d[C]):Ae(d[C]),g,J,b,A,P,x,S),C++}}else if(C>j)for(;C<=I;)Me(u[C],b,A,!0),C++;else{const V=C,J=C,G=new Map;for(C=J;C<=j;C++){const _e=d[C]=S?ze(d[C]):Ae(d[C]);_e.key!=null&&G.set(_e.key,C)}let Z,se=0;const Te=j-J+1;let ht=!1,Vr=0;const Ot=new Array(Te);for(C=0;C<Te;C++)Ot[C]=0;for(C=V;C<=I;C++){const _e=u[C];if(se>=Te){Me(_e,b,A,!0);continue}let Fe;if(_e.key!=null)Fe=G.get(_e.key);else for(Z=J;Z<=j;Z++)if(Ot[Z-J]===0&&st(_e,d[Z])){Fe=Z;break}Fe===void 0?Me(_e,b,A,!0):(Ot[Fe-J]=C+1,Fe>=Vr?Vr=Fe:ht=!0,T(_e,d[Fe],g,null,b,A,P,x,S),se++)}const qr=ht?Xl(Ot):mt;for(Z=qr.length-1,C=Te-1;C>=0;C--){const _e=J+C,Fe=d[_e],zr=_e+1<$?d[_e+1].el:_;Ot[C]===0?T(null,Fe,g,zr,b,A,P,x,S):ht&&(Z<0||C!==qr[Z]?Ge(Fe,g,zr,2):Z--)}}},Ge=(u,d,g,_,b=null)=>{const{el:A,type:P,transition:x,children:S,shapeFlag:C}=u;if(C&6){Ge(u.component.subTree,d,g,_);return}if(C&128){u.suspense.move(d,g,_);return}if(C&64){P.move(u,d,g,dt);return}if(P===me){r(A,d,g);for(let I=0;I<S.length;I++)Ge(S[I],d,g,_);r(u.anchor,d,g);return}if(P===$t){y(u,d,g);return}if(_!==2&&C&1&&x)if(_===0)x.beforeEnter(A),r(A,d,g),ge(()=>x.enter(A),b);else{const{leave:I,delayLeave:j,afterLeave:V}=x,J=()=>r(A,d,g),G=()=>{I(A,()=>{J(),V&&V()})};j?j(A,J,G):G()}else r(A,d,g)},Me=(u,d,g,_=!1,b=!1)=>{const{type:A,props:P,ref:x,children:S,dynamicChildren:C,shapeFlag:$,patchFlag:I,dirs:j}=u;if(x!=null&&En(x,null,g,u,!0),$&256){d.ctx.deactivate(u);return}const V=$&1&&j,J=!vt(u);let G;if(J&&(G=P&&P.onVnodeBeforeUnmount)&&Ce(G,d,u),$&6)fi(u.component,g,_);else{if($&128){u.suspense.unmount(g,_);return}V&&Ie(u,null,d,"beforeUnmount"),$&64?u.type.remove(u,d,g,b,dt,_):C&&(A!==me||I>0&&I&64)?$e(C,d,g,!1,!0):(A===me&&I&384||!b&&$&16)&&$e(S,d,g),_&&Kr(u)}(J&&(G=P&&P.onVnodeUnmounted)||V)&&ge(()=>{G&&Ce(G,d,u),V&&Ie(u,null,d,"unmounted")},g)},Kr=u=>{const{type:d,el:g,anchor:_,transition:b}=u;if(d===me){ui(g,_);return}if(d===$t){p(u);return}const A=()=>{s(g),b&&!b.persisted&&b.afterLeave&&b.afterLeave()};if(u.shapeFlag&1&&b&&!b.persisted){const{leave:P,delayLeave:x}=b,S=()=>P(g,A);x?x(u.el,A,S):S()}else A()},ui=(u,d)=>{let g;for(;u!==d;)g=m(u),s(u),u=g;s(d)},fi=(u,d,g)=>{const{bum:_,scope:b,update:A,subTree:P,um:x}=u;_&&hn(_),b.stop(),A&&(A.active=!1,Me(P,u,d,g)),x&&ge(x,d),ge(()=>{u.isUnmounted=!0},d),d&&d.pendingBranch&&!d.isUnmounted&&u.asyncDep&&!u.asyncResolved&&u.suspenseId===d.pendingId&&(d.deps--,d.deps===0&&d.resolve())},$e=(u,d,g,_=!1,b=!1,A=0)=>{for(let P=A;P<u.length;P++)Me(u[P],d,g,_,b)},Qt=u=>u.shapeFlag&6?Qt(u.component.subTree):u.shapeFlag&128?u.suspense.next():m(u.anchor||u.el),Wr=(u,d,g)=>{u==null?d._vnode&&Me(d._vnode,null,null,!0):T(d._vnode||null,u,d,null,null,null,g),ns(),bn(),d._vnode=u},dt={p:T,um:Me,m:Ge,r:Kr,mt:oe,mc:v,pc:D,pbc:R,n:Qt,o:e};let Un,Kn;return t&&([Un,Kn]=t(dt)),{render:Wr,hydrate:Un,createApp:Bl(Wr,Un)}}function et({effect:e,update:t},n){e.allowRecurse=t.allowRecurse=n}function Lo(e,t){return(!e||e&&!e.pendingBranch)&&t&&!t.persisted}function jr(e,t,n=!1){const r=e.children,s=t.children;if(U(r)&&U(s))for(let o=0;o<r.length;o++){const i=r[o];let l=s[o];l.shapeFlag&1&&!l.dynamicChildren&&((l.patchFlag<=0||l.patchFlag===32)&&(l=s[o]=ze(s[o]),l.el=i.el),n||jr(i,l)),l.type===Et&&(l.el=i.el)}}function Xl(e){const t=e.slice(),n=[0];let r,s,o,i,l;const c=e.length;for(r=0;r<c;r++){const a=e[r];if(a!==0){if(s=n[n.length-1],e[s]<a){t[r]=s,n.push(r);continue}for(o=0,i=n.length-1;o<i;)l=o+i>>1,e[n[l]]<a?o=l+1:i=l;a<e[n[o]]&&(o>0&&(t[r]=n[o-1]),n[o]=r)}}for(o=n.length,i=n[o-1];o-- >0;)n[o]=i,i=t[i];return n}const Ql=e=>e.__isTeleport,Ht=e=>e&&(e.disabled||e.disabled===""),ps=e=>typeof SVGElement<"u"&&e instanceof SVGElement,dr=(e,t)=>{const n=e&&e.to;return ne(n)?t?t(n):null:n},Zl={__isTeleport:!0,process(e,t,n,r,s,o,i,l,c,a){const{mc:f,pc:h,pbc:m,o:{insert:w,querySelector:E,createText:T,createComment:L}}=a,B=Ht(t.props);let{shapeFlag:k,children:y,dynamicChildren:p}=t;if(e==null){const F=t.el=T(""),K=t.anchor=T("");w(F,n,r),w(K,n,r);const N=t.target=dr(t.props,E),v=t.targetAnchor=T("");N&&(w(v,N),i=i||ps(N));const M=(R,z)=>{k&16&&f(y,R,z,s,o,i,l,c)};B?M(n,K):N&&M(N,v)}else{t.el=e.el;const F=t.anchor=e.anchor,K=t.target=e.target,N=t.targetAnchor=e.targetAnchor,v=Ht(e.props),M=v?n:K,R=v?F:N;if(i=i||ps(K),p?(m(e.dynamicChildren,p,M,s,o,i,l),jr(e,t,!0)):c||h(e,t,M,R,s,o,i,l,!1),B)v?t.props&&e.props&&t.props.to!==e.props.to&&(t.props.to=e.props.to):cn(t,n,F,a,1);else if((t.props&&t.props.to)!==(e.props&&e.props.to)){const z=t.target=dr(t.props,E);z&&cn(t,z,null,a,0)}else v&&cn(t,K,N,a,1)}No(t)},remove(e,t,n,r,{um:s,o:{remove:o}},i){const{shapeFlag:l,children:c,anchor:a,targetAnchor:f,target:h,props:m}=e;if(h&&o(f),i&&o(a),l&16){const w=i||!Ht(m);for(let E=0;E<c.length;E++){const T=c[E];s(T,t,n,w,!!T.dynamicChildren)}}},move:cn,hydrate:Gl};function cn(e,t,n,{o:{insert:r},m:s},o=2){o===0&&r(e.targetAnchor,t,n);const{el:i,anchor:l,shapeFlag:c,children:a,props:f}=e,h=o===2;if(h&&r(i,t,n),(!h||Ht(f))&&c&16)for(let m=0;m<a.length;m++)s(a[m],t,n,2);h&&r(l,t,n)}function Gl(e,t,n,r,s,o,{o:{nextSibling:i,parentNode:l,querySelector:c}},a){const f=t.target=dr(t.props,c);if(f){const h=f._lpa||f.firstChild;if(t.shapeFlag&16)if(Ht(t.props))t.anchor=a(i(e),t,l(e),n,r,s,o),t.targetAnchor=h;else{t.anchor=i(e);let m=h;for(;m;)if(m=i(m),m&&m.nodeType===8&&m.data==="teleport anchor"){t.targetAnchor=m,f._lpa=t.targetAnchor&&i(t.targetAnchor);break}a(h,t,f,n,r,s,o)}No(t)}return t.anchor&&i(t.anchor)}const qa=Zl;function No(e){const t=e.ctx;if(t&&t.ut){let n=e.children[0].el;for(;n&&n!==e.targetAnchor;)n.nodeType===1&&n.setAttribute("data-v-owner",t.uid),n=n.nextSibling;t.ut()}}const me=Symbol.for("v-fgt"),Et=Symbol.for("v-txt"),ve=Symbol.for("v-cmt"),$t=Symbol.for("v-stc"),jt=[];let Re=null;function Ho(e=!1){jt.push(Re=e?null:[])}function ec(){jt.pop(),Re=jt[jt.length-1]||null}let Kt=1;function gs(e){Kt+=e}function $o(e){return e.dynamicChildren=Kt>0?Re||mt:null,ec(),Kt>0&&Re&&Re.push(e),e}function za(e,t,n,r,s,o){return $o(Bo(e,t,n,r,s,o,!0))}function jo(e,t,n,r,s){return $o(re(e,t,n,r,s,!0))}function xn(e){return e?e.__v_isVNode===!0:!1}function st(e,t){return e.type===t.type&&e.key===t.key}const Dn="__vInternal",Do=({key:e})=>e??null,pn=({ref:e,ref_key:t,ref_for:n})=>(typeof e=="number"&&(e=""+e),e!=null?ne(e)||ce(e)||W(e)?{i:de,r:e,k:t,f:!!n}:e:null);function Bo(e,t=null,n=null,r=0,s=null,o=e===me?0:1,i=!1,l=!1){const c={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&Do(t),ref:t&&pn(t),scopeId:Nn,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:o,patchFlag:r,dynamicProps:s,dynamicChildren:null,appContext:null,ctx:de};return l?(Dr(c,n),o&128&&e.normalize(c)):n&&(c.shapeFlag|=ne(n)?8:16),Kt>0&&!i&&Re&&(c.patchFlag>0||o&6)&&c.patchFlag!==32&&Re.push(c),c}const re=tc;function tc(e,t=null,n=null,r=0,s=null,o=!1){if((!e||e===Eo)&&(e=ve),xn(e)){const l=Ze(e,t,!0);return n&&Dr(l,n),Kt>0&&!o&&Re&&(l.shapeFlag&6?Re[Re.indexOf(e)]=l:Re.push(l)),l.patchFlag|=-2,l}if(fc(e)&&(e=e.__vccOpts),t){t=nc(t);let{class:l,style:c}=t;l&&!ne(l)&&(t.class=wr(l)),ee(c)&&(co(c)&&!U(c)&&(c=ue({},c)),t.style=vr(c))}const i=ne(e)?1:yl(e)?128:Ql(e)?64:ee(e)?4:W(e)?2:0;return Bo(e,t,n,r,s,i,o,!0)}function nc(e){return e?co(e)||Dn in e?ue({},e):e:null}function Ze(e,t,n=!1){const{props:r,ref:s,patchFlag:o,children:i}=e,l=t?rc(r||{},t):r;return{__v_isVNode:!0,__v_skip:!0,type:e.type,props:l,key:l&&Do(l),ref:t&&t.ref?n&&s?U(s)?s.concat(pn(t)):[s,pn(t)]:pn(t):s,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:i,target:e.target,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==me?o===-1?16:o|16:o,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:e.transition,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&Ze(e.ssContent),ssFallback:e.ssFallback&&Ze(e.ssFallback),el:e.el,anchor:e.anchor,ctx:e.ctx,ce:e.ce}}function ko(e=" ",t=0){return re(Et,null,e,t)}function Ya(e,t){const n=re($t,null,e);return n.staticCount=t,n}function Ja(e="",t=!1){return t?(Ho(),jo(ve,null,e)):re(ve,null,e)}function Ae(e){return e==null||typeof e=="boolean"?re(ve):U(e)?re(me,null,e.slice()):typeof e=="object"?ze(e):re(Et,null,String(e))}function ze(e){return e.el===null&&e.patchFlag!==-1||e.memo?e:Ze(e)}function Dr(e,t){let n=0;const{shapeFlag:r}=e;if(t==null)t=null;else if(U(t))n=16;else if(typeof t=="object")if(r&65){const s=t.default;s&&(s._c&&(s._d=!1),Dr(e,s()),s._c&&(s._d=!0));return}else{n=32;const s=t._;!s&&!(Dn in t)?t._ctx=de:s===3&&de&&(de.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else W(t)?(t={default:t,_ctx:de},n=32):(t=String(t),r&64?(n=16,t=[ko(t)]):n=8);e.children=t,e.shapeFlag|=n}function rc(...e){const t={};for(let n=0;n<e.length;n++){const r=e[n];for(const s in r)if(s==="class")t.class!==r.class&&(t.class=wr([t.class,r.class]));else if(s==="style")t.style=vr([t.style,r.style]);else if(zt(s)){const o=t[s],i=r[s];i&&o!==i&&!(U(o)&&o.includes(i))&&(t[s]=o?[].concat(o,i):i)}else s!==""&&(t[s]=r[s])}return t}function Ce(e,t,n,r=null){xe(e,t,7,[n,r])}const sc=So();let oc=0;function ic(e,t,n){const r=e.type,s=(t?t.appContext:e.appContext)||sc,o={uid:oc++,vnode:e,type:r,parent:t,appContext:s,root:null,next:null,subTree:null,effect:null,update:null,scope:new Ti(!0),render:null,proxy:null,exposed:null,exposeProxy:null,withProxy:null,provides:t?t.provides:Object.create(s.provides),accessCache:null,renderCache:[],components:null,directives:null,propsOptions:Oo(r,s),emitsOptions:go(r,s),emit:null,emitted:null,propsDefaults:te,inheritAttrs:r.inheritAttrs,ctx:te,data:te,props:te,attrs:te,slots:te,refs:te,setupState:te,setupContext:null,attrsProxy:null,slotsProxy:null,suspense:n,suspenseId:n?n.pendingId:0,asyncDep:null,asyncResolved:!1,isMounted:!1,isUnmounted:!1,isDeactivated:!1,bc:null,c:null,bm:null,m:null,bu:null,u:null,um:null,bum:null,da:null,a:null,rtg:null,rtc:null,ec:null,sp:null};return o.ctx={_:o},o.root=t?t.root:o,o.emit=fl.bind(null,o),e.ce&&e.ce(o),o}let le=null;const Bn=()=>le||de;let Br,pt,ms="__VUE_INSTANCE_SETTERS__";(pt=tr()[ms])||(pt=tr()[ms]=[]),pt.push(e=>le=e),Br=e=>{pt.length>1?pt.forEach(t=>t(e)):pt[0](e)};const xt=e=>{Br(e),e.scope.on()},ct=()=>{le&&le.scope.off(),Br(null)};function Uo(e){return e.vnode.shapeFlag&4}let Tt=!1;function lc(e,t=!1){Tt=t;const{props:n,children:r}=e.vnode,s=Uo(e);Ul(e,n,s,t),Vl(e,r);const o=s?cc(e,t):void 0;return Tt=!1,o}function cc(e,t){const n=e.type;e.accessCache=Object.create(null),e.proxy=Lt(new Proxy(e.ctx,Fl));const{setup:r}=n;if(r){const s=e.setupContext=r.length>1?Wo(e):null;xt(e),At();const o=Je(r,e,0,[e.props,s]);if(St(),ct(),qs(o)){if(o.then(ct,ct),t)return o.then(i=>{ys(e,i,t)}).catch(i=>{Yt(i,e,0)});e.asyncDep=o}else ys(e,o,t)}else Ko(e,t)}function ys(e,t,n){W(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:ee(t)&&(e.setupState=uo(t)),Ko(e,n)}let _s;function Ko(e,t,n){const r=e.type;if(!e.render){if(!t&&_s&&!r.render){const s=r.template||Hr(e).template;if(s){const{isCustomElement:o,compilerOptions:i}=e.appContext.config,{delimiters:l,compilerOptions:c}=r,a=ue(ue({isCustomElement:o,delimiters:l},i),c);r.render=_s(s,a)}}e.render=r.render||Oe}{xt(e),At();try{Ll(e)}finally{St(),ct()}}}function ac(e){return e.attrsProxy||(e.attrsProxy=new Proxy(e.attrs,{get(t,n){return ye(e,"get","$attrs"),t[n]}}))}function Wo(e){const t=n=>{e.exposed=n||{}};return{get attrs(){return ac(e)},slots:e.slots,emit:e.emit,expose:t}}function kn(e){if(e.exposed)return e.exposeProxy||(e.exposeProxy=new Proxy(uo(Lt(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in Nt)return Nt[n](e)},has(t,n){return n in t||n in Nt}}))}function uc(e,t=!0){return W(e)?e.displayName||e.name:e.name||t&&e.__name}function fc(e){return W(e)&&"__vccOpts"in e}const ie=(e,t)=>ol(e,t,Tt);function hr(e,t,n){const r=arguments.length;return r===2?ee(t)&&!U(t)?xn(t)?re(e,null,[t]):re(e,t):re(e,null,t):(r>3?n=Array.prototype.slice.call(arguments,2):r===3&&xn(n)&&(n=[n]),re(e,t,n))}const dc=Symbol.for("v-scx"),hc=()=>wt(dc),pc="3.3.7",gc="http://www.w3.org/2000/svg",ot=typeof document<"u"?document:null,bs=ot&&ot.createElement("template"),mc={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{const t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,r)=>{const s=t?ot.createElementNS(gc,e):ot.createElement(e,n?{is:n}:void 0);return e==="select"&&r&&r.multiple!=null&&s.setAttribute("multiple",r.multiple),s},createText:e=>ot.createTextNode(e),createComment:e=>ot.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>ot.querySelector(e),setScopeId(e,t){e.setAttribute(t,"")},insertStaticContent(e,t,n,r,s,o){const i=n?n.previousSibling:t.lastChild;if(s&&(s===o||s.nextSibling))for(;t.insertBefore(s.cloneNode(!0),n),!(s===o||!(s=s.nextSibling)););else{bs.innerHTML=r?`<svg>${e}</svg>`:e;const l=bs.content;if(r){const c=l.firstChild;for(;c.firstChild;)l.appendChild(c.firstChild);l.removeChild(c)}t.insertBefore(l,n)}return[i?i.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}},We="transition",Pt="animation",Wt=Symbol("_vtc"),Vo=(e,{slots:t})=>hr(wl,yc(e),t);Vo.displayName="Transition";const qo={name:String,type:String,css:{type:Boolean,default:!0},duration:[String,Number,Object],enterFromClass:String,enterActiveClass:String,enterToClass:String,appearFromClass:String,appearActiveClass:String,appearToClass:String,leaveFromClass:String,leaveActiveClass:String,leaveToClass:String};Vo.props=ue({},_o,qo);const tt=(e,t=[])=>{U(e)?e.forEach(n=>n(...t)):e&&e(...t)},vs=e=>e?U(e)?e.some(t=>t.length>1):e.length>1:!1;function yc(e){const t={};for(const O in e)O in qo||(t[O]=e[O]);if(e.css===!1)return t;const{name:n="v",type:r,duration:s,enterFromClass:o=`${n}-enter-from`,enterActiveClass:i=`${n}-enter-active`,enterToClass:l=`${n}-enter-to`,appearFromClass:c=o,appearActiveClass:a=i,appearToClass:f=l,leaveFromClass:h=`${n}-leave-from`,leaveActiveClass:m=`${n}-leave-active`,leaveToClass:w=`${n}-leave-to`}=e,E=_c(s),T=E&&E[0],L=E&&E[1],{onBeforeEnter:B,onEnter:k,onEnterCancelled:y,onLeave:p,onLeaveCancelled:F,onBeforeAppear:K=B,onAppear:N=k,onAppearCancelled:v=y}=t,M=(O,q,oe)=>{nt(O,q?f:l),nt(O,q?a:i),oe&&oe()},R=(O,q)=>{O._isLeaving=!1,nt(O,h),nt(O,w),nt(O,m),q&&q()},z=O=>(q,oe)=>{const fe=O?N:k,H=()=>M(q,O,oe);tt(fe,[q,H]),ws(()=>{nt(q,O?c:o),Ve(q,O?f:l),vs(fe)||Cs(q,r,T,H)})};return ue(t,{onBeforeEnter(O){tt(B,[O]),Ve(O,o),Ve(O,i)},onBeforeAppear(O){tt(K,[O]),Ve(O,c),Ve(O,a)},onEnter:z(!1),onAppear:z(!0),onLeave(O,q){O._isLeaving=!0;const oe=()=>R(O,q);Ve(O,h),wc(),Ve(O,m),ws(()=>{O._isLeaving&&(nt(O,h),Ve(O,w),vs(p)||Cs(O,r,L,oe))}),tt(p,[O,oe])},onEnterCancelled(O){M(O,!1),tt(y,[O])},onAppearCancelled(O){M(O,!0),tt(v,[O])},onLeaveCancelled(O){R(O),tt(F,[O])}})}function _c(e){if(e==null)return null;if(ee(e))return[Yn(e.enter),Yn(e.leave)];{const t=Yn(e);return[t,t]}}function Yn(e){return _i(e)}function Ve(e,t){t.split(/\s+/).forEach(n=>n&&e.classList.add(n)),(e[Wt]||(e[Wt]=new Set)).add(t)}function nt(e,t){t.split(/\s+/).forEach(r=>r&&e.classList.remove(r));const n=e[Wt];n&&(n.delete(t),n.size||(e[Wt]=void 0))}function ws(e){requestAnimationFrame(()=>{requestAnimationFrame(e)})}let bc=0;function Cs(e,t,n,r){const s=e._endId=++bc,o=()=>{s===e._endId&&r()};if(n)return setTimeout(o,n);const{type:i,timeout:l,propCount:c}=vc(e,t);if(!i)return r();const a=i+"end";let f=0;const h=()=>{e.removeEventListener(a,m),o()},m=w=>{w.target===e&&++f>=c&&h()};setTimeout(()=>{f<c&&h()},l+1),e.addEventListener(a,m)}function vc(e,t){const n=window.getComputedStyle(e),r=E=>(n[E]||"").split(", "),s=r(`${We}Delay`),o=r(`${We}Duration`),i=Es(s,o),l=r(`${Pt}Delay`),c=r(`${Pt}Duration`),a=Es(l,c);let f=null,h=0,m=0;t===We?i>0&&(f=We,h=i,m=o.length):t===Pt?a>0&&(f=Pt,h=a,m=c.length):(h=Math.max(i,a),f=h>0?i>a?We:Pt:null,m=f?f===We?o.length:c.length:0);const w=f===We&&/\b(transform|all)(,|$)/.test(r(`${We}Property`).toString());return{type:f,timeout:h,propCount:m,hasTransform:w}}function Es(e,t){for(;e.length<t.length;)e=e.concat(e);return Math.max(...t.map((n,r)=>xs(n)+xs(e[r])))}function xs(e){return e==="auto"?0:Number(e.slice(0,-1).replace(",","."))*1e3}function wc(){return document.body.offsetHeight}function Cc(e,t,n){const r=e[Wt];r&&(t=(t?[t,...r]:[...r]).join(" ")),t==null?e.removeAttribute("class"):n?e.setAttribute("class",t):e.className=t}const Ec=Symbol("_vod");function xc(e,t,n){const r=e.style,s=ne(n);if(n&&!s){if(t&&!ne(t))for(const o in t)n[o]==null&&pr(r,o,"");for(const o in n)pr(r,o,n[o])}else{const o=r.display;s?t!==n&&(r.cssText=n):t&&e.removeAttribute("style"),Ec in e&&(r.display=o)}}const Ts=/\s*!important$/;function pr(e,t,n){if(U(n))n.forEach(r=>pr(e,t,r));else if(n==null&&(n=""),t.startsWith("--"))e.setProperty(t,n);else{const r=Tc(e,t);Ts.test(n)?e.setProperty(ft(r),n.replace(Ts,""),"important"):e[r]=n}}const As=["Webkit","Moz","ms"],Jn={};function Tc(e,t){const n=Jn[t];if(n)return n;let r=Ne(t);if(r!=="filter"&&r in e)return Jn[t]=r;r=Rn(r);for(let s=0;s<As.length;s++){const o=As[s]+r;if(o in e)return Jn[t]=o}return t}const Ss="http://www.w3.org/1999/xlink";function Ac(e,t,n,r,s){if(r&&t.startsWith("xlink:"))n==null?e.removeAttributeNS(Ss,t.slice(6,t.length)):e.setAttributeNS(Ss,t,n);else{const o=xi(t);n==null||o&&!Js(n)?e.removeAttribute(t):e.setAttribute(t,o?"":n)}}function Sc(e,t,n,r,s,o,i){if(t==="innerHTML"||t==="textContent"){r&&i(r,s,o),e[t]=n??"";return}const l=e.tagName;if(t==="value"&&l!=="PROGRESS"&&!l.includes("-")){e._value=n;const a=l==="OPTION"?e.getAttribute("value"):e.value,f=n??"";a!==f&&(e.value=f),n==null&&e.removeAttribute(t);return}let c=!1;if(n===""||n==null){const a=typeof e[t];a==="boolean"?n=Js(n):n==null&&a==="string"?(n="",c=!0):a==="number"&&(n=0,c=!0)}try{e[t]=n}catch{}c&&e.removeAttribute(t)}function gt(e,t,n,r){e.addEventListener(t,n,r)}function Rc(e,t,n,r){e.removeEventListener(t,n,r)}const Rs=Symbol("_vei");function Oc(e,t,n,r,s=null){const o=e[Rs]||(e[Rs]={}),i=o[t];if(r&&i)i.value=r;else{const[l,c]=Pc(t);if(r){const a=o[t]=Ic(r,s);gt(e,l,a,c)}else i&&(Rc(e,l,i,c),o[t]=void 0)}}const Os=/(?:Once|Passive|Capture)$/;function Pc(e){let t;if(Os.test(e)){t={};let r;for(;r=e.match(Os);)e=e.slice(0,e.length-r[0].length),t[r[0].toLowerCase()]=!0}return[e[2]===":"?e.slice(3):ft(e.slice(2)),t]}let Xn=0;const Mc=Promise.resolve(),Fc=()=>Xn||(Mc.then(()=>Xn=0),Xn=Date.now());function Ic(e,t){const n=r=>{if(!r._vts)r._vts=Date.now();else if(r._vts<=n.attached)return;xe(Lc(r,n.value),t,5,[r])};return n.value=e,n.attached=Fc(),n}function Lc(e,t){if(U(t)){const n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(r=>s=>!s._stopped&&r&&r(s))}else return t}const Ps=/^on[a-z]/,Nc=(e,t,n,r,s=!1,o,i,l,c)=>{t==="class"?Cc(e,r,s):t==="style"?xc(e,n,r):zt(t)?yr(t)||Oc(e,t,n,r,i):(t[0]==="."?(t=t.slice(1),!0):t[0]==="^"?(t=t.slice(1),!1):Hc(e,t,r,s))?Sc(e,t,r,o,i,l,c):(t==="true-value"?e._trueValue=r:t==="false-value"&&(e._falseValue=r),Ac(e,t,r,s))};function Hc(e,t,n,r){return r?!!(t==="innerHTML"||t==="textContent"||t in e&&Ps.test(t)&&W(n)):t==="spellcheck"||t==="draggable"||t==="translate"||t==="form"||t==="list"&&e.tagName==="INPUT"||t==="type"&&e.tagName==="TEXTAREA"||Ps.test(t)&&ne(n)?!1:t in e}const Ms=e=>{const t=e.props["onUpdate:modelValue"]||!1;return U(t)?n=>hn(t,n):t};function $c(e){e.target.composing=!0}function Fs(e){const t=e.target;t.composing&&(t.composing=!1,t.dispatchEvent(new Event("input")))}const Qn=Symbol("_assign"),Xa={created(e,{modifiers:{lazy:t,trim:n,number:r}},s){e[Qn]=Ms(s);const o=r||s.props&&s.props.type==="number";gt(e,t?"change":"input",i=>{if(i.target.composing)return;let l=e.value;n&&(l=l.trim()),o&&(l=er(l)),e[Qn](l)}),n&&gt(e,"change",()=>{e.value=e.value.trim()}),t||(gt(e,"compositionstart",$c),gt(e,"compositionend",Fs),gt(e,"change",Fs))},mounted(e,{value:t}){e.value=t??""},beforeUpdate(e,{value:t,modifiers:{lazy:n,trim:r,number:s}},o){if(e[Qn]=Ms(o),e.composing||document.activeElement===e&&e.type!=="range"&&(n||r&&e.value.trim()===t||(s||e.type==="number")&&er(e.value)===t))return;const i=t??"";e.value!==i&&(e.value=i)}},jc=["ctrl","shift","alt","meta"],Dc={stop:e=>e.stopPropagation(),prevent:e=>e.preventDefault(),self:e=>e.target!==e.currentTarget,ctrl:e=>!e.ctrlKey,shift:e=>!e.shiftKey,alt:e=>!e.altKey,meta:e=>!e.metaKey,left:e=>"button"in e&&e.button!==0,middle:e=>"button"in e&&e.button!==1,right:e=>"button"in e&&e.button!==2,exact:(e,t)=>jc.some(n=>e[`${n}Key`]&&!t.includes(n))},Qa=(e,t)=>(n,...r)=>{for(let s=0;s<t.length;s++){const o=Dc[t[s]];if(o&&o(n,t))return}return e(n,...r)},Bc={esc:"escape",space:" ",up:"arrow-up",left:"arrow-left",right:"arrow-right",down:"arrow-down",delete:"backspace"},Za=(e,t)=>n=>{if(!("key"in n))return;const r=ft(n.key);if(t.some(s=>s===r||Bc[s]===r))return e(n)},zo=ue({patchProp:Nc},mc);let Dt,Is=!1;function kc(){return Dt||(Dt=Yl(zo))}function Uc(){return Dt=Is?Dt:Jl(zo),Is=!0,Dt}const Ga=(...e)=>{const t=kc().createApp(...e),{mount:n}=t;return t.mount=r=>{const s=Yo(r);if(!s)return;const o=t._component;!W(o)&&!o.render&&!o.template&&(o.template=s.innerHTML),s.innerHTML="";const i=n(s,!1,s instanceof SVGElement);return s instanceof Element&&(s.removeAttribute("v-cloak"),s.setAttribute("data-v-app","")),i},t},eu=(...e)=>{const t=Uc().createApp(...e),{mount:n}=t;return t.mount=r=>{const s=Yo(r);if(s)return n(s,!0,s instanceof SVGElement)},t};function Yo(e){return ne(e)?document.querySelector(e):e}const tu=(e,t)=>{const n=e.__vccOpts||e;for(const[r,s]of t)n[r]=s;return n},Kc="modulepreload",Wc=function(e){return"/learning-docs2/"+e},Ls={},nu=function(t,n,r){if(!n||n.length===0)return t();const s=document.getElementsByTagName("link");return Promise.all(n.map(o=>{if(o=Wc(o),o in Ls)return;Ls[o]=!0;const i=o.endsWith(".css"),l=i?'[rel="stylesheet"]':"";if(!!r)for(let f=s.length-1;f>=0;f--){const h=s[f];if(h.href===o&&(!i||h.rel==="stylesheet"))return}else if(document.querySelector(`link[href="${o}"]${l}`))return;const a=document.createElement("link");if(a.rel=i?"stylesheet":Kc,i||(a.as="script",a.crossOrigin=""),a.href=o,document.head.appendChild(a),i)return new Promise((f,h)=>{a.addEventListener("load",f),a.addEventListener("error",()=>h(new Error(`Unable to preload CSS for ${o}`)))})})).then(()=>t()).catch(o=>{const i=new Event("vite:preloadError",{cancelable:!0});if(i.payload=o,window.dispatchEvent(i),!i.defaultPrevented)throw o})},Vc=window.__VP_SITE_DATA__;function kr(e){return Qs()?(Si(e),!0):!1}function Pe(e){return typeof e=="function"?e():Mr(e)}function ru(e,t){const n=(t==null?void 0:t.computedGetter)===!1?Mr:Pe;return function(...r){return ie(()=>e.apply(this,r.map(s=>n(s))))}}const Jo=typeof window<"u"&&typeof document<"u",qc=Object.prototype.toString,zc=e=>qc.call(e)==="[object Object]",Vt=()=>{},Ns=Yc();function Yc(){var e;return Jo&&((e=window==null?void 0:window.navigator)==null?void 0:e.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent)}function Jc(e,t){function n(...r){return new Promise((s,o)=>{Promise.resolve(e(()=>t.apply(this,r),{fn:t,thisArg:this,args:r})).then(s).catch(o)})}return n}const Xo=e=>e();function Xc(e,t={}){let n,r,s=Vt;const o=l=>{clearTimeout(l),s(),s=Vt};return l=>{const c=Pe(e),a=Pe(t.maxWait);return n&&o(n),c<=0||a!==void 0&&a<=0?(r&&(o(r),r=null),Promise.resolve(l())):new Promise((f,h)=>{s=t.rejectOnCancel?h:f,a&&!r&&(r=setTimeout(()=>{n&&o(n),r=null,f(l())},a)),n=setTimeout(()=>{r&&o(r),r=null,f(l())},c)})}}function Qc(e=Xo){const t=ae(!0);function n(){t.value=!1}function r(){t.value=!0}const s=(...o)=>{t.value&&e(...o)};return{isActive:Mn(t),pause:n,resume:r,eventFilter:s}}function Qo(...e){if(e.length!==1)return nl(...e);const t=e[0];return typeof t=="function"?Mn(Gi(()=>({get:t,set:Vt}))):ae(t)}function Zo(e,t,n={}){const{eventFilter:r=Xo,...s}=n;return Xe(e,Jc(r,t),s)}function Zc(e,t,n={}){const{eventFilter:r,...s}=n,{eventFilter:o,pause:i,resume:l,isActive:c}=Qc(r);return{stop:Zo(e,t,{...s,eventFilter:o}),pause:i,resume:l,isActive:c}}function Gc(e,t=!0){Bn()?Rt(e):t?e():Fn(e)}function su(e,t,n={}){const{debounce:r=0,maxWait:s=void 0,...o}=n;return Zo(e,t,{...o,eventFilter:Xc(r,{maxWait:s})})}function ou(e,t,n){let r;ce(n)?r={evaluating:n}:r=n||{};const{lazy:s=!1,evaluating:o=void 0,shallow:i=!0,onError:l=Vt}=r,c=ae(!s),a=i?Pr(t):ae(t);let f=0;return Ir(async h=>{if(!c.value)return;f++;const m=f;let w=!1;o&&Promise.resolve().then(()=>{o.value=!0});try{const E=await e(T=>{h(()=>{o&&(o.value=!1),w||T()})});m===f&&(a.value=E)}catch(E){l(E)}finally{o&&m===f&&(o.value=!1),w=!0}}),s?ie(()=>(c.value=!0,a.value)):a}function Go(e){var t;const n=Pe(e);return(t=n==null?void 0:n.$el)!=null?t:n}const Be=Jo?window:void 0;function qt(...e){let t,n,r,s;if(typeof e[0]=="string"||Array.isArray(e[0])?([n,r,s]=e,t=Be):[t,n,r,s]=e,!t)return Vt;Array.isArray(n)||(n=[n]),Array.isArray(r)||(r=[r]);const o=[],i=()=>{o.forEach(f=>f()),o.length=0},l=(f,h,m,w)=>(f.addEventListener(h,m,w),()=>f.removeEventListener(h,m,w)),c=Xe(()=>[Go(t),Pe(s)],([f,h])=>{if(i(),!f)return;const m=zc(h)?{...h}:h;o.push(...n.flatMap(w=>r.map(E=>l(f,w,E,m))))},{immediate:!0,flush:"post"}),a=()=>{c(),i()};return kr(a),a}function ea(e){return typeof e=="function"?e:typeof e=="string"?t=>t.key===e:Array.isArray(e)?t=>e.includes(t.key):()=>!0}function iu(...e){let t,n,r={};e.length===3?(t=e[0],n=e[1],r=e[2]):e.length===2?typeof e[1]=="object"?(t=!0,n=e[0],r=e[1]):(t=e[0],n=e[1]):(t=!0,n=e[0]);const{target:s=Be,eventName:o="keydown",passive:i=!1,dedupe:l=!1}=r,c=ea(t);return qt(s,o,f=>{f.repeat&&Pe(l)||c(f)&&n(f)},i)}function ta(){const e=ae(!1);return Bn()&&Rt(()=>{e.value=!0}),e}function na(e){const t=ta();return ie(()=>(t.value,!!e()))}function ra(e,t={}){const{window:n=Be}=t,r=na(()=>n&&"matchMedia"in n&&typeof n.matchMedia=="function");let s;const o=ae(!1),i=a=>{o.value=a.matches},l=()=>{s&&("removeEventListener"in s?s.removeEventListener("change",i):s.removeListener(i))},c=Ir(()=>{r.value&&(l(),s=n.matchMedia(Pe(e)),"addEventListener"in s?s.addEventListener("change",i):s.addListener(i),o.value=s.matches)});return kr(()=>{c(),l(),s=void 0}),o}const an=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},un="__vueuse_ssr_handlers__",sa=oa();function oa(){return un in an||(an[un]=an[un]||{}),an[un]}function ei(e,t){return sa[e]||t}function ia(e){return e==null?"any":e instanceof Set?"set":e instanceof Map?"map":e instanceof Date?"date":typeof e=="boolean"?"boolean":typeof e=="string"?"string":typeof e=="object"?"object":Number.isNaN(e)?"any":"number"}const la={boolean:{read:e=>e==="true",write:e=>String(e)},object:{read:e=>JSON.parse(e),write:e=>JSON.stringify(e)},number:{read:e=>Number.parseFloat(e),write:e=>String(e)},any:{read:e=>e,write:e=>String(e)},string:{read:e=>e,write:e=>String(e)},map:{read:e=>new Map(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))},set:{read:e=>new Set(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e))},date:{read:e=>new Date(e),write:e=>e.toISOString()}},Hs="vueuse-storage";function Ur(e,t,n,r={}){var s;const{flush:o="pre",deep:i=!0,listenToStorageChanges:l=!0,writeDefaults:c=!0,mergeDefaults:a=!1,shallow:f,window:h=Be,eventFilter:m,onError:w=v=>{console.error(v)}}=r,E=(f?Pr:ae)(t);if(!n)try{n=ei("getDefaultStorage",()=>{var v;return(v=Be)==null?void 0:v.localStorage})()}catch(v){w(v)}if(!n)return E;const T=Pe(t),L=ia(T),B=(s=r.serializer)!=null?s:la[L],{pause:k,resume:y}=Zc(E,()=>p(E.value),{flush:o,deep:i,eventFilter:m});return h&&l&&(qt(h,"storage",N),qt(h,Hs,K)),N(),E;function p(v){try{if(v==null)n.removeItem(e);else{const M=B.write(v),R=n.getItem(e);R!==M&&(n.setItem(e,M),h&&h.dispatchEvent(new CustomEvent(Hs,{detail:{key:e,oldValue:R,newValue:M,storageArea:n}})))}}catch(M){w(M)}}function F(v){const M=v?v.newValue:n.getItem(e);if(M==null)return c&&T!==null&&n.setItem(e,B.write(T)),T;if(!v&&a){const R=B.read(M);return typeof a=="function"?a(R,T):L==="object"&&!Array.isArray(R)?{...T,...R}:R}else return typeof M!="string"?M:B.read(M)}function K(v){N(v.detail)}function N(v){if(!(v&&v.storageArea!==n)){if(v&&v.key==null){E.value=T;return}if(!(v&&v.key!==e)){k();try{(v==null?void 0:v.newValue)!==B.write(E.value)&&(E.value=F(v))}catch(M){w(M)}finally{v?Fn(y):y()}}}}}function ca(e){return ra("(prefers-color-scheme: dark)",e)}function aa(e={}){const{selector:t="html",attribute:n="class",initialValue:r="auto",window:s=Be,storage:o,storageKey:i="vueuse-color-scheme",listenToStorageChanges:l=!0,storageRef:c,emitAuto:a,disableTransition:f=!0}=e,h={auto:"",light:"light",dark:"dark",...e.modes||{}},m=ca({window:s}),w=ie(()=>m.value?"dark":"light"),E=c||(i==null?Qo(r):Ur(i,r,o,{window:s,listenToStorageChanges:l})),T=ie(()=>E.value==="auto"?w.value:E.value),L=ei("updateHTMLAttrs",(p,F,K)=>{const N=typeof p=="string"?s==null?void 0:s.document.querySelector(p):Go(p);if(!N)return;let v;if(f){v=s.document.createElement("style");const M="*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}";v.appendChild(document.createTextNode(M)),s.document.head.appendChild(v)}if(F==="class"){const M=K.split(/\s/g);Object.values(h).flatMap(R=>(R||"").split(/\s/g)).filter(Boolean).forEach(R=>{M.includes(R)?N.classList.add(R):N.classList.remove(R)})}else N.setAttribute(F,K);f&&(s.getComputedStyle(v).opacity,document.head.removeChild(v))});function B(p){var F;L(t,n,(F=h[p])!=null?F:p)}function k(p){e.onChanged?e.onChanged(p,B):B(p)}Xe(T,k,{flush:"post",immediate:!0}),Gc(()=>k(T.value));const y=ie({get(){return a?E.value:T.value},set(p){E.value=p}});try{return Object.assign(y,{store:E,system:w,state:T})}catch{return y}}function ua(e={}){const{valueDark:t="dark",valueLight:n=""}=e,r=aa({...e,onChanged:(o,i)=>{var l;e.onChanged?(l=e.onChanged)==null||l.call(e,o==="dark",i,o):i(o)},modes:{dark:t,light:n}});return ie({get(){return r.value==="dark"},set(o){const i=o?"dark":"light";r.system.value===i?r.value="auto":r.value=i}})}function Zn(e){return typeof Window<"u"&&e instanceof Window?e.document.documentElement:typeof Document<"u"&&e instanceof Document?e.documentElement:e}function lu(e,t,n={}){const{window:r=Be}=n;return Ur(e,t,r==null?void 0:r.localStorage,n)}function ti(e){const t=window.getComputedStyle(e);if(t.overflowX==="scroll"||t.overflowY==="scroll"||t.overflowX==="auto"&&e.clientWidth<e.scrollWidth||t.overflowY==="auto"&&e.clientHeight<e.scrollHeight)return!0;{const n=e.parentNode;return!n||n.tagName==="BODY"?!1:ti(n)}}function fa(e){const t=e||window.event,n=t.target;return ti(n)?!1:t.touches.length>1?!0:(t.preventDefault&&t.preventDefault(),!1)}function cu(e,t=!1){const n=ae(t);let r=null,s;Xe(Qo(e),l=>{const c=Zn(Pe(l));if(c){const a=c;s=a.style.overflow,n.value&&(a.style.overflow="hidden")}},{immediate:!0});const o=()=>{const l=Zn(Pe(e));!l||n.value||(Ns&&(r=qt(l,"touchmove",c=>{fa(c)},{passive:!1})),l.style.overflow="hidden",n.value=!0)},i=()=>{const l=Zn(Pe(e));!l||!n.value||(Ns&&(r==null||r()),l.style.overflow=s,n.value=!1)};return kr(i),ie({get(){return n.value},set(l){l?o():i()}})}function au(e,t,n={}){const{window:r=Be}=n;return Ur(e,t,r==null?void 0:r.sessionStorage,n)}function uu(e={}){const{window:t=Be}=e;if(!t)return{x:ae(0),y:ae(0)};const n=ae(t.scrollX),r=ae(t.scrollY);return qt(t,"scroll",()=>{n.value=t.scrollX,r.value=t.scrollY},{capture:!1,passive:!0}),{x:n,y:r}}const ni=/^[a-z]+:/i,da="vitepress-theme-appearance",ri=/#.*$/,ha=/(index)?\.(md|html)$/,Ee=typeof document<"u",si={relativePath:"",filePath:"",title:"404",description:"Not Found",headers:[],frontmatter:{sidebar:!1,layout:"page"},lastUpdated:0,isNotFound:!0};function pa(e,t,n=!1){if(t===void 0)return!1;if(e=$s(`/${e}`),n)return new RegExp(t).test(e);if($s(t)!==e)return!1;const r=t.match(ri);return r?(Ee?location.hash:"")===r[0]:!0}function $s(e){return decodeURI(e).replace(ri,"").replace(ha,"")}function ga(e){return ni.test(e)}function ma(e,t){var r,s,o,i,l,c,a;const n=Object.keys(e.locales).find(f=>f!=="root"&&!ga(f)&&pa(t,`/${f}/`,!0))||"root";return Object.assign({},e,{localeIndex:n,lang:((r=e.locales[n])==null?void 0:r.lang)??e.lang,dir:((s=e.locales[n])==null?void 0:s.dir)??e.dir,title:((o=e.locales[n])==null?void 0:o.title)??e.title,titleTemplate:((i=e.locales[n])==null?void 0:i.titleTemplate)??e.titleTemplate,description:((l=e.locales[n])==null?void 0:l.description)??e.description,head:ii(e.head,((c=e.locales[n])==null?void 0:c.head)??[]),themeConfig:{...e.themeConfig,...(a=e.locales[n])==null?void 0:a.themeConfig}})}function oi(e,t){const n=t.title||e.title,r=t.titleTemplate??e.titleTemplate;if(typeof r=="string"&&r.includes(":title"))return r.replace(/:title/g,n);const s=ya(e.title,r);return`${n}${s}`}function ya(e,t){return t===!1?"":t===!0||t===void 0?` | ${e}`:e===t?"":` | ${t}`}function _a(e,t){const[n,r]=t;if(n!=="meta")return!1;const s=Object.entries(r)[0];return s==null?!1:e.some(([o,i])=>o===n&&i[s[0]]===s[1])}function ii(e,t){return[...e.filter(n=>!_a(t,n)),...t]}const ba=/[\u0000-\u001F"#$&*+,:;<=>?[\]^`{|}\u007F]/g,va=/^[a-z]:/i;function js(e){const t=va.exec(e),n=t?t[0]:"";return n+e.slice(n.length).replace(ba,"_").replace(/(^|\/)_+(?=[^/]*$)/,"$1")}const wa=Symbol(),at=Pr(Vc);function fu(e){const t=ie(()=>ma(at.value,e.data.relativePath)),n=t.value.appearance,r=n==="force-dark"?ae(!0):n?ua({storageKey:da,initialValue:()=>typeof n=="string"?n:"auto",...typeof n=="object"?n:{}}):ae(!1);return{site:t,theme:ie(()=>t.value.themeConfig),page:ie(()=>e.data),frontmatter:ie(()=>e.data.frontmatter),params:ie(()=>e.data.params),lang:ie(()=>t.value.lang),dir:ie(()=>t.value.dir),localeIndex:ie(()=>t.value.localeIndex||"root"),title:ie(()=>oi(t.value,e.data)),description:ie(()=>e.data.description||t.value.description),isDark:r}}function Ca(){const e=wt(wa);if(!e)throw new Error("vitepress data not properly injected in app");return e}function Ea(e,t){return`${e}${t}`.replace(/\/+/g,"/")}function Ds(e){return ni.test(e)||!e.startsWith("/")?e:Ea(at.value.base,e)}function xa(e){let t=e.replace(/\.html$/,"");if(t=decodeURIComponent(t),t=t.replace(/\/$/,"/index"),Ee){const n="/learning-docs2/";t=js(t.slice(n.length).replace(/\//g,"_")||"index")+".md";let r=__VP_HASH_MAP__[t.toLowerCase()];if(r||(t=t.endsWith("_index.md")?t.slice(0,-9)+".md":t.slice(0,-3)+"_index.md",r=__VP_HASH_MAP__[t.toLowerCase()]),!r)return null;t=`${n}assets/${t}.${r}.js`}else t=`./${js(t.slice(1).replace(/\//g,"_"))}.md.js`;return t}let gn=[];function du(e){gn.push(e),jn(()=>{gn=gn.filter(t=>t!==e)})}const Ta=Symbol(),li="http://a.com",Aa=()=>({path:"/",component:null,data:si});function hu(e,t){const n=Pn(Aa()),r={route:n,go:s};async function s(l=Ee?location.href:"/"){var c,a;l=gr(l),await((c=r.onBeforeRouteChange)==null?void 0:c.call(r,l))!==!1&&(Us(l),await i(l),await((a=r.onAfterRouteChanged)==null?void 0:a.call(r,l)))}let o=null;async function i(l,c=0,a=!1){var m;if(await((m=r.onBeforePageLoad)==null?void 0:m.call(r,l))===!1)return;const f=new URL(l,li),h=o=f.pathname;try{let w=await e(h);if(!w)throw new Error(`Page not found: ${h}`);if(o===h){o=null;const{default:E,__pageData:T}=w;if(!E)throw new Error(`Invalid route component: ${E}`);n.path=Ee?h:Ds(h),n.component=Lt(E),n.data=Lt(T),Ee&&Fn(()=>{let L=at.value.base+T.relativePath.replace(/(?:(^|\/)index)?\.md$/,"$1");if(!at.value.cleanUrls&&!L.endsWith("/")&&(L+=".html"),L!==f.pathname&&(f.pathname=L,l=L+f.search+f.hash,history.replaceState(null,"",l)),f.hash&&!c){let B=null;try{B=document.getElementById(decodeURIComponent(f.hash).slice(1))}catch(k){console.warn(k)}if(B){Bs(B,f.hash);return}}window.scrollTo(0,c)})}}catch(w){if(!/fetch|Page not found/.test(w.message)&&!/^\/404(\.html|\/)?$/.test(l)&&console.error(w),!a)try{const E=await fetch(at.value.base+"hashmap.json");window.__VP_HASH_MAP__=await E.json(),await i(l,c,!0);return}catch{}o===h&&(o=null,n.path=Ee?h:Ds(h),n.component=t?Lt(t):null,n.data=si)}}return Ee&&(window.addEventListener("click",l=>{if(l.target.closest("button"))return;const a=l.target.closest("a");if(a&&!a.closest(".vp-raw")&&(a instanceof SVGElement||!a.download)){const{target:f}=a,{href:h,origin:m,pathname:w,hash:E,search:T}=new URL(a.href instanceof SVGAnimatedString?a.href.animVal:a.href,a.baseURI),L=window.location,B=w.match(/\.\w+$/);!l.ctrlKey&&!l.shiftKey&&!l.altKey&&!l.metaKey&&!f&&m===L.origin&&!(B&&B[0]!==".html")&&(l.preventDefault(),w===L.pathname&&T===L.search?(E!==L.hash&&(history.pushState(null,"",E),window.dispatchEvent(new Event("hashchange"))),E?Bs(a,E,a.classList.contains("header-anchor")):(Us(h),window.scrollTo(0,0))):s(h))}},{capture:!0}),window.addEventListener("popstate",l=>{i(gr(location.href),l.state&&l.state.scrollPosition||0)}),window.addEventListener("hashchange",l=>{l.preventDefault()})),r}function Sa(){const e=wt(Ta);if(!e)throw new Error("useRouter() is called without provider.");return e}function ci(){return Sa().route}function Bs(e,t,n=!1){let r=null;try{r=e.classList.contains("header-anchor")?e:document.getElementById(decodeURIComponent(t).slice(1))}catch(s){console.warn(s)}if(r){let a=function(){!n||Math.abs(c-window.scrollY)>window.innerHeight?window.scrollTo(0,c):window.scrollTo({left:0,top:c,behavior:"smooth"})},s=at.value.scrollOffset,o=0,i=24;if(typeof s=="object"&&"padding"in s&&(i=s.padding,s=s.selector),typeof s=="number")o=s;else if(typeof s=="string")o=ks(s,i);else if(Array.isArray(s))for(const f of s){const h=ks(f,i);if(h){o=h;break}}const l=parseInt(window.getComputedStyle(r).paddingTop,10),c=window.scrollY+r.getBoundingClientRect().top-o+l;requestAnimationFrame(a)}}function ks(e,t){const n=document.querySelector(e);if(!n)return 0;const r=n.getBoundingClientRect().bottom;return r<0?0:r+t}function Us(e){Ee&&e!==gr(location.href)&&(history.replaceState({scrollPosition:window.scrollY},document.title),history.pushState(null,"",e))}function gr(e){const t=new URL(e,li);return t.pathname=t.pathname.replace(/(^|\/)index(\.html)?$/,"$1"),at.value.cleanUrls?t.pathname=t.pathname.replace(/\.html$/,""):!t.pathname.endsWith("/")&&!t.pathname.endsWith(".html")&&(t.pathname+=".html"),t.pathname+t.search+t.hash}const Ks=()=>gn.forEach(e=>e()),pu=Lr({name:"VitePressContent",props:{as:{type:[Object,String],default:"div"}},setup(e){const t=ci(),{site:n}=Ca();return()=>hr(e.as,n.value.contentProps??{style:{position:"relative"}},[t.component?hr(t.component,{onVnodeMounted:Ks,onVnodeUpdated:Ks}):"404 Page Not Found"])}}),gu=Lr({setup(e,{slots:t}){const n=ae(!1);return Rt(()=>{n.value=!0}),()=>n.value&&t.default?t.default():null}});function mu(){Ee&&window.addEventListener("click",e=>{var n;const t=e.target;if(t.matches(".vp-code-group input")){const r=(n=t.parentElement)==null?void 0:n.parentElement;if(!r)return;const s=Array.from(r.querySelectorAll("input")).indexOf(t);if(s<0)return;const o=r.querySelector(".blocks");if(!o)return;const i=Array.from(o.children).find(a=>a.classList.contains("active"));if(!i)return;const l=o.children[s];if(!l||i===l)return;i.classList.remove("active"),l.classList.add("active");const c=r==null?void 0:r.querySelector(`label[for="${t.id}"]`);c==null||c.scrollIntoView({block:"nearest"})}})}function yu(){if(Ee){const e=new WeakMap;window.addEventListener("click",t=>{var r;const n=t.target;if(n.matches('div[class*="language-"] > button.copy')){const s=n.parentElement,o=(r=n.nextElementSibling)==null?void 0:r.nextElementSibling;if(!s||!o)return;const i=/language-(shellscript|shell|bash|sh|zsh)/.test(s.className);let l="";o.querySelectorAll("span.line:not(.diff.remove)").forEach(c=>l+=(c.textContent||"")+`
+function mr(e,t){const n=Object.create(null),r=e.split(",");for(let s=0;s<r.length;s++)n[r[s]]=!0;return t?s=>!!n[s.toLowerCase()]:s=>!!n[s]}const te={},mt=[],Oe=()=>{},di=()=>!1,hi=/^on[^a-z]/,zt=e=>hi.test(e),yr=e=>e.startsWith("onUpdate:"),ue=Object.assign,_r=(e,t)=>{const n=e.indexOf(t);n>-1&&e.splice(n,1)},pi=Object.prototype.hasOwnProperty,X=(e,t)=>pi.call(e,t),U=Array.isArray,yt=e=>An(e)==="[object Map]",Vs=e=>An(e)==="[object Set]",W=e=>typeof e=="function",ne=e=>typeof e=="string",Tn=e=>typeof e=="symbol",ee=e=>e!==null&&typeof e=="object",qs=e=>(ee(e)||W(e))&&W(e.then)&&W(e.catch),zs=Object.prototype.toString,An=e=>zs.call(e),gi=e=>An(e).slice(8,-1),Ys=e=>An(e)==="[object Object]",br=e=>ne(e)&&e!=="NaN"&&e[0]!=="-"&&""+parseInt(e,10)===e,It=mr(",key,ref,ref_for,ref_key,onVnodeBeforeMount,onVnodeMounted,onVnodeBeforeUpdate,onVnodeUpdated,onVnodeBeforeUnmount,onVnodeUnmounted"),Sn=e=>{const t=Object.create(null);return n=>t[n]||(t[n]=e(n))},mi=/-(\w)/g,Ne=Sn(e=>e.replace(mi,(t,n)=>n?n.toUpperCase():"")),yi=/\B([A-Z])/g,ft=Sn(e=>e.replace(yi,"-$1").toLowerCase()),Rn=Sn(e=>e.charAt(0).toUpperCase()+e.slice(1)),dn=Sn(e=>e?`on${Rn(e)}`:""),ut=(e,t)=>!Object.is(e,t),hn=(e,t)=>{for(let n=0;n<e.length;n++)e[n](t)},mn=(e,t,n)=>{Object.defineProperty(e,t,{configurable:!0,enumerable:!1,value:n})},er=e=>{const t=parseFloat(e);return isNaN(t)?e:t},_i=e=>{const t=ne(e)?Number(e):NaN;return isNaN(t)?e:t};let Yr;const tr=()=>Yr||(Yr=typeof globalThis<"u"?globalThis:typeof self<"u"?self:typeof window<"u"?window:typeof global<"u"?global:{});function vr(e){if(U(e)){const t={};for(let n=0;n<e.length;n++){const r=e[n],s=ne(r)?Ci(r):vr(r);if(s)for(const o in s)t[o]=s[o]}return t}else if(ne(e)||ee(e))return e}const bi=/;(?![^(]*\))/g,vi=/:([^]+)/,wi=/\/\*[^]*?\*\//g;function Ci(e){const t={};return e.replace(wi,"").split(bi).forEach(n=>{if(n){const r=n.split(vi);r.length>1&&(t[r[0].trim()]=r[1].trim())}}),t}function wr(e){let t="";if(ne(e))t=e;else if(U(e))for(let n=0;n<e.length;n++){const r=wr(e[n]);r&&(t+=r+" ")}else if(ee(e))for(const n in e)e[n]&&(t+=n+" ");return t.trim()}const Ei="itemscope,allowfullscreen,formnovalidate,ismap,nomodule,novalidate,readonly",xi=mr(Ei);function Js(e){return!!e||e===""}const La=e=>ne(e)?e:e==null?"":U(e)||ee(e)&&(e.toString===zs||!W(e.toString))?JSON.stringify(e,Xs,2):String(e),Xs=(e,t)=>t&&t.__v_isRef?Xs(e,t.value):yt(t)?{[`Map(${t.size})`]:[...t.entries()].reduce((n,[r,s])=>(n[`${r} =>`]=s,n),{})}:Vs(t)?{[`Set(${t.size})`]:[...t.values()]}:ee(t)&&!U(t)&&!Ys(t)?String(t):t;let be;class Ti{constructor(t=!1){this.detached=t,this._active=!0,this.effects=[],this.cleanups=[],this.parent=be,!t&&be&&(this.index=(be.scopes||(be.scopes=[])).push(this)-1)}get active(){return this._active}run(t){if(this._active){const n=be;try{return be=this,t()}finally{be=n}}}on(){be=this}off(){be=this.parent}stop(t){if(this._active){let n,r;for(n=0,r=this.effects.length;n<r;n++)this.effects[n].stop();for(n=0,r=this.cleanups.length;n<r;n++)this.cleanups[n]();if(this.scopes)for(n=0,r=this.scopes.length;n<r;n++)this.scopes[n].stop(!0);if(!this.detached&&this.parent&&!t){const s=this.parent.scopes.pop();s&&s!==this&&(this.parent.scopes[this.index]=s,s.index=this.index)}this.parent=void 0,this._active=!1}}}function Ai(e,t=be){t&&t.active&&t.effects.push(e)}function Qs(){return be}function Si(e){be&&be.cleanups.push(e)}const Cr=e=>{const t=new Set(e);return t.w=0,t.n=0,t},Zs=e=>(e.w&Qe)>0,Gs=e=>(e.n&Qe)>0,Ri=({deps:e})=>{if(e.length)for(let t=0;t<e.length;t++)e[t].w|=Qe},Oi=e=>{const{deps:t}=e;if(t.length){let n=0;for(let r=0;r<t.length;r++){const s=t[r];Zs(s)&&!Gs(s)?s.delete(e):t[n++]=s,s.w&=~Qe,s.n&=~Qe}t.length=n}},yn=new WeakMap;let Mt=0,Qe=1;const nr=30;let Se;const lt=Symbol(""),rr=Symbol("");class Er{constructor(t,n=null,r){this.fn=t,this.scheduler=n,this.active=!0,this.deps=[],this.parent=void 0,Ai(this,r)}run(){if(!this.active)return this.fn();let t=Se,n=Ye;for(;t;){if(t===this)return;t=t.parent}try{return this.parent=Se,Se=this,Ye=!0,Qe=1<<++Mt,Mt<=nr?Ri(this):Jr(this),this.fn()}finally{Mt<=nr&&Oi(this),Qe=1<<--Mt,Se=this.parent,Ye=n,this.parent=void 0,this.deferStop&&this.stop()}}stop(){Se===this?this.deferStop=!0:this.active&&(Jr(this),this.onStop&&this.onStop(),this.active=!1)}}function Jr(e){const{deps:t}=e;if(t.length){for(let n=0;n<t.length;n++)t[n].delete(e);t.length=0}}let Ye=!0;const eo=[];function At(){eo.push(Ye),Ye=!1}function St(){const e=eo.pop();Ye=e===void 0?!0:e}function ye(e,t,n){if(Ye&&Se){let r=yn.get(e);r||yn.set(e,r=new Map);let s=r.get(n);s||r.set(n,s=Cr()),to(s)}}function to(e,t){let n=!1;Mt<=nr?Gs(e)||(e.n|=Qe,n=!Zs(e)):n=!e.has(Se),n&&(e.add(Se),Se.deps.push(e))}function De(e,t,n,r,s,o){const i=yn.get(e);if(!i)return;let l=[];if(t==="clear")l=[...i.values()];else if(n==="length"&&U(e)){const c=Number(r);i.forEach((a,f)=>{(f==="length"||!Tn(f)&&f>=c)&&l.push(a)})}else switch(n!==void 0&&l.push(i.get(n)),t){case"add":U(e)?br(n)&&l.push(i.get("length")):(l.push(i.get(lt)),yt(e)&&l.push(i.get(rr)));break;case"delete":U(e)||(l.push(i.get(lt)),yt(e)&&l.push(i.get(rr)));break;case"set":yt(e)&&l.push(i.get(lt));break}if(l.length===1)l[0]&&sr(l[0]);else{const c=[];for(const a of l)a&&c.push(...a);sr(Cr(c))}}function sr(e,t){const n=U(e)?e:[...e];for(const r of n)r.computed&&Xr(r);for(const r of n)r.computed||Xr(r)}function Xr(e,t){(e!==Se||e.allowRecurse)&&(e.scheduler?e.scheduler():e.run())}function Pi(e,t){var n;return(n=yn.get(e))==null?void 0:n.get(t)}const Mi=mr("__proto__,__v_isRef,__isVue"),no=new Set(Object.getOwnPropertyNames(Symbol).filter(e=>e!=="arguments"&&e!=="caller").map(e=>Symbol[e]).filter(Tn)),Qr=Fi();function Fi(){const e={};return["includes","indexOf","lastIndexOf"].forEach(t=>{e[t]=function(...n){const r=Q(this);for(let o=0,i=this.length;o<i;o++)ye(r,"get",o+"");const s=r[t](...n);return s===-1||s===!1?r[t](...n.map(Q)):s}}),["push","pop","shift","unshift","splice"].forEach(t=>{e[t]=function(...n){At();const r=Q(this)[t].apply(this,n);return St(),r}}),e}function Ii(e){const t=Q(this);return ye(t,"has",e),t.hasOwnProperty(e)}class ro{constructor(t=!1,n=!1){this._isReadonly=t,this._shallow=n}get(t,n,r){const s=this._isReadonly,o=this._shallow;if(n==="__v_isReactive")return!s;if(n==="__v_isReadonly")return s;if(n==="__v_isShallow")return o;if(n==="__v_raw"&&r===(s?o?qi:lo:o?io:oo).get(t))return t;const i=U(t);if(!s){if(i&&X(Qr,n))return Reflect.get(Qr,n,r);if(n==="hasOwnProperty")return Ii}const l=Reflect.get(t,n,r);return(Tn(n)?no.has(n):Mi(n))||(s||ye(t,"get",n),o)?l:ce(l)?i&&br(n)?l:l.value:ee(l)?s?Mn(l):Pn(l):l}}class so extends ro{constructor(t=!1){super(!1,t)}set(t,n,r,s){let o=t[n];if(Ct(o)&&ce(o)&&!ce(r))return!1;if(!this._shallow&&(!_n(r)&&!Ct(r)&&(o=Q(o),r=Q(r)),!U(t)&&ce(o)&&!ce(r)))return o.value=r,!0;const i=U(t)&&br(n)?Number(n)<t.length:X(t,n),l=Reflect.set(t,n,r,s);return t===Q(s)&&(i?ut(r,o)&&De(t,"set",n,r):De(t,"add",n,r)),l}deleteProperty(t,n){const r=X(t,n);t[n];const s=Reflect.deleteProperty(t,n);return s&&r&&De(t,"delete",n,void 0),s}has(t,n){const r=Reflect.has(t,n);return(!Tn(n)||!no.has(n))&&ye(t,"has",n),r}ownKeys(t){return ye(t,"iterate",U(t)?"length":lt),Reflect.ownKeys(t)}}class Li extends ro{constructor(t=!1){super(!0,t)}set(t,n){return!0}deleteProperty(t,n){return!0}}const Ni=new so,Hi=new Li,$i=new so(!0),xr=e=>e,On=e=>Reflect.getPrototypeOf(e);function Zt(e,t,n=!1,r=!1){e=e.__v_raw;const s=Q(e),o=Q(t);n||(ut(t,o)&&ye(s,"get",t),ye(s,"get",o));const{has:i}=On(s),l=r?xr:n?Sr:Bt;if(i.call(s,t))return l(e.get(t));if(i.call(s,o))return l(e.get(o));e!==s&&e.get(t)}function Gt(e,t=!1){const n=this.__v_raw,r=Q(n),s=Q(e);return t||(ut(e,s)&&ye(r,"has",e),ye(r,"has",s)),e===s?n.has(e):n.has(e)||n.has(s)}function en(e,t=!1){return e=e.__v_raw,!t&&ye(Q(e),"iterate",lt),Reflect.get(e,"size",e)}function Zr(e){e=Q(e);const t=Q(this);return On(t).has.call(t,e)||(t.add(e),De(t,"add",e,e)),this}function Gr(e,t){t=Q(t);const n=Q(this),{has:r,get:s}=On(n);let o=r.call(n,e);o||(e=Q(e),o=r.call(n,e));const i=s.call(n,e);return n.set(e,t),o?ut(t,i)&&De(n,"set",e,t):De(n,"add",e,t),this}function es(e){const t=Q(this),{has:n,get:r}=On(t);let s=n.call(t,e);s||(e=Q(e),s=n.call(t,e)),r&&r.call(t,e);const o=t.delete(e);return s&&De(t,"delete",e,void 0),o}function ts(){const e=Q(this),t=e.size!==0,n=e.clear();return t&&De(e,"clear",void 0,void 0),n}function tn(e,t){return function(r,s){const o=this,i=o.__v_raw,l=Q(i),c=t?xr:e?Sr:Bt;return!e&&ye(l,"iterate",lt),i.forEach((a,f)=>r.call(s,c(a),c(f),o))}}function nn(e,t,n){return function(...r){const s=this.__v_raw,o=Q(s),i=yt(o),l=e==="entries"||e===Symbol.iterator&&i,c=e==="keys"&&i,a=s[e](...r),f=n?xr:t?Sr:Bt;return!t&&ye(o,"iterate",c?rr:lt),{next(){const{value:h,done:m}=a.next();return m?{value:h,done:m}:{value:l?[f(h[0]),f(h[1])]:f(h),done:m}},[Symbol.iterator](){return this}}}}function Ue(e){return function(...t){return e==="delete"?!1:this}}function ji(){const e={get(o){return Zt(this,o)},get size(){return en(this)},has:Gt,add:Zr,set:Gr,delete:es,clear:ts,forEach:tn(!1,!1)},t={get(o){return Zt(this,o,!1,!0)},get size(){return en(this)},has:Gt,add:Zr,set:Gr,delete:es,clear:ts,forEach:tn(!1,!0)},n={get(o){return Zt(this,o,!0)},get size(){return en(this,!0)},has(o){return Gt.call(this,o,!0)},add:Ue("add"),set:Ue("set"),delete:Ue("delete"),clear:Ue("clear"),forEach:tn(!0,!1)},r={get(o){return Zt(this,o,!0,!0)},get size(){return en(this,!0)},has(o){return Gt.call(this,o,!0)},add:Ue("add"),set:Ue("set"),delete:Ue("delete"),clear:Ue("clear"),forEach:tn(!0,!0)};return["keys","values","entries",Symbol.iterator].forEach(o=>{e[o]=nn(o,!1,!1),n[o]=nn(o,!0,!1),t[o]=nn(o,!1,!0),r[o]=nn(o,!0,!0)}),[e,n,t,r]}const[Di,Bi,ki,Ui]=ji();function Tr(e,t){const n=t?e?Ui:ki:e?Bi:Di;return(r,s,o)=>s==="__v_isReactive"?!e:s==="__v_isReadonly"?e:s==="__v_raw"?r:Reflect.get(X(n,s)&&s in r?n:r,s,o)}const Ki={get:Tr(!1,!1)},Wi={get:Tr(!1,!0)},Vi={get:Tr(!0,!1)},oo=new WeakMap,io=new WeakMap,lo=new WeakMap,qi=new WeakMap;function zi(e){switch(e){case"Object":case"Array":return 1;case"Map":case"Set":case"WeakMap":case"WeakSet":return 2;default:return 0}}function Yi(e){return e.__v_skip||!Object.isExtensible(e)?0:zi(gi(e))}function Pn(e){return Ct(e)?e:Ar(e,!1,Ni,Ki,oo)}function Ji(e){return Ar(e,!1,$i,Wi,io)}function Mn(e){return Ar(e,!0,Hi,Vi,lo)}function Ar(e,t,n,r,s){if(!ee(e)||e.__v_raw&&!(t&&e.__v_isReactive))return e;const o=s.get(e);if(o)return o;const i=Yi(e);if(i===0)return e;const l=new Proxy(e,i===2?r:n);return s.set(e,l),l}function _t(e){return Ct(e)?_t(e.__v_raw):!!(e&&e.__v_isReactive)}function Ct(e){return!!(e&&e.__v_isReadonly)}function _n(e){return!!(e&&e.__v_isShallow)}function co(e){return _t(e)||Ct(e)}function Q(e){const t=e&&e.__v_raw;return t?Q(t):e}function Lt(e){return mn(e,"__v_skip",!0),e}const Bt=e=>ee(e)?Pn(e):e,Sr=e=>ee(e)?Mn(e):e;function Rr(e){Ye&&Se&&(e=Q(e),to(e.dep||(e.dep=Cr())))}function Or(e,t){e=Q(e);const n=e.dep;n&&sr(n)}function ce(e){return!!(e&&e.__v_isRef===!0)}function ae(e){return ao(e,!1)}function Pr(e){return ao(e,!0)}function ao(e,t){return ce(e)?e:new Xi(e,t)}class Xi{constructor(t,n){this.__v_isShallow=n,this.dep=void 0,this.__v_isRef=!0,this._rawValue=n?t:Q(t),this._value=n?t:Bt(t)}get value(){return Rr(this),this._value}set value(t){const n=this.__v_isShallow||_n(t)||Ct(t);t=n?t:Q(t),ut(t,this._rawValue)&&(this._rawValue=t,this._value=n?t:Bt(t),Or(this))}}function Mr(e){return ce(e)?e.value:e}const Qi={get:(e,t,n)=>Mr(Reflect.get(e,t,n)),set:(e,t,n,r)=>{const s=e[t];return ce(s)&&!ce(n)?(s.value=n,!0):Reflect.set(e,t,n,r)}};function uo(e){return _t(e)?e:new Proxy(e,Qi)}class Zi{constructor(t){this.dep=void 0,this.__v_isRef=!0;const{get:n,set:r}=t(()=>Rr(this),()=>Or(this));this._get=n,this._set=r}get value(){return this._get()}set value(t){this._set(t)}}function Gi(e){return new Zi(e)}class el{constructor(t,n,r){this._object=t,this._key=n,this._defaultValue=r,this.__v_isRef=!0}get value(){const t=this._object[this._key];return t===void 0?this._defaultValue:t}set value(t){this._object[this._key]=t}get dep(){return Pi(Q(this._object),this._key)}}class tl{constructor(t){this._getter=t,this.__v_isRef=!0,this.__v_isReadonly=!0}get value(){return this._getter()}}function nl(e,t,n){return ce(e)?e:W(e)?new tl(e):ee(e)&&arguments.length>1?rl(e,t,n):ae(e)}function rl(e,t,n){const r=e[t];return ce(r)?r:new el(e,t,n)}class sl{constructor(t,n,r,s){this._setter=n,this.dep=void 0,this.__v_isRef=!0,this.__v_isReadonly=!1,this._dirty=!0,this.effect=new Er(t,()=>{this._dirty||(this._dirty=!0,Or(this))}),this.effect.computed=this,this.effect.active=this._cacheable=!s,this.__v_isReadonly=r}get value(){const t=Q(this);return Rr(t),(t._dirty||!t._cacheable)&&(t._dirty=!1,t._value=t.effect.run()),t._value}set value(t){this._setter(t)}}function ol(e,t,n=!1){let r,s;const o=W(e);return o?(r=e,s=Oe):(r=e.get,s=e.set),new sl(r,s,o||!s,n)}function Je(e,t,n,r){let s;try{s=r?e(...r):e()}catch(o){Yt(o,t,n)}return s}function xe(e,t,n,r){if(W(e)){const o=Je(e,t,n,r);return o&&qs(o)&&o.catch(i=>{Yt(i,t,n)}),o}const s=[];for(let o=0;o<e.length;o++)s.push(xe(e[o],t,n,r));return s}function Yt(e,t,n,r=!0){const s=t?t.vnode:null;if(t){let o=t.parent;const i=t.proxy,l=n;for(;o;){const a=o.ec;if(a){for(let f=0;f<a.length;f++)if(a[f](e,i,l)===!1)return}o=o.parent}const c=t.appContext.config.errorHandler;if(c){Je(c,null,10,[e,i,l]);return}}il(e,n,s,r)}function il(e,t,n,r=!0){console.error(e)}let kt=!1,or=!1;const he=[];let Le=0;const bt=[];let je=null,rt=0;const fo=Promise.resolve();let Fr=null;function Fn(e){const t=Fr||fo;return e?t.then(this?e.bind(this):e):t}function ll(e){let t=Le+1,n=he.length;for(;t<n;){const r=t+n>>>1,s=he[r],o=Ut(s);o<e||o===e&&s.pre?t=r+1:n=r}return t}function In(e){(!he.length||!he.includes(e,kt&&e.allowRecurse?Le+1:Le))&&(e.id==null?he.push(e):he.splice(ll(e.id),0,e),ho())}function ho(){!kt&&!or&&(or=!0,Fr=fo.then(po))}function cl(e){const t=he.indexOf(e);t>Le&&he.splice(t,1)}function al(e){U(e)?bt.push(...e):(!je||!je.includes(e,e.allowRecurse?rt+1:rt))&&bt.push(e),ho()}function ns(e,t=kt?Le+1:0){for(;t<he.length;t++){const n=he[t];n&&n.pre&&(he.splice(t,1),t--,n())}}function bn(e){if(bt.length){const t=[...new Set(bt)];if(bt.length=0,je){je.push(...t);return}for(je=t,je.sort((n,r)=>Ut(n)-Ut(r)),rt=0;rt<je.length;rt++)je[rt]();je=null,rt=0}}const Ut=e=>e.id==null?1/0:e.id,ul=(e,t)=>{const n=Ut(e)-Ut(t);if(n===0){if(e.pre&&!t.pre)return-1;if(t.pre&&!e.pre)return 1}return n};function po(e){or=!1,kt=!0,he.sort(ul);const t=Oe;try{for(Le=0;Le<he.length;Le++){const n=he[Le];n&&n.active!==!1&&Je(n,null,14)}}finally{Le=0,he.length=0,bn(),kt=!1,Fr=null,(he.length||bt.length)&&po()}}function fl(e,t,...n){if(e.isUnmounted)return;const r=e.vnode.props||te;let s=n;const o=t.startsWith("update:"),i=o&&t.slice(7);if(i&&i in r){const f=`${i==="modelValue"?"model":i}Modifiers`,{number:h,trim:m}=r[f]||te;m&&(s=n.map(w=>ne(w)?w.trim():w)),h&&(s=n.map(er))}let l,c=r[l=dn(t)]||r[l=dn(Ne(t))];!c&&o&&(c=r[l=dn(ft(t))]),c&&xe(c,e,6,s);const a=r[l+"Once"];if(a){if(!e.emitted)e.emitted={};else if(e.emitted[l])return;e.emitted[l]=!0,xe(a,e,6,s)}}function go(e,t,n=!1){const r=t.emitsCache,s=r.get(e);if(s!==void 0)return s;const o=e.emits;let i={},l=!1;if(!W(e)){const c=a=>{const f=go(a,t,!0);f&&(l=!0,ue(i,f))};!n&&t.mixins.length&&t.mixins.forEach(c),e.extends&&c(e.extends),e.mixins&&e.mixins.forEach(c)}return!o&&!l?(ee(e)&&r.set(e,null),null):(U(o)?o.forEach(c=>i[c]=null):ue(i,o),ee(e)&&r.set(e,i),i)}function Ln(e,t){return!e||!zt(t)?!1:(t=t.slice(2).replace(/Once$/,""),X(e,t[0].toLowerCase()+t.slice(1))||X(e,ft(t))||X(e,t))}let de=null,Nn=null;function vn(e){const t=de;return de=e,Nn=e&&e.type.__scopeId||null,t}function Na(e){Nn=e}function Ha(){Nn=null}function dl(e,t=de,n){if(!t||e._n)return e;const r=(...s)=>{r._d&&gs(-1);const o=vn(t);let i;try{i=e(...s)}finally{vn(o),r._d&&gs(1)}return i};return r._n=!0,r._c=!0,r._d=!0,r}function Wn(e){const{type:t,vnode:n,proxy:r,withProxy:s,props:o,propsOptions:[i],slots:l,attrs:c,emit:a,render:f,renderCache:h,data:m,setupState:w,ctx:E,inheritAttrs:T}=e;let L,B;const k=vn(e);try{if(n.shapeFlag&4){const p=s||r;L=Ae(f.call(p,p,h,o,w,m,E)),B=c}else{const p=t;L=Ae(p.length>1?p(o,{attrs:c,slots:l,emit:a}):p(o,null)),B=t.props?c:hl(c)}}catch(p){jt.length=0,Yt(p,e,1),L=re(ve)}let y=L;if(B&&T!==!1){const p=Object.keys(B),{shapeFlag:F}=y;p.length&&F&7&&(i&&p.some(yr)&&(B=pl(B,i)),y=Ze(y,B))}return n.dirs&&(y=Ze(y),y.dirs=y.dirs?y.dirs.concat(n.dirs):n.dirs),n.transition&&(y.transition=n.transition),L=y,vn(k),L}const hl=e=>{let t;for(const n in e)(n==="class"||n==="style"||zt(n))&&((t||(t={}))[n]=e[n]);return t},pl=(e,t)=>{const n={};for(const r in e)(!yr(r)||!(r.slice(9)in t))&&(n[r]=e[r]);return n};function gl(e,t,n){const{props:r,children:s,component:o}=e,{props:i,children:l,patchFlag:c}=t,a=o.emitsOptions;if(t.dirs||t.transition)return!0;if(n&&c>=0){if(c&1024)return!0;if(c&16)return r?rs(r,i,a):!!i;if(c&8){const f=t.dynamicProps;for(let h=0;h<f.length;h++){const m=f[h];if(i[m]!==r[m]&&!Ln(a,m))return!0}}}else return(s||l)&&(!l||!l.$stable)?!0:r===i?!1:r?i?rs(r,i,a):!0:!!i;return!1}function rs(e,t,n){const r=Object.keys(t);if(r.length!==Object.keys(e).length)return!0;for(let s=0;s<r.length;s++){const o=r[s];if(t[o]!==e[o]&&!Ln(n,o))return!0}return!1}function ml({vnode:e,parent:t},n){for(;t&&t.subTree===e;)(e=t.vnode).el=n,t=t.parent}const yl=e=>e.__isSuspense;function mo(e,t){t&&t.pendingBranch?U(e)?t.effects.push(...e):t.effects.push(e):al(e)}function Ir(e,t){return Hn(e,null,t)}function $a(e,t){return Hn(e,null,{flush:"post"})}const rn={};function Xe(e,t,n){return Hn(e,t,n)}function Hn(e,t,{immediate:n,deep:r,flush:s,onTrack:o,onTrigger:i}=te){var l;const c=Qs()===((l=le)==null?void 0:l.scope)?le:null;let a,f=!1,h=!1;if(ce(e)?(a=()=>e.value,f=_n(e)):_t(e)?(a=()=>e,r=!0):U(e)?(h=!0,f=e.some(p=>_t(p)||_n(p)),a=()=>e.map(p=>{if(ce(p))return p.value;if(_t(p))return it(p);if(W(p))return Je(p,c,2)})):W(e)?t?a=()=>Je(e,c,2):a=()=>{if(!(c&&c.isUnmounted))return m&&m(),xe(e,c,3,[w])}:a=Oe,t&&r){const p=a;a=()=>it(p())}let m,w=p=>{m=k.onStop=()=>{Je(p,c,4)}},E;if(Tt)if(w=Oe,t?n&&xe(t,c,3,[a(),h?[]:void 0,w]):a(),s==="sync"){const p=hc();E=p.__watcherHandles||(p.__watcherHandles=[])}else return Oe;let T=h?new Array(e.length).fill(rn):rn;const L=()=>{if(k.active)if(t){const p=k.run();(r||f||(h?p.some((F,K)=>ut(F,T[K])):ut(p,T)))&&(m&&m(),xe(t,c,3,[p,T===rn?void 0:h&&T[0]===rn?[]:T,w]),T=p)}else k.run()};L.allowRecurse=!!t;let B;s==="sync"?B=L:s==="post"?B=()=>ge(L,c&&c.suspense):(L.pre=!0,c&&(L.id=c.uid),B=()=>In(L));const k=new Er(a,B);t?n?L():T=k.run():s==="post"?ge(k.run.bind(k),c&&c.suspense):k.run();const y=()=>{k.stop(),c&&c.scope&&_r(c.scope.effects,k)};return E&&E.push(y),y}function _l(e,t,n){const r=this.proxy,s=ne(e)?e.includes(".")?yo(r,e):()=>r[e]:e.bind(r,r);let o;W(t)?o=t:(o=t.handler,n=t);const i=le;xt(this);const l=Hn(s,o.bind(r),n);return i?xt(i):ct(),l}function yo(e,t){const n=t.split(".");return()=>{let r=e;for(let s=0;s<n.length&&r;s++)r=r[n[s]];return r}}function it(e,t){if(!ee(e)||e.__v_skip||(t=t||new Set,t.has(e)))return e;if(t.add(e),ce(e))it(e.value,t);else if(U(e))for(let n=0;n<e.length;n++)it(e[n],t);else if(Vs(e)||yt(e))e.forEach(n=>{it(n,t)});else if(Ys(e))for(const n in e)it(e[n],t);return e}function ja(e,t){const n=de;if(n===null)return e;const r=kn(n)||n.proxy,s=e.dirs||(e.dirs=[]);for(let o=0;o<t.length;o++){let[i,l,c,a=te]=t[o];i&&(W(i)&&(i={mounted:i,updated:i}),i.deep&&it(l),s.push({dir:i,instance:r,value:l,oldValue:void 0,arg:c,modifiers:a}))}return e}function Ie(e,t,n,r){const s=e.dirs,o=t&&t.dirs;for(let i=0;i<s.length;i++){const l=s[i];o&&(l.oldValue=o[i].value);let c=l.dir[r];c&&(At(),xe(c,n,8,[e.el,l,e,t]),St())}}const qe=Symbol("_leaveCb"),sn=Symbol("_enterCb");function bl(){const e={isMounted:!1,isLeaving:!1,isUnmounting:!1,leavingVNodes:new Map};return Rt(()=>{e.isMounted=!0}),Co(()=>{e.isUnmounting=!0}),e}const we=[Function,Array],_o={mode:String,appear:Boolean,persisted:Boolean,onBeforeEnter:we,onEnter:we,onAfterEnter:we,onEnterCancelled:we,onBeforeLeave:we,onLeave:we,onAfterLeave:we,onLeaveCancelled:we,onBeforeAppear:we,onAppear:we,onAfterAppear:we,onAppearCancelled:we},vl={name:"BaseTransition",props:_o,setup(e,{slots:t}){const n=Bn(),r=bl();let s;return()=>{const o=t.default&&vo(t.default(),!0);if(!o||!o.length)return;let i=o[0];if(o.length>1){for(const T of o)if(T.type!==ve){i=T;break}}const l=Q(e),{mode:c}=l;if(r.isLeaving)return Vn(i);const a=ss(i);if(!a)return Vn(i);const f=ir(a,l,r,n);lr(a,f);const h=n.subTree,m=h&&ss(h);let w=!1;const{getTransitionKey:E}=a.type;if(E){const T=E();s===void 0?s=T:T!==s&&(s=T,w=!0)}if(m&&m.type!==ve&&(!st(a,m)||w)){const T=ir(m,l,r,n);if(lr(m,T),c==="out-in")return r.isLeaving=!0,T.afterLeave=()=>{r.isLeaving=!1,n.update.active!==!1&&n.update()},Vn(i);c==="in-out"&&a.type!==ve&&(T.delayLeave=(L,B,k)=>{const y=bo(r,m);y[String(m.key)]=m,L[qe]=()=>{B(),L[qe]=void 0,delete f.delayedLeave},f.delayedLeave=k})}return i}}},wl=vl;function bo(e,t){const{leavingVNodes:n}=e;let r=n.get(t.type);return r||(r=Object.create(null),n.set(t.type,r)),r}function ir(e,t,n,r){const{appear:s,mode:o,persisted:i=!1,onBeforeEnter:l,onEnter:c,onAfterEnter:a,onEnterCancelled:f,onBeforeLeave:h,onLeave:m,onAfterLeave:w,onLeaveCancelled:E,onBeforeAppear:T,onAppear:L,onAfterAppear:B,onAppearCancelled:k}=t,y=String(e.key),p=bo(n,e),F=(v,M)=>{v&&xe(v,r,9,M)},K=(v,M)=>{const R=M[1];F(v,M),U(v)?v.every(z=>z.length<=1)&&R():v.length<=1&&R()},N={mode:o,persisted:i,beforeEnter(v){let M=l;if(!n.isMounted)if(s)M=T||l;else return;v[qe]&&v[qe](!0);const R=p[y];R&&st(e,R)&&R.el[qe]&&R.el[qe](),F(M,[v])},enter(v){let M=c,R=a,z=f;if(!n.isMounted)if(s)M=L||c,R=B||a,z=k||f;else return;let O=!1;const q=v[sn]=oe=>{O||(O=!0,oe?F(z,[v]):F(R,[v]),N.delayedLeave&&N.delayedLeave(),v[sn]=void 0)};M?K(M,[v,q]):q()},leave(v,M){const R=String(e.key);if(v[sn]&&v[sn](!0),n.isUnmounting)return M();F(h,[v]);let z=!1;const O=v[qe]=q=>{z||(z=!0,M(),q?F(E,[v]):F(w,[v]),v[qe]=void 0,p[R]===e&&delete p[R])};p[R]=e,m?K(m,[v,O]):O()},clone(v){return ir(v,t,n,r)}};return N}function Vn(e){if(Jt(e))return e=Ze(e),e.children=null,e}function ss(e){return Jt(e)?e.children?e.children[0]:void 0:e}function lr(e,t){e.shapeFlag&6&&e.component?lr(e.component.subTree,t):e.shapeFlag&128?(e.ssContent.transition=t.clone(e.ssContent),e.ssFallback.transition=t.clone(e.ssFallback)):e.transition=t}function vo(e,t=!1,n){let r=[],s=0;for(let o=0;o<e.length;o++){let i=e[o];const l=n==null?i.key:String(n)+String(i.key!=null?i.key:o);i.type===me?(i.patchFlag&128&&s++,r=r.concat(vo(i.children,t,l))):(t||i.type!==ve)&&r.push(l!=null?Ze(i,{key:l}):i)}if(s>1)for(let o=0;o<r.length;o++)r[o].patchFlag=-2;return r}/*! #__NO_SIDE_EFFECTS__ */function Lr(e,t){return W(e)?(()=>ue({name:e.name},t,{setup:e}))():e}const vt=e=>!!e.type.__asyncLoader;/*! #__NO_SIDE_EFFECTS__ */function Da(e){W(e)&&(e={loader:e});const{loader:t,loadingComponent:n,errorComponent:r,delay:s=200,timeout:o,suspensible:i=!0,onError:l}=e;let c=null,a,f=0;const h=()=>(f++,c=null,m()),m=()=>{let w;return c||(w=c=t().catch(E=>{if(E=E instanceof Error?E:new Error(String(E)),l)return new Promise((T,L)=>{l(E,()=>T(h()),()=>L(E),f+1)});throw E}).then(E=>w!==c&&c?c:(E&&(E.__esModule||E[Symbol.toStringTag]==="Module")&&(E=E.default),a=E,E)))};return Lr({name:"AsyncComponentWrapper",__asyncLoader:m,get __asyncResolved(){return a},setup(){const w=le;if(a)return()=>qn(a,w);const E=k=>{c=null,Yt(k,w,13,!r)};if(i&&w.suspense||Tt)return m().then(k=>()=>qn(k,w)).catch(k=>(E(k),()=>r?re(r,{error:k}):null));const T=ae(!1),L=ae(),B=ae(!!s);return s&&setTimeout(()=>{B.value=!1},s),o!=null&&setTimeout(()=>{if(!T.value&&!L.value){const k=new Error(`Async component timed out after ${o}ms.`);E(k),L.value=k}},o),m().then(()=>{T.value=!0,w.parent&&Jt(w.parent.vnode)&&In(w.parent.update)}).catch(k=>{E(k),L.value=k}),()=>{if(T.value&&a)return qn(a,w);if(L.value&&r)return re(r,{error:L.value});if(n&&!B.value)return re(n)}}})}function qn(e,t){const{ref:n,props:r,children:s,ce:o}=t.vnode,i=re(e,r,s);return i.ref=n,i.ce=o,delete t.vnode.ce,i}const Jt=e=>e.type.__isKeepAlive;function Cl(e,t){wo(e,"a",t)}function El(e,t){wo(e,"da",t)}function wo(e,t,n=le){const r=e.__wdc||(e.__wdc=()=>{let s=n;for(;s;){if(s.isDeactivated)return;s=s.parent}return e()});if($n(t,r,n),n){let s=n.parent;for(;s&&s.parent;)Jt(s.parent.vnode)&&xl(r,t,n,s),s=s.parent}}function xl(e,t,n,r){const s=$n(t,e,r,!0);jn(()=>{_r(r[t],s)},n)}function $n(e,t,n=le,r=!1){if(n){const s=n[e]||(n[e]=[]),o=t.__weh||(t.__weh=(...i)=>{if(n.isUnmounted)return;At(),xt(n);const l=xe(t,n,e,i);return ct(),St(),l});return r?s.unshift(o):s.push(o),o}}const ke=e=>(t,n=le)=>(!Tt||e==="sp")&&$n(e,(...r)=>t(...r),n),Tl=ke("bm"),Rt=ke("m"),Al=ke("bu"),Sl=ke("u"),Co=ke("bum"),jn=ke("um"),Rl=ke("sp"),Ol=ke("rtg"),Pl=ke("rtc");function Ml(e,t=le){$n("ec",e,t)}const Nr="components";function Ba(e,t){return xo(Nr,e,!0,t)||e}const Eo=Symbol.for("v-ndc");function ka(e){return ne(e)?xo(Nr,e,!1)||e:e||Eo}function xo(e,t,n=!0,r=!1){const s=de||le;if(s){const o=s.type;if(e===Nr){const l=uc(o,!1);if(l&&(l===t||l===Ne(t)||l===Rn(Ne(t))))return o}const i=os(s[e]||o[e],t)||os(s.appContext[e],t);return!i&&r?o:i}}function os(e,t){return e&&(e[t]||e[Ne(t)]||e[Rn(Ne(t))])}function Ua(e,t,n,r){let s;const o=n&&n[r];if(U(e)||ne(e)){s=new Array(e.length);for(let i=0,l=e.length;i<l;i++)s[i]=t(e[i],i,void 0,o&&o[i])}else if(typeof e=="number"){s=new Array(e);for(let i=0;i<e;i++)s[i]=t(i+1,i,void 0,o&&o[i])}else if(ee(e))if(e[Symbol.iterator])s=Array.from(e,(i,l)=>t(i,l,void 0,o&&o[l]));else{const i=Object.keys(e);s=new Array(i.length);for(let l=0,c=i.length;l<c;l++){const a=i[l];s[l]=t(e[a],a,l,o&&o[l])}}else s=[];return n&&(n[r]=s),s}function Ka(e,t,n={},r,s){if(de.isCE||de.parent&&vt(de.parent)&&de.parent.isCE)return t!=="default"&&(n.name=t),re("slot",n,r&&r());let o=e[t];o&&o._c&&(o._d=!1),Ho();const i=o&&To(o(n)),l=jo(me,{key:n.key||i&&i.key||`_${t}`},i||(r?r():[]),i&&e._===1?64:-2);return!s&&l.scopeId&&(l.slotScopeIds=[l.scopeId+"-s"]),o&&o._c&&(o._d=!0),l}function To(e){return e.some(t=>xn(t)?!(t.type===ve||t.type===me&&!To(t.children)):!0)?e:null}function Wa(e,t){const n={};for(const r in e)n[t&&/[A-Z]/.test(r)?`on:${r}`:dn(r)]=e[r];return n}const cr=e=>e?Uo(e)?kn(e)||e.proxy:cr(e.parent):null,Nt=ue(Object.create(null),{$:e=>e,$el:e=>e.vnode.el,$data:e=>e.data,$props:e=>e.props,$attrs:e=>e.attrs,$slots:e=>e.slots,$refs:e=>e.refs,$parent:e=>cr(e.parent),$root:e=>cr(e.root),$emit:e=>e.emit,$options:e=>Hr(e),$forceUpdate:e=>e.f||(e.f=()=>In(e.update)),$nextTick:e=>e.n||(e.n=Fn.bind(e.proxy)),$watch:e=>_l.bind(e)}),zn=(e,t)=>e!==te&&!e.__isScriptSetup&&X(e,t),Fl={get({_:e},t){const{ctx:n,setupState:r,data:s,props:o,accessCache:i,type:l,appContext:c}=e;let a;if(t[0]!=="$"){const w=i[t];if(w!==void 0)switch(w){case 1:return r[t];case 2:return s[t];case 4:return n[t];case 3:return o[t]}else{if(zn(r,t))return i[t]=1,r[t];if(s!==te&&X(s,t))return i[t]=2,s[t];if((a=e.propsOptions[0])&&X(a,t))return i[t]=3,o[t];if(n!==te&&X(n,t))return i[t]=4,n[t];ar&&(i[t]=0)}}const f=Nt[t];let h,m;if(f)return t==="$attrs"&&ye(e,"get",t),f(e);if((h=l.__cssModules)&&(h=h[t]))return h;if(n!==te&&X(n,t))return i[t]=4,n[t];if(m=c.config.globalProperties,X(m,t))return m[t]},set({_:e},t,n){const{data:r,setupState:s,ctx:o}=e;return zn(s,t)?(s[t]=n,!0):r!==te&&X(r,t)?(r[t]=n,!0):X(e.props,t)||t[0]==="$"&&t.slice(1)in e?!1:(o[t]=n,!0)},has({_:{data:e,setupState:t,accessCache:n,ctx:r,appContext:s,propsOptions:o}},i){let l;return!!n[i]||e!==te&&X(e,i)||zn(t,i)||(l=o[0])&&X(l,i)||X(r,i)||X(Nt,i)||X(s.config.globalProperties,i)},defineProperty(e,t,n){return n.get!=null?e._.accessCache[t]=0:X(n,"value")&&this.set(e,t,n.value,null),Reflect.defineProperty(e,t,n)}};function Va(){return Il().slots}function Il(){const e=Bn();return e.setupContext||(e.setupContext=Wo(e))}function is(e){return U(e)?e.reduce((t,n)=>(t[n]=null,t),{}):e}let ar=!0;function Ll(e){const t=Hr(e),n=e.proxy,r=e.ctx;ar=!1,t.beforeCreate&&ls(t.beforeCreate,e,"bc");const{data:s,computed:o,methods:i,watch:l,provide:c,inject:a,created:f,beforeMount:h,mounted:m,beforeUpdate:w,updated:E,activated:T,deactivated:L,beforeDestroy:B,beforeUnmount:k,destroyed:y,unmounted:p,render:F,renderTracked:K,renderTriggered:N,errorCaptured:v,serverPrefetch:M,expose:R,inheritAttrs:z,components:O,directives:q,filters:oe}=t;if(a&&Nl(a,r,null),i)for(const Y in i){const D=i[Y];W(D)&&(r[Y]=D.bind(n))}if(s){const Y=s.call(n,n);ee(Y)&&(e.data=Pn(Y))}if(ar=!0,o)for(const Y in o){const D=o[Y],He=W(D)?D.bind(n,n):W(D.get)?D.get.bind(n,n):Oe,Xt=!W(D)&&W(D.set)?D.set.bind(n):Oe,Ge=ie({get:He,set:Xt});Object.defineProperty(r,Y,{enumerable:!0,configurable:!0,get:()=>Ge.value,set:Me=>Ge.value=Me})}if(l)for(const Y in l)Ao(l[Y],r,n,Y);if(c){const Y=W(c)?c.call(n):c;Reflect.ownKeys(Y).forEach(D=>{kl(D,Y[D])})}f&&ls(f,e,"c");function H(Y,D){U(D)?D.forEach(He=>Y(He.bind(n))):D&&Y(D.bind(n))}if(H(Tl,h),H(Rt,m),H(Al,w),H(Sl,E),H(Cl,T),H(El,L),H(Ml,v),H(Pl,K),H(Ol,N),H(Co,k),H(jn,p),H(Rl,M),U(R))if(R.length){const Y=e.exposed||(e.exposed={});R.forEach(D=>{Object.defineProperty(Y,D,{get:()=>n[D],set:He=>n[D]=He})})}else e.exposed||(e.exposed={});F&&e.render===Oe&&(e.render=F),z!=null&&(e.inheritAttrs=z),O&&(e.components=O),q&&(e.directives=q)}function Nl(e,t,n=Oe){U(e)&&(e=ur(e));for(const r in e){const s=e[r];let o;ee(s)?"default"in s?o=wt(s.from||r,s.default,!0):o=wt(s.from||r):o=wt(s),ce(o)?Object.defineProperty(t,r,{enumerable:!0,configurable:!0,get:()=>o.value,set:i=>o.value=i}):t[r]=o}}function ls(e,t,n){xe(U(e)?e.map(r=>r.bind(t.proxy)):e.bind(t.proxy),t,n)}function Ao(e,t,n,r){const s=r.includes(".")?yo(n,r):()=>n[r];if(ne(e)){const o=t[e];W(o)&&Xe(s,o)}else if(W(e))Xe(s,e.bind(n));else if(ee(e))if(U(e))e.forEach(o=>Ao(o,t,n,r));else{const o=W(e.handler)?e.handler.bind(n):t[e.handler];W(o)&&Xe(s,o,e)}}function Hr(e){const t=e.type,{mixins:n,extends:r}=t,{mixins:s,optionsCache:o,config:{optionMergeStrategies:i}}=e.appContext,l=o.get(t);let c;return l?c=l:!s.length&&!n&&!r?c=t:(c={},s.length&&s.forEach(a=>wn(c,a,i,!0)),wn(c,t,i)),ee(t)&&o.set(t,c),c}function wn(e,t,n,r=!1){const{mixins:s,extends:o}=t;o&&wn(e,o,n,!0),s&&s.forEach(i=>wn(e,i,n,!0));for(const i in t)if(!(r&&i==="expose")){const l=Hl[i]||n&&n[i];e[i]=l?l(e[i],t[i]):t[i]}return e}const Hl={data:cs,props:as,emits:as,methods:Ft,computed:Ft,beforeCreate:pe,created:pe,beforeMount:pe,mounted:pe,beforeUpdate:pe,updated:pe,beforeDestroy:pe,beforeUnmount:pe,destroyed:pe,unmounted:pe,activated:pe,deactivated:pe,errorCaptured:pe,serverPrefetch:pe,components:Ft,directives:Ft,watch:jl,provide:cs,inject:$l};function cs(e,t){return t?e?function(){return ue(W(e)?e.call(this,this):e,W(t)?t.call(this,this):t)}:t:e}function $l(e,t){return Ft(ur(e),ur(t))}function ur(e){if(U(e)){const t={};for(let n=0;n<e.length;n++)t[e[n]]=e[n];return t}return e}function pe(e,t){return e?[...new Set([].concat(e,t))]:t}function Ft(e,t){return e?ue(Object.create(null),e,t):t}function as(e,t){return e?U(e)&&U(t)?[...new Set([...e,...t])]:ue(Object.create(null),is(e),is(t??{})):t}function jl(e,t){if(!e)return t;if(!t)return e;const n=ue(Object.create(null),e);for(const r in t)n[r]=pe(e[r],t[r]);return n}function So(){return{app:null,config:{isNativeTag:di,performance:!1,globalProperties:{},optionMergeStrategies:{},errorHandler:void 0,warnHandler:void 0,compilerOptions:{}},mixins:[],components:{},directives:{},provides:Object.create(null),optionsCache:new WeakMap,propsCache:new WeakMap,emitsCache:new WeakMap}}let Dl=0;function Bl(e,t){return function(r,s=null){W(r)||(r=ue({},r)),s!=null&&!ee(s)&&(s=null);const o=So(),i=new WeakSet;let l=!1;const c=o.app={_uid:Dl++,_component:r,_props:s,_container:null,_context:o,_instance:null,version:pc,get config(){return o.config},set config(a){},use(a,...f){return i.has(a)||(a&&W(a.install)?(i.add(a),a.install(c,...f)):W(a)&&(i.add(a),a(c,...f))),c},mixin(a){return o.mixins.includes(a)||o.mixins.push(a),c},component(a,f){return f?(o.components[a]=f,c):o.components[a]},directive(a,f){return f?(o.directives[a]=f,c):o.directives[a]},mount(a,f,h){if(!l){const m=re(r,s);return m.appContext=o,f&&t?t(m,a):e(m,a,h),l=!0,c._container=a,a.__vue_app__=c,kn(m.component)||m.component.proxy}},unmount(){l&&(e(null,c._container),delete c._container.__vue_app__)},provide(a,f){return o.provides[a]=f,c},runWithContext(a){Cn=c;try{return a()}finally{Cn=null}}};return c}}let Cn=null;function kl(e,t){if(le){let n=le.provides;const r=le.parent&&le.parent.provides;r===n&&(n=le.provides=Object.create(r)),n[e]=t}}function wt(e,t,n=!1){const r=le||de;if(r||Cn){const s=r?r.parent==null?r.vnode.appContext&&r.vnode.appContext.provides:r.parent.provides:Cn._context.provides;if(s&&e in s)return s[e];if(arguments.length>1)return n&&W(t)?t.call(r&&r.proxy):t}}function Ul(e,t,n,r=!1){const s={},o={};mn(o,Dn,1),e.propsDefaults=Object.create(null),Ro(e,t,s,o);for(const i in e.propsOptions[0])i in s||(s[i]=void 0);n?e.props=r?s:Ji(s):e.type.props?e.props=s:e.props=o,e.attrs=o}function Kl(e,t,n,r){const{props:s,attrs:o,vnode:{patchFlag:i}}=e,l=Q(s),[c]=e.propsOptions;let a=!1;if((r||i>0)&&!(i&16)){if(i&8){const f=e.vnode.dynamicProps;for(let h=0;h<f.length;h++){let m=f[h];if(Ln(e.emitsOptions,m))continue;const w=t[m];if(c)if(X(o,m))w!==o[m]&&(o[m]=w,a=!0);else{const E=Ne(m);s[E]=fr(c,l,E,w,e,!1)}else w!==o[m]&&(o[m]=w,a=!0)}}}else{Ro(e,t,s,o)&&(a=!0);let f;for(const h in l)(!t||!X(t,h)&&((f=ft(h))===h||!X(t,f)))&&(c?n&&(n[h]!==void 0||n[f]!==void 0)&&(s[h]=fr(c,l,h,void 0,e,!0)):delete s[h]);if(o!==l)for(const h in o)(!t||!X(t,h))&&(delete o[h],a=!0)}a&&De(e,"set","$attrs")}function Ro(e,t,n,r){const[s,o]=e.propsOptions;let i=!1,l;if(t)for(let c in t){if(It(c))continue;const a=t[c];let f;s&&X(s,f=Ne(c))?!o||!o.includes(f)?n[f]=a:(l||(l={}))[f]=a:Ln(e.emitsOptions,c)||(!(c in r)||a!==r[c])&&(r[c]=a,i=!0)}if(o){const c=Q(n),a=l||te;for(let f=0;f<o.length;f++){const h=o[f];n[h]=fr(s,c,h,a[h],e,!X(a,h))}}return i}function fr(e,t,n,r,s,o){const i=e[n];if(i!=null){const l=X(i,"default");if(l&&r===void 0){const c=i.default;if(i.type!==Function&&!i.skipFactory&&W(c)){const{propsDefaults:a}=s;n in a?r=a[n]:(xt(s),r=a[n]=c.call(null,t),ct())}else r=c}i[0]&&(o&&!l?r=!1:i[1]&&(r===""||r===ft(n))&&(r=!0))}return r}function Oo(e,t,n=!1){const r=t.propsCache,s=r.get(e);if(s)return s;const o=e.props,i={},l=[];let c=!1;if(!W(e)){const f=h=>{c=!0;const[m,w]=Oo(h,t,!0);ue(i,m),w&&l.push(...w)};!n&&t.mixins.length&&t.mixins.forEach(f),e.extends&&f(e.extends),e.mixins&&e.mixins.forEach(f)}if(!o&&!c)return ee(e)&&r.set(e,mt),mt;if(U(o))for(let f=0;f<o.length;f++){const h=Ne(o[f]);us(h)&&(i[h]=te)}else if(o)for(const f in o){const h=Ne(f);if(us(h)){const m=o[f],w=i[h]=U(m)||W(m)?{type:m}:ue({},m);if(w){const E=hs(Boolean,w.type),T=hs(String,w.type);w[0]=E>-1,w[1]=T<0||E<T,(E>-1||X(w,"default"))&&l.push(h)}}}const a=[i,l];return ee(e)&&r.set(e,a),a}function us(e){return e[0]!=="$"}function fs(e){const t=e&&e.toString().match(/^\s*(function|class) (\w+)/);return t?t[2]:e===null?"null":""}function ds(e,t){return fs(e)===fs(t)}function hs(e,t){return U(t)?t.findIndex(n=>ds(n,e)):W(t)&&ds(t,e)?0:-1}const Po=e=>e[0]==="_"||e==="$stable",$r=e=>U(e)?e.map(Ae):[Ae(e)],Wl=(e,t,n)=>{if(t._n)return t;const r=dl((...s)=>$r(t(...s)),n);return r._c=!1,r},Mo=(e,t,n)=>{const r=e._ctx;for(const s in e){if(Po(s))continue;const o=e[s];if(W(o))t[s]=Wl(s,o,r);else if(o!=null){const i=$r(o);t[s]=()=>i}}},Fo=(e,t)=>{const n=$r(t);e.slots.default=()=>n},Vl=(e,t)=>{if(e.vnode.shapeFlag&32){const n=t._;n?(e.slots=Q(t),mn(t,"_",n)):Mo(t,e.slots={})}else e.slots={},t&&Fo(e,t);mn(e.slots,Dn,1)},ql=(e,t,n)=>{const{vnode:r,slots:s}=e;let o=!0,i=te;if(r.shapeFlag&32){const l=t._;l?n&&l===1?o=!1:(ue(s,t),!n&&l===1&&delete s._):(o=!t.$stable,Mo(t,s)),i=t}else t&&(Fo(e,t),i={default:1});if(o)for(const l in s)!Po(l)&&i[l]==null&&delete s[l]};function En(e,t,n,r,s=!1){if(U(e)){e.forEach((m,w)=>En(m,t&&(U(t)?t[w]:t),n,r,s));return}if(vt(r)&&!s)return;const o=r.shapeFlag&4?kn(r.component)||r.component.proxy:r.el,i=s?null:o,{i:l,r:c}=e,a=t&&t.r,f=l.refs===te?l.refs={}:l.refs,h=l.setupState;if(a!=null&&a!==c&&(ne(a)?(f[a]=null,X(h,a)&&(h[a]=null)):ce(a)&&(a.value=null)),W(c))Je(c,l,12,[i,f]);else{const m=ne(c),w=ce(c);if(m||w){const E=()=>{if(e.f){const T=m?X(h,c)?h[c]:f[c]:c.value;s?U(T)&&_r(T,o):U(T)?T.includes(o)||T.push(o):m?(f[c]=[o],X(h,c)&&(h[c]=f[c])):(c.value=[o],e.k&&(f[e.k]=c.value))}else m?(f[c]=i,X(h,c)&&(h[c]=i)):w&&(c.value=i,e.k&&(f[e.k]=i))};i?(E.id=-1,ge(E,n)):E()}}}let Ke=!1;const on=e=>/svg/.test(e.namespaceURI)&&e.tagName!=="foreignObject",ln=e=>e.nodeType===8;function zl(e){const{mt:t,p:n,o:{patchProp:r,createText:s,nextSibling:o,parentNode:i,remove:l,insert:c,createComment:a}}=e,f=(y,p)=>{if(!p.hasChildNodes()){n(null,y,p),bn(),p._vnode=y;return}Ke=!1,h(p.firstChild,y,null,null,null),bn(),p._vnode=y,Ke&&console.error("Hydration completed but contains mismatches.")},h=(y,p,F,K,N,v=!1)=>{const M=ln(y)&&y.data==="[",R=()=>T(y,p,F,K,N,M),{type:z,ref:O,shapeFlag:q,patchFlag:oe}=p;let fe=y.nodeType;p.el=y,oe===-2&&(v=!1,p.dynamicChildren=null);let H=null;switch(z){case Et:fe!==3?p.children===""?(c(p.el=s(""),i(y),y),H=y):H=R():(y.data!==p.children&&(Ke=!0,y.data=p.children),H=o(y));break;case ve:if(fe!==8||M)if(y.tagName.toLowerCase()==="template"){const Y=p.el.content.firstChild;B(Y,y,F),p.el=y=Y,H=o(y)}else H=R();else H=o(y);break;case $t:if(M&&(y=o(y),fe=y.nodeType),fe===1||fe===3){H=y;const Y=!p.children.length;for(let D=0;D<p.staticCount;D++)Y&&(p.children+=H.nodeType===1?H.outerHTML:H.data),D===p.staticCount-1&&(p.anchor=H),H=o(H);return M?o(H):H}else R();break;case me:M?H=E(y,p,F,K,N,v):H=R();break;default:if(q&1)(fe!==1||p.type.toLowerCase()!==y.tagName.toLowerCase())&&!k(y)?H=R():H=m(y,p,F,K,N,v);else if(q&6){p.slotScopeIds=N;const Y=i(y);if(M?H=L(y):ln(y)&&y.data==="teleport start"?H=L(y,y.data,"teleport end"):H=o(y),t(p,Y,null,F,K,on(Y),v),vt(p)){let D;M?(D=re(me),D.anchor=H?H.previousSibling:Y.lastChild):D=y.nodeType===3?ko(""):re("div"),D.el=y,p.component.subTree=D}}else q&64?fe!==8?H=R():H=p.type.hydrate(y,p,F,K,N,v,e,w):q&128&&(H=p.type.hydrate(y,p,F,K,on(i(y)),N,v,e,h))}return O!=null&&En(O,null,K,p),H},m=(y,p,F,K,N,v)=>{v=v||!!p.dynamicChildren;const{type:M,props:R,patchFlag:z,shapeFlag:O,dirs:q,transition:oe}=p,fe=M==="input"&&q||M==="option";if(fe||z!==-1){if(q&&Ie(p,null,F,"created"),R)if(fe||!v||z&48)for(const D in R)(fe&&D.endsWith("value")||zt(D)&&!It(D))&&r(y,D,null,R[D],!1,void 0,F);else R.onClick&&r(y,"onClick",null,R.onClick,!1,void 0,F);let H;(H=R&&R.onVnodeBeforeMount)&&Ce(H,F,p);let Y=!1;if(k(y)){Y=Lo(K,oe)&&F&&F.vnode.props&&F.vnode.props.appear;const D=y.content.firstChild;Y&&oe.beforeEnter(D),B(D,y,F),p.el=y=D}if(q&&Ie(p,null,F,"beforeMount"),((H=R&&R.onVnodeMounted)||q||Y)&&mo(()=>{H&&Ce(H,F,p),Y&&oe.enter(y),q&&Ie(p,null,F,"mounted")},K),O&16&&!(R&&(R.innerHTML||R.textContent))){let D=w(y.firstChild,p,y,F,K,N,v);for(;D;){Ke=!0;const He=D;D=D.nextSibling,l(He)}}else O&8&&y.textContent!==p.children&&(Ke=!0,y.textContent=p.children)}return y.nextSibling},w=(y,p,F,K,N,v,M)=>{M=M||!!p.dynamicChildren;const R=p.children,z=R.length;for(let O=0;O<z;O++){const q=M?R[O]:R[O]=Ae(R[O]);if(y)y=h(y,q,K,N,v,M);else{if(q.type===Et&&!q.children)continue;Ke=!0,n(null,q,F,null,K,N,on(F),v)}}return y},E=(y,p,F,K,N,v)=>{const{slotScopeIds:M}=p;M&&(N=N?N.concat(M):M);const R=i(y),z=w(o(y),p,R,F,K,N,v);return z&&ln(z)&&z.data==="]"?o(p.anchor=z):(Ke=!0,c(p.anchor=a("]"),R,z),z)},T=(y,p,F,K,N,v)=>{if(Ke=!0,p.el=null,v){const z=L(y);for(;;){const O=o(y);if(O&&O!==z)l(O);else break}}const M=o(y),R=i(y);return l(y),n(null,p,R,M,F,K,on(R),N),M},L=(y,p="[",F="]")=>{let K=0;for(;y;)if(y=o(y),y&&ln(y)&&(y.data===p&&K++,y.data===F)){if(K===0)return o(y);K--}return y},B=(y,p,F)=>{const K=p.parentNode;K&&K.replaceChild(y,p);let N=F;for(;N;)N.vnode.el===p&&(N.vnode.el=y,N.subTree.el=y),N=N.parent},k=y=>y.nodeType===1&&y.tagName.toLowerCase()==="template";return[f,h]}const ge=mo;function Yl(e){return Io(e)}function Jl(e){return Io(e,zl)}function Io(e,t){const n=tr();n.__VUE__=!0;const{insert:r,remove:s,patchProp:o,createElement:i,createText:l,createComment:c,setText:a,setElementText:f,parentNode:h,nextSibling:m,setScopeId:w=Oe,insertStaticContent:E}=e,T=(u,d,g,_=null,b=null,A=null,P=!1,x=null,S=!!d.dynamicChildren)=>{if(u===d)return;u&&!st(u,d)&&(_=Qt(u),Me(u,b,A,!0),u=null),d.patchFlag===-2&&(S=!1,d.dynamicChildren=null);const{type:C,ref:$,shapeFlag:I}=d;switch(C){case Et:L(u,d,g,_);break;case ve:B(u,d,g,_);break;case $t:u==null&&k(d,g,_,P);break;case me:O(u,d,g,_,b,A,P,x,S);break;default:I&1?F(u,d,g,_,b,A,P,x,S):I&6?q(u,d,g,_,b,A,P,x,S):(I&64||I&128)&&C.process(u,d,g,_,b,A,P,x,S,dt)}$!=null&&b&&En($,u&&u.ref,A,d||u,!d)},L=(u,d,g,_)=>{if(u==null)r(d.el=l(d.children),g,_);else{const b=d.el=u.el;d.children!==u.children&&a(b,d.children)}},B=(u,d,g,_)=>{u==null?r(d.el=c(d.children||""),g,_):d.el=u.el},k=(u,d,g,_)=>{[u.el,u.anchor]=E(u.children,d,g,_,u.el,u.anchor)},y=({el:u,anchor:d},g,_)=>{let b;for(;u&&u!==d;)b=m(u),r(u,g,_),u=b;r(d,g,_)},p=({el:u,anchor:d})=>{let g;for(;u&&u!==d;)g=m(u),s(u),u=g;s(d)},F=(u,d,g,_,b,A,P,x,S)=>{P=P||d.type==="svg",u==null?K(d,g,_,b,A,P,x,S):M(u,d,b,A,P,x,S)},K=(u,d,g,_,b,A,P,x)=>{let S,C;const{type:$,props:I,shapeFlag:j,transition:V,dirs:J}=u;if(S=u.el=i(u.type,A,I&&I.is,I),j&8?f(S,u.children):j&16&&v(u.children,S,null,_,b,A&&$!=="foreignObject",P,x),J&&Ie(u,null,_,"created"),N(S,u,u.scopeId,P,_),I){for(const Z in I)Z!=="value"&&!It(Z)&&o(S,Z,null,I[Z],A,u.children,_,b,$e);"value"in I&&o(S,"value",null,I.value),(C=I.onVnodeBeforeMount)&&Ce(C,_,u)}J&&Ie(u,null,_,"beforeMount");const G=Lo(b,V);G&&V.beforeEnter(S),r(S,d,g),((C=I&&I.onVnodeMounted)||G||J)&&ge(()=>{C&&Ce(C,_,u),G&&V.enter(S),J&&Ie(u,null,_,"mounted")},b)},N=(u,d,g,_,b)=>{if(g&&w(u,g),_)for(let A=0;A<_.length;A++)w(u,_[A]);if(b){let A=b.subTree;if(d===A){const P=b.vnode;N(u,P,P.scopeId,P.slotScopeIds,b.parent)}}},v=(u,d,g,_,b,A,P,x,S=0)=>{for(let C=S;C<u.length;C++){const $=u[C]=x?ze(u[C]):Ae(u[C]);T(null,$,d,g,_,b,A,P,x)}},M=(u,d,g,_,b,A,P)=>{const x=d.el=u.el;let{patchFlag:S,dynamicChildren:C,dirs:$}=d;S|=u.patchFlag&16;const I=u.props||te,j=d.props||te;let V;g&&et(g,!1),(V=j.onVnodeBeforeUpdate)&&Ce(V,g,d,u),$&&Ie(d,u,g,"beforeUpdate"),g&&et(g,!0);const J=b&&d.type!=="foreignObject";if(C?R(u.dynamicChildren,C,x,g,_,J,A):P||D(u,d,x,null,g,_,J,A,!1),S>0){if(S&16)z(x,d,I,j,g,_,b);else if(S&2&&I.class!==j.class&&o(x,"class",null,j.class,b),S&4&&o(x,"style",I.style,j.style,b),S&8){const G=d.dynamicProps;for(let Z=0;Z<G.length;Z++){const se=G[Z],Te=I[se],ht=j[se];(ht!==Te||se==="value")&&o(x,se,Te,ht,b,u.children,g,_,$e)}}S&1&&u.children!==d.children&&f(x,d.children)}else!P&&C==null&&z(x,d,I,j,g,_,b);((V=j.onVnodeUpdated)||$)&&ge(()=>{V&&Ce(V,g,d,u),$&&Ie(d,u,g,"updated")},_)},R=(u,d,g,_,b,A,P)=>{for(let x=0;x<d.length;x++){const S=u[x],C=d[x],$=S.el&&(S.type===me||!st(S,C)||S.shapeFlag&70)?h(S.el):g;T(S,C,$,null,_,b,A,P,!0)}},z=(u,d,g,_,b,A,P)=>{if(g!==_){if(g!==te)for(const x in g)!It(x)&&!(x in _)&&o(u,x,g[x],null,P,d.children,b,A,$e);for(const x in _){if(It(x))continue;const S=_[x],C=g[x];S!==C&&x!=="value"&&o(u,x,C,S,P,d.children,b,A,$e)}"value"in _&&o(u,"value",g.value,_.value)}},O=(u,d,g,_,b,A,P,x,S)=>{const C=d.el=u?u.el:l(""),$=d.anchor=u?u.anchor:l("");let{patchFlag:I,dynamicChildren:j,slotScopeIds:V}=d;V&&(x=x?x.concat(V):V),u==null?(r(C,g,_),r($,g,_),v(d.children,g,$,b,A,P,x,S)):I>0&&I&64&&j&&u.dynamicChildren?(R(u.dynamicChildren,j,g,b,A,P,x),(d.key!=null||b&&d===b.subTree)&&jr(u,d,!0)):D(u,d,g,$,b,A,P,x,S)},q=(u,d,g,_,b,A,P,x,S)=>{d.slotScopeIds=x,u==null?d.shapeFlag&512?b.ctx.activate(d,g,_,P,S):oe(d,g,_,b,A,P,S):fe(u,d,S)},oe=(u,d,g,_,b,A,P)=>{const x=u.component=ic(u,_,b);if(Jt(u)&&(x.ctx.renderer=dt),lc(x),x.asyncDep){if(b&&b.registerDep(x,H),!u.el){const S=x.subTree=re(ve);B(null,S,d,g)}return}H(x,u,d,g,b,A,P)},fe=(u,d,g)=>{const _=d.component=u.component;if(gl(u,d,g))if(_.asyncDep&&!_.asyncResolved){Y(_,d,g);return}else _.next=d,cl(_.update),_.update();else d.el=u.el,_.vnode=d},H=(u,d,g,_,b,A,P)=>{const x=()=>{if(u.isMounted){let{next:$,bu:I,u:j,parent:V,vnode:J}=u,G=$,Z;et(u,!1),$?($.el=J.el,Y(u,$,P)):$=J,I&&hn(I),(Z=$.props&&$.props.onVnodeBeforeUpdate)&&Ce(Z,V,$,J),et(u,!0);const se=Wn(u),Te=u.subTree;u.subTree=se,T(Te,se,h(Te.el),Qt(Te),u,b,A),$.el=se.el,G===null&&ml(u,se.el),j&&ge(j,b),(Z=$.props&&$.props.onVnodeUpdated)&&ge(()=>Ce(Z,V,$,J),b)}else{let $;const{el:I,props:j}=d,{bm:V,m:J,parent:G}=u,Z=vt(d);if(et(u,!1),V&&hn(V),!Z&&($=j&&j.onVnodeBeforeMount)&&Ce($,G,d),et(u,!0),I&&Kn){const se=()=>{u.subTree=Wn(u),Kn(I,u.subTree,u,b,null)};Z?d.type.__asyncLoader().then(()=>!u.isUnmounted&&se()):se()}else{const se=u.subTree=Wn(u);T(null,se,g,_,u,b,A),d.el=se.el}if(J&&ge(J,b),!Z&&($=j&&j.onVnodeMounted)){const se=d;ge(()=>Ce($,G,se),b)}(d.shapeFlag&256||G&&vt(G.vnode)&&G.vnode.shapeFlag&256)&&u.a&&ge(u.a,b),u.isMounted=!0,d=g=_=null}},S=u.effect=new Er(x,()=>In(C),u.scope),C=u.update=()=>S.run();C.id=u.uid,et(u,!0),C()},Y=(u,d,g)=>{d.component=u;const _=u.vnode.props;u.vnode=d,u.next=null,Kl(u,d.props,_,g),ql(u,d.children,g),At(),ns(),St()},D=(u,d,g,_,b,A,P,x,S=!1)=>{const C=u&&u.children,$=u?u.shapeFlag:0,I=d.children,{patchFlag:j,shapeFlag:V}=d;if(j>0){if(j&128){Xt(C,I,g,_,b,A,P,x,S);return}else if(j&256){He(C,I,g,_,b,A,P,x,S);return}}V&8?($&16&&$e(C,b,A),I!==C&&f(g,I)):$&16?V&16?Xt(C,I,g,_,b,A,P,x,S):$e(C,b,A,!0):($&8&&f(g,""),V&16&&v(I,g,_,b,A,P,x,S))},He=(u,d,g,_,b,A,P,x,S)=>{u=u||mt,d=d||mt;const C=u.length,$=d.length,I=Math.min(C,$);let j;for(j=0;j<I;j++){const V=d[j]=S?ze(d[j]):Ae(d[j]);T(u[j],V,g,null,b,A,P,x,S)}C>$?$e(u,b,A,!0,!1,I):v(d,g,_,b,A,P,x,S,I)},Xt=(u,d,g,_,b,A,P,x,S)=>{let C=0;const $=d.length;let I=u.length-1,j=$-1;for(;C<=I&&C<=j;){const V=u[C],J=d[C]=S?ze(d[C]):Ae(d[C]);if(st(V,J))T(V,J,g,null,b,A,P,x,S);else break;C++}for(;C<=I&&C<=j;){const V=u[I],J=d[j]=S?ze(d[j]):Ae(d[j]);if(st(V,J))T(V,J,g,null,b,A,P,x,S);else break;I--,j--}if(C>I){if(C<=j){const V=j+1,J=V<$?d[V].el:_;for(;C<=j;)T(null,d[C]=S?ze(d[C]):Ae(d[C]),g,J,b,A,P,x,S),C++}}else if(C>j)for(;C<=I;)Me(u[C],b,A,!0),C++;else{const V=C,J=C,G=new Map;for(C=J;C<=j;C++){const _e=d[C]=S?ze(d[C]):Ae(d[C]);_e.key!=null&&G.set(_e.key,C)}let Z,se=0;const Te=j-J+1;let ht=!1,Vr=0;const Ot=new Array(Te);for(C=0;C<Te;C++)Ot[C]=0;for(C=V;C<=I;C++){const _e=u[C];if(se>=Te){Me(_e,b,A,!0);continue}let Fe;if(_e.key!=null)Fe=G.get(_e.key);else for(Z=J;Z<=j;Z++)if(Ot[Z-J]===0&&st(_e,d[Z])){Fe=Z;break}Fe===void 0?Me(_e,b,A,!0):(Ot[Fe-J]=C+1,Fe>=Vr?Vr=Fe:ht=!0,T(_e,d[Fe],g,null,b,A,P,x,S),se++)}const qr=ht?Xl(Ot):mt;for(Z=qr.length-1,C=Te-1;C>=0;C--){const _e=J+C,Fe=d[_e],zr=_e+1<$?d[_e+1].el:_;Ot[C]===0?T(null,Fe,g,zr,b,A,P,x,S):ht&&(Z<0||C!==qr[Z]?Ge(Fe,g,zr,2):Z--)}}},Ge=(u,d,g,_,b=null)=>{const{el:A,type:P,transition:x,children:S,shapeFlag:C}=u;if(C&6){Ge(u.component.subTree,d,g,_);return}if(C&128){u.suspense.move(d,g,_);return}if(C&64){P.move(u,d,g,dt);return}if(P===me){r(A,d,g);for(let I=0;I<S.length;I++)Ge(S[I],d,g,_);r(u.anchor,d,g);return}if(P===$t){y(u,d,g);return}if(_!==2&&C&1&&x)if(_===0)x.beforeEnter(A),r(A,d,g),ge(()=>x.enter(A),b);else{const{leave:I,delayLeave:j,afterLeave:V}=x,J=()=>r(A,d,g),G=()=>{I(A,()=>{J(),V&&V()})};j?j(A,J,G):G()}else r(A,d,g)},Me=(u,d,g,_=!1,b=!1)=>{const{type:A,props:P,ref:x,children:S,dynamicChildren:C,shapeFlag:$,patchFlag:I,dirs:j}=u;if(x!=null&&En(x,null,g,u,!0),$&256){d.ctx.deactivate(u);return}const V=$&1&&j,J=!vt(u);let G;if(J&&(G=P&&P.onVnodeBeforeUnmount)&&Ce(G,d,u),$&6)fi(u.component,g,_);else{if($&128){u.suspense.unmount(g,_);return}V&&Ie(u,null,d,"beforeUnmount"),$&64?u.type.remove(u,d,g,b,dt,_):C&&(A!==me||I>0&&I&64)?$e(C,d,g,!1,!0):(A===me&&I&384||!b&&$&16)&&$e(S,d,g),_&&Kr(u)}(J&&(G=P&&P.onVnodeUnmounted)||V)&&ge(()=>{G&&Ce(G,d,u),V&&Ie(u,null,d,"unmounted")},g)},Kr=u=>{const{type:d,el:g,anchor:_,transition:b}=u;if(d===me){ui(g,_);return}if(d===$t){p(u);return}const A=()=>{s(g),b&&!b.persisted&&b.afterLeave&&b.afterLeave()};if(u.shapeFlag&1&&b&&!b.persisted){const{leave:P,delayLeave:x}=b,S=()=>P(g,A);x?x(u.el,A,S):S()}else A()},ui=(u,d)=>{let g;for(;u!==d;)g=m(u),s(u),u=g;s(d)},fi=(u,d,g)=>{const{bum:_,scope:b,update:A,subTree:P,um:x}=u;_&&hn(_),b.stop(),A&&(A.active=!1,Me(P,u,d,g)),x&&ge(x,d),ge(()=>{u.isUnmounted=!0},d),d&&d.pendingBranch&&!d.isUnmounted&&u.asyncDep&&!u.asyncResolved&&u.suspenseId===d.pendingId&&(d.deps--,d.deps===0&&d.resolve())},$e=(u,d,g,_=!1,b=!1,A=0)=>{for(let P=A;P<u.length;P++)Me(u[P],d,g,_,b)},Qt=u=>u.shapeFlag&6?Qt(u.component.subTree):u.shapeFlag&128?u.suspense.next():m(u.anchor||u.el),Wr=(u,d,g)=>{u==null?d._vnode&&Me(d._vnode,null,null,!0):T(d._vnode||null,u,d,null,null,null,g),ns(),bn(),d._vnode=u},dt={p:T,um:Me,m:Ge,r:Kr,mt:oe,mc:v,pc:D,pbc:R,n:Qt,o:e};let Un,Kn;return t&&([Un,Kn]=t(dt)),{render:Wr,hydrate:Un,createApp:Bl(Wr,Un)}}function et({effect:e,update:t},n){e.allowRecurse=t.allowRecurse=n}function Lo(e,t){return(!e||e&&!e.pendingBranch)&&t&&!t.persisted}function jr(e,t,n=!1){const r=e.children,s=t.children;if(U(r)&&U(s))for(let o=0;o<r.length;o++){const i=r[o];let l=s[o];l.shapeFlag&1&&!l.dynamicChildren&&((l.patchFlag<=0||l.patchFlag===32)&&(l=s[o]=ze(s[o]),l.el=i.el),n||jr(i,l)),l.type===Et&&(l.el=i.el)}}function Xl(e){const t=e.slice(),n=[0];let r,s,o,i,l;const c=e.length;for(r=0;r<c;r++){const a=e[r];if(a!==0){if(s=n[n.length-1],e[s]<a){t[r]=s,n.push(r);continue}for(o=0,i=n.length-1;o<i;)l=o+i>>1,e[n[l]]<a?o=l+1:i=l;a<e[n[o]]&&(o>0&&(t[r]=n[o-1]),n[o]=r)}}for(o=n.length,i=n[o-1];o-- >0;)n[o]=i,i=t[i];return n}const Ql=e=>e.__isTeleport,Ht=e=>e&&(e.disabled||e.disabled===""),ps=e=>typeof SVGElement<"u"&&e instanceof SVGElement,dr=(e,t)=>{const n=e&&e.to;return ne(n)?t?t(n):null:n},Zl={__isTeleport:!0,process(e,t,n,r,s,o,i,l,c,a){const{mc:f,pc:h,pbc:m,o:{insert:w,querySelector:E,createText:T,createComment:L}}=a,B=Ht(t.props);let{shapeFlag:k,children:y,dynamicChildren:p}=t;if(e==null){const F=t.el=T(""),K=t.anchor=T("");w(F,n,r),w(K,n,r);const N=t.target=dr(t.props,E),v=t.targetAnchor=T("");N&&(w(v,N),i=i||ps(N));const M=(R,z)=>{k&16&&f(y,R,z,s,o,i,l,c)};B?M(n,K):N&&M(N,v)}else{t.el=e.el;const F=t.anchor=e.anchor,K=t.target=e.target,N=t.targetAnchor=e.targetAnchor,v=Ht(e.props),M=v?n:K,R=v?F:N;if(i=i||ps(K),p?(m(e.dynamicChildren,p,M,s,o,i,l),jr(e,t,!0)):c||h(e,t,M,R,s,o,i,l,!1),B)v?t.props&&e.props&&t.props.to!==e.props.to&&(t.props.to=e.props.to):cn(t,n,F,a,1);else if((t.props&&t.props.to)!==(e.props&&e.props.to)){const z=t.target=dr(t.props,E);z&&cn(t,z,null,a,0)}else v&&cn(t,K,N,a,1)}No(t)},remove(e,t,n,r,{um:s,o:{remove:o}},i){const{shapeFlag:l,children:c,anchor:a,targetAnchor:f,target:h,props:m}=e;if(h&&o(f),i&&o(a),l&16){const w=i||!Ht(m);for(let E=0;E<c.length;E++){const T=c[E];s(T,t,n,w,!!T.dynamicChildren)}}},move:cn,hydrate:Gl};function cn(e,t,n,{o:{insert:r},m:s},o=2){o===0&&r(e.targetAnchor,t,n);const{el:i,anchor:l,shapeFlag:c,children:a,props:f}=e,h=o===2;if(h&&r(i,t,n),(!h||Ht(f))&&c&16)for(let m=0;m<a.length;m++)s(a[m],t,n,2);h&&r(l,t,n)}function Gl(e,t,n,r,s,o,{o:{nextSibling:i,parentNode:l,querySelector:c}},a){const f=t.target=dr(t.props,c);if(f){const h=f._lpa||f.firstChild;if(t.shapeFlag&16)if(Ht(t.props))t.anchor=a(i(e),t,l(e),n,r,s,o),t.targetAnchor=h;else{t.anchor=i(e);let m=h;for(;m;)if(m=i(m),m&&m.nodeType===8&&m.data==="teleport anchor"){t.targetAnchor=m,f._lpa=t.targetAnchor&&i(t.targetAnchor);break}a(h,t,f,n,r,s,o)}No(t)}return t.anchor&&i(t.anchor)}const qa=Zl;function No(e){const t=e.ctx;if(t&&t.ut){let n=e.children[0].el;for(;n&&n!==e.targetAnchor;)n.nodeType===1&&n.setAttribute("data-v-owner",t.uid),n=n.nextSibling;t.ut()}}const me=Symbol.for("v-fgt"),Et=Symbol.for("v-txt"),ve=Symbol.for("v-cmt"),$t=Symbol.for("v-stc"),jt=[];let Re=null;function Ho(e=!1){jt.push(Re=e?null:[])}function ec(){jt.pop(),Re=jt[jt.length-1]||null}let Kt=1;function gs(e){Kt+=e}function $o(e){return e.dynamicChildren=Kt>0?Re||mt:null,ec(),Kt>0&&Re&&Re.push(e),e}function za(e,t,n,r,s,o){return $o(Bo(e,t,n,r,s,o,!0))}function jo(e,t,n,r,s){return $o(re(e,t,n,r,s,!0))}function xn(e){return e?e.__v_isVNode===!0:!1}function st(e,t){return e.type===t.type&&e.key===t.key}const Dn="__vInternal",Do=({key:e})=>e??null,pn=({ref:e,ref_key:t,ref_for:n})=>(typeof e=="number"&&(e=""+e),e!=null?ne(e)||ce(e)||W(e)?{i:de,r:e,k:t,f:!!n}:e:null);function Bo(e,t=null,n=null,r=0,s=null,o=e===me?0:1,i=!1,l=!1){const c={__v_isVNode:!0,__v_skip:!0,type:e,props:t,key:t&&Do(t),ref:t&&pn(t),scopeId:Nn,slotScopeIds:null,children:n,component:null,suspense:null,ssContent:null,ssFallback:null,dirs:null,transition:null,el:null,anchor:null,target:null,targetAnchor:null,staticCount:0,shapeFlag:o,patchFlag:r,dynamicProps:s,dynamicChildren:null,appContext:null,ctx:de};return l?(Dr(c,n),o&128&&e.normalize(c)):n&&(c.shapeFlag|=ne(n)?8:16),Kt>0&&!i&&Re&&(c.patchFlag>0||o&6)&&c.patchFlag!==32&&Re.push(c),c}const re=tc;function tc(e,t=null,n=null,r=0,s=null,o=!1){if((!e||e===Eo)&&(e=ve),xn(e)){const l=Ze(e,t,!0);return n&&Dr(l,n),Kt>0&&!o&&Re&&(l.shapeFlag&6?Re[Re.indexOf(e)]=l:Re.push(l)),l.patchFlag|=-2,l}if(fc(e)&&(e=e.__vccOpts),t){t=nc(t);let{class:l,style:c}=t;l&&!ne(l)&&(t.class=wr(l)),ee(c)&&(co(c)&&!U(c)&&(c=ue({},c)),t.style=vr(c))}const i=ne(e)?1:yl(e)?128:Ql(e)?64:ee(e)?4:W(e)?2:0;return Bo(e,t,n,r,s,i,o,!0)}function nc(e){return e?co(e)||Dn in e?ue({},e):e:null}function Ze(e,t,n=!1){const{props:r,ref:s,patchFlag:o,children:i}=e,l=t?rc(r||{},t):r;return{__v_isVNode:!0,__v_skip:!0,type:e.type,props:l,key:l&&Do(l),ref:t&&t.ref?n&&s?U(s)?s.concat(pn(t)):[s,pn(t)]:pn(t):s,scopeId:e.scopeId,slotScopeIds:e.slotScopeIds,children:i,target:e.target,targetAnchor:e.targetAnchor,staticCount:e.staticCount,shapeFlag:e.shapeFlag,patchFlag:t&&e.type!==me?o===-1?16:o|16:o,dynamicProps:e.dynamicProps,dynamicChildren:e.dynamicChildren,appContext:e.appContext,dirs:e.dirs,transition:e.transition,component:e.component,suspense:e.suspense,ssContent:e.ssContent&&Ze(e.ssContent),ssFallback:e.ssFallback&&Ze(e.ssFallback),el:e.el,anchor:e.anchor,ctx:e.ctx,ce:e.ce}}function ko(e=" ",t=0){return re(Et,null,e,t)}function Ya(e,t){const n=re($t,null,e);return n.staticCount=t,n}function Ja(e="",t=!1){return t?(Ho(),jo(ve,null,e)):re(ve,null,e)}function Ae(e){return e==null||typeof e=="boolean"?re(ve):U(e)?re(me,null,e.slice()):typeof e=="object"?ze(e):re(Et,null,String(e))}function ze(e){return e.el===null&&e.patchFlag!==-1||e.memo?e:Ze(e)}function Dr(e,t){let n=0;const{shapeFlag:r}=e;if(t==null)t=null;else if(U(t))n=16;else if(typeof t=="object")if(r&65){const s=t.default;s&&(s._c&&(s._d=!1),Dr(e,s()),s._c&&(s._d=!0));return}else{n=32;const s=t._;!s&&!(Dn in t)?t._ctx=de:s===3&&de&&(de.slots._===1?t._=1:(t._=2,e.patchFlag|=1024))}else W(t)?(t={default:t,_ctx:de},n=32):(t=String(t),r&64?(n=16,t=[ko(t)]):n=8);e.children=t,e.shapeFlag|=n}function rc(...e){const t={};for(let n=0;n<e.length;n++){const r=e[n];for(const s in r)if(s==="class")t.class!==r.class&&(t.class=wr([t.class,r.class]));else if(s==="style")t.style=vr([t.style,r.style]);else if(zt(s)){const o=t[s],i=r[s];i&&o!==i&&!(U(o)&&o.includes(i))&&(t[s]=o?[].concat(o,i):i)}else s!==""&&(t[s]=r[s])}return t}function Ce(e,t,n,r=null){xe(e,t,7,[n,r])}const sc=So();let oc=0;function ic(e,t,n){const r=e.type,s=(t?t.appContext:e.appContext)||sc,o={uid:oc++,vnode:e,type:r,parent:t,appContext:s,root:null,next:null,subTree:null,effect:null,update:null,scope:new Ti(!0),render:null,proxy:null,exposed:null,exposeProxy:null,withProxy:null,provides:t?t.provides:Object.create(s.provides),accessCache:null,renderCache:[],components:null,directives:null,propsOptions:Oo(r,s),emitsOptions:go(r,s),emit:null,emitted:null,propsDefaults:te,inheritAttrs:r.inheritAttrs,ctx:te,data:te,props:te,attrs:te,slots:te,refs:te,setupState:te,setupContext:null,attrsProxy:null,slotsProxy:null,suspense:n,suspenseId:n?n.pendingId:0,asyncDep:null,asyncResolved:!1,isMounted:!1,isUnmounted:!1,isDeactivated:!1,bc:null,c:null,bm:null,m:null,bu:null,u:null,um:null,bum:null,da:null,a:null,rtg:null,rtc:null,ec:null,sp:null};return o.ctx={_:o},o.root=t?t.root:o,o.emit=fl.bind(null,o),e.ce&&e.ce(o),o}let le=null;const Bn=()=>le||de;let Br,pt,ms="__VUE_INSTANCE_SETTERS__";(pt=tr()[ms])||(pt=tr()[ms]=[]),pt.push(e=>le=e),Br=e=>{pt.length>1?pt.forEach(t=>t(e)):pt[0](e)};const xt=e=>{Br(e),e.scope.on()},ct=()=>{le&&le.scope.off(),Br(null)};function Uo(e){return e.vnode.shapeFlag&4}let Tt=!1;function lc(e,t=!1){Tt=t;const{props:n,children:r}=e.vnode,s=Uo(e);Ul(e,n,s,t),Vl(e,r);const o=s?cc(e,t):void 0;return Tt=!1,o}function cc(e,t){const n=e.type;e.accessCache=Object.create(null),e.proxy=Lt(new Proxy(e.ctx,Fl));const{setup:r}=n;if(r){const s=e.setupContext=r.length>1?Wo(e):null;xt(e),At();const o=Je(r,e,0,[e.props,s]);if(St(),ct(),qs(o)){if(o.then(ct,ct),t)return o.then(i=>{ys(e,i,t)}).catch(i=>{Yt(i,e,0)});e.asyncDep=o}else ys(e,o,t)}else Ko(e,t)}function ys(e,t,n){W(t)?e.type.__ssrInlineRender?e.ssrRender=t:e.render=t:ee(t)&&(e.setupState=uo(t)),Ko(e,n)}let _s;function Ko(e,t,n){const r=e.type;if(!e.render){if(!t&&_s&&!r.render){const s=r.template||Hr(e).template;if(s){const{isCustomElement:o,compilerOptions:i}=e.appContext.config,{delimiters:l,compilerOptions:c}=r,a=ue(ue({isCustomElement:o,delimiters:l},i),c);r.render=_s(s,a)}}e.render=r.render||Oe}{xt(e),At();try{Ll(e)}finally{St(),ct()}}}function ac(e){return e.attrsProxy||(e.attrsProxy=new Proxy(e.attrs,{get(t,n){return ye(e,"get","$attrs"),t[n]}}))}function Wo(e){const t=n=>{e.exposed=n||{}};return{get attrs(){return ac(e)},slots:e.slots,emit:e.emit,expose:t}}function kn(e){if(e.exposed)return e.exposeProxy||(e.exposeProxy=new Proxy(uo(Lt(e.exposed)),{get(t,n){if(n in t)return t[n];if(n in Nt)return Nt[n](e)},has(t,n){return n in t||n in Nt}}))}function uc(e,t=!0){return W(e)?e.displayName||e.name:e.name||t&&e.__name}function fc(e){return W(e)&&"__vccOpts"in e}const ie=(e,t)=>ol(e,t,Tt);function hr(e,t,n){const r=arguments.length;return r===2?ee(t)&&!U(t)?xn(t)?re(e,null,[t]):re(e,t):re(e,null,t):(r>3?n=Array.prototype.slice.call(arguments,2):r===3&&xn(n)&&(n=[n]),re(e,t,n))}const dc=Symbol.for("v-scx"),hc=()=>wt(dc),pc="3.3.7",gc="http://www.w3.org/2000/svg",ot=typeof document<"u"?document:null,bs=ot&&ot.createElement("template"),mc={insert:(e,t,n)=>{t.insertBefore(e,n||null)},remove:e=>{const t=e.parentNode;t&&t.removeChild(e)},createElement:(e,t,n,r)=>{const s=t?ot.createElementNS(gc,e):ot.createElement(e,n?{is:n}:void 0);return e==="select"&&r&&r.multiple!=null&&s.setAttribute("multiple",r.multiple),s},createText:e=>ot.createTextNode(e),createComment:e=>ot.createComment(e),setText:(e,t)=>{e.nodeValue=t},setElementText:(e,t)=>{e.textContent=t},parentNode:e=>e.parentNode,nextSibling:e=>e.nextSibling,querySelector:e=>ot.querySelector(e),setScopeId(e,t){e.setAttribute(t,"")},insertStaticContent(e,t,n,r,s,o){const i=n?n.previousSibling:t.lastChild;if(s&&(s===o||s.nextSibling))for(;t.insertBefore(s.cloneNode(!0),n),!(s===o||!(s=s.nextSibling)););else{bs.innerHTML=r?`<svg>${e}</svg>`:e;const l=bs.content;if(r){const c=l.firstChild;for(;c.firstChild;)l.appendChild(c.firstChild);l.removeChild(c)}t.insertBefore(l,n)}return[i?i.nextSibling:t.firstChild,n?n.previousSibling:t.lastChild]}},We="transition",Pt="animation",Wt=Symbol("_vtc"),Vo=(e,{slots:t})=>hr(wl,yc(e),t);Vo.displayName="Transition";const qo={name:String,type:String,css:{type:Boolean,default:!0},duration:[String,Number,Object],enterFromClass:String,enterActiveClass:String,enterToClass:String,appearFromClass:String,appearActiveClass:String,appearToClass:String,leaveFromClass:String,leaveActiveClass:String,leaveToClass:String};Vo.props=ue({},_o,qo);const tt=(e,t=[])=>{U(e)?e.forEach(n=>n(...t)):e&&e(...t)},vs=e=>e?U(e)?e.some(t=>t.length>1):e.length>1:!1;function yc(e){const t={};for(const O in e)O in qo||(t[O]=e[O]);if(e.css===!1)return t;const{name:n="v",type:r,duration:s,enterFromClass:o=`${n}-enter-from`,enterActiveClass:i=`${n}-enter-active`,enterToClass:l=`${n}-enter-to`,appearFromClass:c=o,appearActiveClass:a=i,appearToClass:f=l,leaveFromClass:h=`${n}-leave-from`,leaveActiveClass:m=`${n}-leave-active`,leaveToClass:w=`${n}-leave-to`}=e,E=_c(s),T=E&&E[0],L=E&&E[1],{onBeforeEnter:B,onEnter:k,onEnterCancelled:y,onLeave:p,onLeaveCancelled:F,onBeforeAppear:K=B,onAppear:N=k,onAppearCancelled:v=y}=t,M=(O,q,oe)=>{nt(O,q?f:l),nt(O,q?a:i),oe&&oe()},R=(O,q)=>{O._isLeaving=!1,nt(O,h),nt(O,w),nt(O,m),q&&q()},z=O=>(q,oe)=>{const fe=O?N:k,H=()=>M(q,O,oe);tt(fe,[q,H]),ws(()=>{nt(q,O?c:o),Ve(q,O?f:l),vs(fe)||Cs(q,r,T,H)})};return ue(t,{onBeforeEnter(O){tt(B,[O]),Ve(O,o),Ve(O,i)},onBeforeAppear(O){tt(K,[O]),Ve(O,c),Ve(O,a)},onEnter:z(!1),onAppear:z(!0),onLeave(O,q){O._isLeaving=!0;const oe=()=>R(O,q);Ve(O,h),wc(),Ve(O,m),ws(()=>{O._isLeaving&&(nt(O,h),Ve(O,w),vs(p)||Cs(O,r,L,oe))}),tt(p,[O,oe])},onEnterCancelled(O){M(O,!1),tt(y,[O])},onAppearCancelled(O){M(O,!0),tt(v,[O])},onLeaveCancelled(O){R(O),tt(F,[O])}})}function _c(e){if(e==null)return null;if(ee(e))return[Yn(e.enter),Yn(e.leave)];{const t=Yn(e);return[t,t]}}function Yn(e){return _i(e)}function Ve(e,t){t.split(/\s+/).forEach(n=>n&&e.classList.add(n)),(e[Wt]||(e[Wt]=new Set)).add(t)}function nt(e,t){t.split(/\s+/).forEach(r=>r&&e.classList.remove(r));const n=e[Wt];n&&(n.delete(t),n.size||(e[Wt]=void 0))}function ws(e){requestAnimationFrame(()=>{requestAnimationFrame(e)})}let bc=0;function Cs(e,t,n,r){const s=e._endId=++bc,o=()=>{s===e._endId&&r()};if(n)return setTimeout(o,n);const{type:i,timeout:l,propCount:c}=vc(e,t);if(!i)return r();const a=i+"end";let f=0;const h=()=>{e.removeEventListener(a,m),o()},m=w=>{w.target===e&&++f>=c&&h()};setTimeout(()=>{f<c&&h()},l+1),e.addEventListener(a,m)}function vc(e,t){const n=window.getComputedStyle(e),r=E=>(n[E]||"").split(", "),s=r(`${We}Delay`),o=r(`${We}Duration`),i=Es(s,o),l=r(`${Pt}Delay`),c=r(`${Pt}Duration`),a=Es(l,c);let f=null,h=0,m=0;t===We?i>0&&(f=We,h=i,m=o.length):t===Pt?a>0&&(f=Pt,h=a,m=c.length):(h=Math.max(i,a),f=h>0?i>a?We:Pt:null,m=f?f===We?o.length:c.length:0);const w=f===We&&/\b(transform|all)(,|$)/.test(r(`${We}Property`).toString());return{type:f,timeout:h,propCount:m,hasTransform:w}}function Es(e,t){for(;e.length<t.length;)e=e.concat(e);return Math.max(...t.map((n,r)=>xs(n)+xs(e[r])))}function xs(e){return e==="auto"?0:Number(e.slice(0,-1).replace(",","."))*1e3}function wc(){return document.body.offsetHeight}function Cc(e,t,n){const r=e[Wt];r&&(t=(t?[t,...r]:[...r]).join(" ")),t==null?e.removeAttribute("class"):n?e.setAttribute("class",t):e.className=t}const Ec=Symbol("_vod");function xc(e,t,n){const r=e.style,s=ne(n);if(n&&!s){if(t&&!ne(t))for(const o in t)n[o]==null&&pr(r,o,"");for(const o in n)pr(r,o,n[o])}else{const o=r.display;s?t!==n&&(r.cssText=n):t&&e.removeAttribute("style"),Ec in e&&(r.display=o)}}const Ts=/\s*!important$/;function pr(e,t,n){if(U(n))n.forEach(r=>pr(e,t,r));else if(n==null&&(n=""),t.startsWith("--"))e.setProperty(t,n);else{const r=Tc(e,t);Ts.test(n)?e.setProperty(ft(r),n.replace(Ts,""),"important"):e[r]=n}}const As=["Webkit","Moz","ms"],Jn={};function Tc(e,t){const n=Jn[t];if(n)return n;let r=Ne(t);if(r!=="filter"&&r in e)return Jn[t]=r;r=Rn(r);for(let s=0;s<As.length;s++){const o=As[s]+r;if(o in e)return Jn[t]=o}return t}const Ss="http://www.w3.org/1999/xlink";function Ac(e,t,n,r,s){if(r&&t.startsWith("xlink:"))n==null?e.removeAttributeNS(Ss,t.slice(6,t.length)):e.setAttributeNS(Ss,t,n);else{const o=xi(t);n==null||o&&!Js(n)?e.removeAttribute(t):e.setAttribute(t,o?"":n)}}function Sc(e,t,n,r,s,o,i){if(t==="innerHTML"||t==="textContent"){r&&i(r,s,o),e[t]=n??"";return}const l=e.tagName;if(t==="value"&&l!=="PROGRESS"&&!l.includes("-")){e._value=n;const a=l==="OPTION"?e.getAttribute("value"):e.value,f=n??"";a!==f&&(e.value=f),n==null&&e.removeAttribute(t);return}let c=!1;if(n===""||n==null){const a=typeof e[t];a==="boolean"?n=Js(n):n==null&&a==="string"?(n="",c=!0):a==="number"&&(n=0,c=!0)}try{e[t]=n}catch{}c&&e.removeAttribute(t)}function gt(e,t,n,r){e.addEventListener(t,n,r)}function Rc(e,t,n,r){e.removeEventListener(t,n,r)}const Rs=Symbol("_vei");function Oc(e,t,n,r,s=null){const o=e[Rs]||(e[Rs]={}),i=o[t];if(r&&i)i.value=r;else{const[l,c]=Pc(t);if(r){const a=o[t]=Ic(r,s);gt(e,l,a,c)}else i&&(Rc(e,l,i,c),o[t]=void 0)}}const Os=/(?:Once|Passive|Capture)$/;function Pc(e){let t;if(Os.test(e)){t={};let r;for(;r=e.match(Os);)e=e.slice(0,e.length-r[0].length),t[r[0].toLowerCase()]=!0}return[e[2]===":"?e.slice(3):ft(e.slice(2)),t]}let Xn=0;const Mc=Promise.resolve(),Fc=()=>Xn||(Mc.then(()=>Xn=0),Xn=Date.now());function Ic(e,t){const n=r=>{if(!r._vts)r._vts=Date.now();else if(r._vts<=n.attached)return;xe(Lc(r,n.value),t,5,[r])};return n.value=e,n.attached=Fc(),n}function Lc(e,t){if(U(t)){const n=e.stopImmediatePropagation;return e.stopImmediatePropagation=()=>{n.call(e),e._stopped=!0},t.map(r=>s=>!s._stopped&&r&&r(s))}else return t}const Ps=/^on[a-z]/,Nc=(e,t,n,r,s=!1,o,i,l,c)=>{t==="class"?Cc(e,r,s):t==="style"?xc(e,n,r):zt(t)?yr(t)||Oc(e,t,n,r,i):(t[0]==="."?(t=t.slice(1),!0):t[0]==="^"?(t=t.slice(1),!1):Hc(e,t,r,s))?Sc(e,t,r,o,i,l,c):(t==="true-value"?e._trueValue=r:t==="false-value"&&(e._falseValue=r),Ac(e,t,r,s))};function Hc(e,t,n,r){return r?!!(t==="innerHTML"||t==="textContent"||t in e&&Ps.test(t)&&W(n)):t==="spellcheck"||t==="draggable"||t==="translate"||t==="form"||t==="list"&&e.tagName==="INPUT"||t==="type"&&e.tagName==="TEXTAREA"||Ps.test(t)&&ne(n)?!1:t in e}const Ms=e=>{const t=e.props["onUpdate:modelValue"]||!1;return U(t)?n=>hn(t,n):t};function $c(e){e.target.composing=!0}function Fs(e){const t=e.target;t.composing&&(t.composing=!1,t.dispatchEvent(new Event("input")))}const Qn=Symbol("_assign"),Xa={created(e,{modifiers:{lazy:t,trim:n,number:r}},s){e[Qn]=Ms(s);const o=r||s.props&&s.props.type==="number";gt(e,t?"change":"input",i=>{if(i.target.composing)return;let l=e.value;n&&(l=l.trim()),o&&(l=er(l)),e[Qn](l)}),n&&gt(e,"change",()=>{e.value=e.value.trim()}),t||(gt(e,"compositionstart",$c),gt(e,"compositionend",Fs),gt(e,"change",Fs))},mounted(e,{value:t}){e.value=t??""},beforeUpdate(e,{value:t,modifiers:{lazy:n,trim:r,number:s}},o){if(e[Qn]=Ms(o),e.composing||document.activeElement===e&&e.type!=="range"&&(n||r&&e.value.trim()===t||(s||e.type==="number")&&er(e.value)===t))return;const i=t??"";e.value!==i&&(e.value=i)}},jc=["ctrl","shift","alt","meta"],Dc={stop:e=>e.stopPropagation(),prevent:e=>e.preventDefault(),self:e=>e.target!==e.currentTarget,ctrl:e=>!e.ctrlKey,shift:e=>!e.shiftKey,alt:e=>!e.altKey,meta:e=>!e.metaKey,left:e=>"button"in e&&e.button!==0,middle:e=>"button"in e&&e.button!==1,right:e=>"button"in e&&e.button!==2,exact:(e,t)=>jc.some(n=>e[`${n}Key`]&&!t.includes(n))},Qa=(e,t)=>(n,...r)=>{for(let s=0;s<t.length;s++){const o=Dc[t[s]];if(o&&o(n,t))return}return e(n,...r)},Bc={esc:"escape",space:" ",up:"arrow-up",left:"arrow-left",right:"arrow-right",down:"arrow-down",delete:"backspace"},Za=(e,t)=>n=>{if(!("key"in n))return;const r=ft(n.key);if(t.some(s=>s===r||Bc[s]===r))return e(n)},zo=ue({patchProp:Nc},mc);let Dt,Is=!1;function kc(){return Dt||(Dt=Yl(zo))}function Uc(){return Dt=Is?Dt:Jl(zo),Is=!0,Dt}const Ga=(...e)=>{const t=kc().createApp(...e),{mount:n}=t;return t.mount=r=>{const s=Yo(r);if(!s)return;const o=t._component;!W(o)&&!o.render&&!o.template&&(o.template=s.innerHTML),s.innerHTML="";const i=n(s,!1,s instanceof SVGElement);return s instanceof Element&&(s.removeAttribute("v-cloak"),s.setAttribute("data-v-app","")),i},t},eu=(...e)=>{const t=Uc().createApp(...e),{mount:n}=t;return t.mount=r=>{const s=Yo(r);if(s)return n(s,!0,s instanceof SVGElement)},t};function Yo(e){return ne(e)?document.querySelector(e):e}const tu=(e,t)=>{const n=e.__vccOpts||e;for(const[r,s]of t)n[r]=s;return n},Kc="modulepreload",Wc=function(e){return"/"+e},Ls={},nu=function(t,n,r){if(!n||n.length===0)return t();const s=document.getElementsByTagName("link");return Promise.all(n.map(o=>{if(o=Wc(o),o in Ls)return;Ls[o]=!0;const i=o.endsWith(".css"),l=i?'[rel="stylesheet"]':"";if(!!r)for(let f=s.length-1;f>=0;f--){const h=s[f];if(h.href===o&&(!i||h.rel==="stylesheet"))return}else if(document.querySelector(`link[href="${o}"]${l}`))return;const a=document.createElement("link");if(a.rel=i?"stylesheet":Kc,i||(a.as="script",a.crossOrigin=""),a.href=o,document.head.appendChild(a),i)return new Promise((f,h)=>{a.addEventListener("load",f),a.addEventListener("error",()=>h(new Error(`Unable to preload CSS for ${o}`)))})})).then(()=>t()).catch(o=>{const i=new Event("vite:preloadError",{cancelable:!0});if(i.payload=o,window.dispatchEvent(i),!i.defaultPrevented)throw o})},Vc=window.__VP_SITE_DATA__;function kr(e){return Qs()?(Si(e),!0):!1}function Pe(e){return typeof e=="function"?e():Mr(e)}function ru(e,t){const n=(t==null?void 0:t.computedGetter)===!1?Mr:Pe;return function(...r){return ie(()=>e.apply(this,r.map(s=>n(s))))}}const Jo=typeof window<"u"&&typeof document<"u",qc=Object.prototype.toString,zc=e=>qc.call(e)==="[object Object]",Vt=()=>{},Ns=Yc();function Yc(){var e;return Jo&&((e=window==null?void 0:window.navigator)==null?void 0:e.userAgent)&&/iP(ad|hone|od)/.test(window.navigator.userAgent)}function Jc(e,t){function n(...r){return new Promise((s,o)=>{Promise.resolve(e(()=>t.apply(this,r),{fn:t,thisArg:this,args:r})).then(s).catch(o)})}return n}const Xo=e=>e();function Xc(e,t={}){let n,r,s=Vt;const o=l=>{clearTimeout(l),s(),s=Vt};return l=>{const c=Pe(e),a=Pe(t.maxWait);return n&&o(n),c<=0||a!==void 0&&a<=0?(r&&(o(r),r=null),Promise.resolve(l())):new Promise((f,h)=>{s=t.rejectOnCancel?h:f,a&&!r&&(r=setTimeout(()=>{n&&o(n),r=null,f(l())},a)),n=setTimeout(()=>{r&&o(r),r=null,f(l())},c)})}}function Qc(e=Xo){const t=ae(!0);function n(){t.value=!1}function r(){t.value=!0}const s=(...o)=>{t.value&&e(...o)};return{isActive:Mn(t),pause:n,resume:r,eventFilter:s}}function Qo(...e){if(e.length!==1)return nl(...e);const t=e[0];return typeof t=="function"?Mn(Gi(()=>({get:t,set:Vt}))):ae(t)}function Zo(e,t,n={}){const{eventFilter:r=Xo,...s}=n;return Xe(e,Jc(r,t),s)}function Zc(e,t,n={}){const{eventFilter:r,...s}=n,{eventFilter:o,pause:i,resume:l,isActive:c}=Qc(r);return{stop:Zo(e,t,{...s,eventFilter:o}),pause:i,resume:l,isActive:c}}function Gc(e,t=!0){Bn()?Rt(e):t?e():Fn(e)}function su(e,t,n={}){const{debounce:r=0,maxWait:s=void 0,...o}=n;return Zo(e,t,{...o,eventFilter:Xc(r,{maxWait:s})})}function ou(e,t,n){let r;ce(n)?r={evaluating:n}:r=n||{};const{lazy:s=!1,evaluating:o=void 0,shallow:i=!0,onError:l=Vt}=r,c=ae(!s),a=i?Pr(t):ae(t);let f=0;return Ir(async h=>{if(!c.value)return;f++;const m=f;let w=!1;o&&Promise.resolve().then(()=>{o.value=!0});try{const E=await e(T=>{h(()=>{o&&(o.value=!1),w||T()})});m===f&&(a.value=E)}catch(E){l(E)}finally{o&&m===f&&(o.value=!1),w=!0}}),s?ie(()=>(c.value=!0,a.value)):a}function Go(e){var t;const n=Pe(e);return(t=n==null?void 0:n.$el)!=null?t:n}const Be=Jo?window:void 0;function qt(...e){let t,n,r,s;if(typeof e[0]=="string"||Array.isArray(e[0])?([n,r,s]=e,t=Be):[t,n,r,s]=e,!t)return Vt;Array.isArray(n)||(n=[n]),Array.isArray(r)||(r=[r]);const o=[],i=()=>{o.forEach(f=>f()),o.length=0},l=(f,h,m,w)=>(f.addEventListener(h,m,w),()=>f.removeEventListener(h,m,w)),c=Xe(()=>[Go(t),Pe(s)],([f,h])=>{if(i(),!f)return;const m=zc(h)?{...h}:h;o.push(...n.flatMap(w=>r.map(E=>l(f,w,E,m))))},{immediate:!0,flush:"post"}),a=()=>{c(),i()};return kr(a),a}function ea(e){return typeof e=="function"?e:typeof e=="string"?t=>t.key===e:Array.isArray(e)?t=>e.includes(t.key):()=>!0}function iu(...e){let t,n,r={};e.length===3?(t=e[0],n=e[1],r=e[2]):e.length===2?typeof e[1]=="object"?(t=!0,n=e[0],r=e[1]):(t=e[0],n=e[1]):(t=!0,n=e[0]);const{target:s=Be,eventName:o="keydown",passive:i=!1,dedupe:l=!1}=r,c=ea(t);return qt(s,o,f=>{f.repeat&&Pe(l)||c(f)&&n(f)},i)}function ta(){const e=ae(!1);return Bn()&&Rt(()=>{e.value=!0}),e}function na(e){const t=ta();return ie(()=>(t.value,!!e()))}function ra(e,t={}){const{window:n=Be}=t,r=na(()=>n&&"matchMedia"in n&&typeof n.matchMedia=="function");let s;const o=ae(!1),i=a=>{o.value=a.matches},l=()=>{s&&("removeEventListener"in s?s.removeEventListener("change",i):s.removeListener(i))},c=Ir(()=>{r.value&&(l(),s=n.matchMedia(Pe(e)),"addEventListener"in s?s.addEventListener("change",i):s.addListener(i),o.value=s.matches)});return kr(()=>{c(),l(),s=void 0}),o}const an=typeof globalThis<"u"?globalThis:typeof window<"u"?window:typeof global<"u"?global:typeof self<"u"?self:{},un="__vueuse_ssr_handlers__",sa=oa();function oa(){return un in an||(an[un]=an[un]||{}),an[un]}function ei(e,t){return sa[e]||t}function ia(e){return e==null?"any":e instanceof Set?"set":e instanceof Map?"map":e instanceof Date?"date":typeof e=="boolean"?"boolean":typeof e=="string"?"string":typeof e=="object"?"object":Number.isNaN(e)?"any":"number"}const la={boolean:{read:e=>e==="true",write:e=>String(e)},object:{read:e=>JSON.parse(e),write:e=>JSON.stringify(e)},number:{read:e=>Number.parseFloat(e),write:e=>String(e)},any:{read:e=>e,write:e=>String(e)},string:{read:e=>e,write:e=>String(e)},map:{read:e=>new Map(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e.entries()))},set:{read:e=>new Set(JSON.parse(e)),write:e=>JSON.stringify(Array.from(e))},date:{read:e=>new Date(e),write:e=>e.toISOString()}},Hs="vueuse-storage";function Ur(e,t,n,r={}){var s;const{flush:o="pre",deep:i=!0,listenToStorageChanges:l=!0,writeDefaults:c=!0,mergeDefaults:a=!1,shallow:f,window:h=Be,eventFilter:m,onError:w=v=>{console.error(v)}}=r,E=(f?Pr:ae)(t);if(!n)try{n=ei("getDefaultStorage",()=>{var v;return(v=Be)==null?void 0:v.localStorage})()}catch(v){w(v)}if(!n)return E;const T=Pe(t),L=ia(T),B=(s=r.serializer)!=null?s:la[L],{pause:k,resume:y}=Zc(E,()=>p(E.value),{flush:o,deep:i,eventFilter:m});return h&&l&&(qt(h,"storage",N),qt(h,Hs,K)),N(),E;function p(v){try{if(v==null)n.removeItem(e);else{const M=B.write(v),R=n.getItem(e);R!==M&&(n.setItem(e,M),h&&h.dispatchEvent(new CustomEvent(Hs,{detail:{key:e,oldValue:R,newValue:M,storageArea:n}})))}}catch(M){w(M)}}function F(v){const M=v?v.newValue:n.getItem(e);if(M==null)return c&&T!==null&&n.setItem(e,B.write(T)),T;if(!v&&a){const R=B.read(M);return typeof a=="function"?a(R,T):L==="object"&&!Array.isArray(R)?{...T,...R}:R}else return typeof M!="string"?M:B.read(M)}function K(v){N(v.detail)}function N(v){if(!(v&&v.storageArea!==n)){if(v&&v.key==null){E.value=T;return}if(!(v&&v.key!==e)){k();try{(v==null?void 0:v.newValue)!==B.write(E.value)&&(E.value=F(v))}catch(M){w(M)}finally{v?Fn(y):y()}}}}}function ca(e){return ra("(prefers-color-scheme: dark)",e)}function aa(e={}){const{selector:t="html",attribute:n="class",initialValue:r="auto",window:s=Be,storage:o,storageKey:i="vueuse-color-scheme",listenToStorageChanges:l=!0,storageRef:c,emitAuto:a,disableTransition:f=!0}=e,h={auto:"",light:"light",dark:"dark",...e.modes||{}},m=ca({window:s}),w=ie(()=>m.value?"dark":"light"),E=c||(i==null?Qo(r):Ur(i,r,o,{window:s,listenToStorageChanges:l})),T=ie(()=>E.value==="auto"?w.value:E.value),L=ei("updateHTMLAttrs",(p,F,K)=>{const N=typeof p=="string"?s==null?void 0:s.document.querySelector(p):Go(p);if(!N)return;let v;if(f){v=s.document.createElement("style");const M="*,*::before,*::after{-webkit-transition:none!important;-moz-transition:none!important;-o-transition:none!important;-ms-transition:none!important;transition:none!important}";v.appendChild(document.createTextNode(M)),s.document.head.appendChild(v)}if(F==="class"){const M=K.split(/\s/g);Object.values(h).flatMap(R=>(R||"").split(/\s/g)).filter(Boolean).forEach(R=>{M.includes(R)?N.classList.add(R):N.classList.remove(R)})}else N.setAttribute(F,K);f&&(s.getComputedStyle(v).opacity,document.head.removeChild(v))});function B(p){var F;L(t,n,(F=h[p])!=null?F:p)}function k(p){e.onChanged?e.onChanged(p,B):B(p)}Xe(T,k,{flush:"post",immediate:!0}),Gc(()=>k(T.value));const y=ie({get(){return a?E.value:T.value},set(p){E.value=p}});try{return Object.assign(y,{store:E,system:w,state:T})}catch{return y}}function ua(e={}){const{valueDark:t="dark",valueLight:n=""}=e,r=aa({...e,onChanged:(o,i)=>{var l;e.onChanged?(l=e.onChanged)==null||l.call(e,o==="dark",i,o):i(o)},modes:{dark:t,light:n}});return ie({get(){return r.value==="dark"},set(o){const i=o?"dark":"light";r.system.value===i?r.value="auto":r.value=i}})}function Zn(e){return typeof Window<"u"&&e instanceof Window?e.document.documentElement:typeof Document<"u"&&e instanceof Document?e.documentElement:e}function lu(e,t,n={}){const{window:r=Be}=n;return Ur(e,t,r==null?void 0:r.localStorage,n)}function ti(e){const t=window.getComputedStyle(e);if(t.overflowX==="scroll"||t.overflowY==="scroll"||t.overflowX==="auto"&&e.clientWidth<e.scrollWidth||t.overflowY==="auto"&&e.clientHeight<e.scrollHeight)return!0;{const n=e.parentNode;return!n||n.tagName==="BODY"?!1:ti(n)}}function fa(e){const t=e||window.event,n=t.target;return ti(n)?!1:t.touches.length>1?!0:(t.preventDefault&&t.preventDefault(),!1)}function cu(e,t=!1){const n=ae(t);let r=null,s;Xe(Qo(e),l=>{const c=Zn(Pe(l));if(c){const a=c;s=a.style.overflow,n.value&&(a.style.overflow="hidden")}},{immediate:!0});const o=()=>{const l=Zn(Pe(e));!l||n.value||(Ns&&(r=qt(l,"touchmove",c=>{fa(c)},{passive:!1})),l.style.overflow="hidden",n.value=!0)},i=()=>{const l=Zn(Pe(e));!l||!n.value||(Ns&&(r==null||r()),l.style.overflow=s,n.value=!1)};return kr(i),ie({get(){return n.value},set(l){l?o():i()}})}function au(e,t,n={}){const{window:r=Be}=n;return Ur(e,t,r==null?void 0:r.sessionStorage,n)}function uu(e={}){const{window:t=Be}=e;if(!t)return{x:ae(0),y:ae(0)};const n=ae(t.scrollX),r=ae(t.scrollY);return qt(t,"scroll",()=>{n.value=t.scrollX,r.value=t.scrollY},{capture:!1,passive:!0}),{x:n,y:r}}const ni=/^[a-z]+:/i,da="vitepress-theme-appearance",ri=/#.*$/,ha=/(index)?\.(md|html)$/,Ee=typeof document<"u",si={relativePath:"",filePath:"",title:"404",description:"Not Found",headers:[],frontmatter:{sidebar:!1,layout:"page"},lastUpdated:0,isNotFound:!0};function pa(e,t,n=!1){if(t===void 0)return!1;if(e=$s(`/${e}`),n)return new RegExp(t).test(e);if($s(t)!==e)return!1;const r=t.match(ri);return r?(Ee?location.hash:"")===r[0]:!0}function $s(e){return decodeURI(e).replace(ri,"").replace(ha,"")}function ga(e){return ni.test(e)}function ma(e,t){var r,s,o,i,l,c,a;const n=Object.keys(e.locales).find(f=>f!=="root"&&!ga(f)&&pa(t,`/${f}/`,!0))||"root";return Object.assign({},e,{localeIndex:n,lang:((r=e.locales[n])==null?void 0:r.lang)??e.lang,dir:((s=e.locales[n])==null?void 0:s.dir)??e.dir,title:((o=e.locales[n])==null?void 0:o.title)??e.title,titleTemplate:((i=e.locales[n])==null?void 0:i.titleTemplate)??e.titleTemplate,description:((l=e.locales[n])==null?void 0:l.description)??e.description,head:ii(e.head,((c=e.locales[n])==null?void 0:c.head)??[]),themeConfig:{...e.themeConfig,...(a=e.locales[n])==null?void 0:a.themeConfig}})}function oi(e,t){const n=t.title||e.title,r=t.titleTemplate??e.titleTemplate;if(typeof r=="string"&&r.includes(":title"))return r.replace(/:title/g,n);const s=ya(e.title,r);return`${n}${s}`}function ya(e,t){return t===!1?"":t===!0||t===void 0?` | ${e}`:e===t?"":` | ${t}`}function _a(e,t){const[n,r]=t;if(n!=="meta")return!1;const s=Object.entries(r)[0];return s==null?!1:e.some(([o,i])=>o===n&&i[s[0]]===s[1])}function ii(e,t){return[...e.filter(n=>!_a(t,n)),...t]}const ba=/[\u0000-\u001F"#$&*+,:;<=>?[\]^`{|}\u007F]/g,va=/^[a-z]:/i;function js(e){const t=va.exec(e),n=t?t[0]:"";return n+e.slice(n.length).replace(ba,"_").replace(/(^|\/)_+(?=[^/]*$)/,"$1")}const wa=Symbol(),at=Pr(Vc);function fu(e){const t=ie(()=>ma(at.value,e.data.relativePath)),n=t.value.appearance,r=n==="force-dark"?ae(!0):n?ua({storageKey:da,initialValue:()=>typeof n=="string"?n:"auto",...typeof n=="object"?n:{}}):ae(!1);return{site:t,theme:ie(()=>t.value.themeConfig),page:ie(()=>e.data),frontmatter:ie(()=>e.data.frontmatter),params:ie(()=>e.data.params),lang:ie(()=>t.value.lang),dir:ie(()=>t.value.dir),localeIndex:ie(()=>t.value.localeIndex||"root"),title:ie(()=>oi(t.value,e.data)),description:ie(()=>e.data.description||t.value.description),isDark:r}}function Ca(){const e=wt(wa);if(!e)throw new Error("vitepress data not properly injected in app");return e}function Ea(e,t){return`${e}${t}`.replace(/\/+/g,"/")}function Ds(e){return ni.test(e)||!e.startsWith("/")?e:Ea(at.value.base,e)}function xa(e){let t=e.replace(/\.html$/,"");if(t=decodeURIComponent(t),t=t.replace(/\/$/,"/index"),Ee){const n="/";t=js(t.slice(n.length).replace(/\//g,"_")||"index")+".md";let r=__VP_HASH_MAP__[t.toLowerCase()];if(r||(t=t.endsWith("_index.md")?t.slice(0,-9)+".md":t.slice(0,-3)+"_index.md",r=__VP_HASH_MAP__[t.toLowerCase()]),!r)return null;t=`${n}assets/${t}.${r}.js`}else t=`./${js(t.slice(1).replace(/\//g,"_"))}.md.js`;return t}let gn=[];function du(e){gn.push(e),jn(()=>{gn=gn.filter(t=>t!==e)})}const Ta=Symbol(),li="http://a.com",Aa=()=>({path:"/",component:null,data:si});function hu(e,t){const n=Pn(Aa()),r={route:n,go:s};async function s(l=Ee?location.href:"/"){var c,a;l=gr(l),await((c=r.onBeforeRouteChange)==null?void 0:c.call(r,l))!==!1&&(Us(l),await i(l),await((a=r.onAfterRouteChanged)==null?void 0:a.call(r,l)))}let o=null;async function i(l,c=0,a=!1){var m;if(await((m=r.onBeforePageLoad)==null?void 0:m.call(r,l))===!1)return;const f=new URL(l,li),h=o=f.pathname;try{let w=await e(h);if(!w)throw new Error(`Page not found: ${h}`);if(o===h){o=null;const{default:E,__pageData:T}=w;if(!E)throw new Error(`Invalid route component: ${E}`);n.path=Ee?h:Ds(h),n.component=Lt(E),n.data=Lt(T),Ee&&Fn(()=>{let L=at.value.base+T.relativePath.replace(/(?:(^|\/)index)?\.md$/,"$1");if(!at.value.cleanUrls&&!L.endsWith("/")&&(L+=".html"),L!==f.pathname&&(f.pathname=L,l=L+f.search+f.hash,history.replaceState(null,"",l)),f.hash&&!c){let B=null;try{B=document.getElementById(decodeURIComponent(f.hash).slice(1))}catch(k){console.warn(k)}if(B){Bs(B,f.hash);return}}window.scrollTo(0,c)})}}catch(w){if(!/fetch|Page not found/.test(w.message)&&!/^\/404(\.html|\/)?$/.test(l)&&console.error(w),!a)try{const E=await fetch(at.value.base+"hashmap.json");window.__VP_HASH_MAP__=await E.json(),await i(l,c,!0);return}catch{}o===h&&(o=null,n.path=Ee?h:Ds(h),n.component=t?Lt(t):null,n.data=si)}}return Ee&&(window.addEventListener("click",l=>{if(l.target.closest("button"))return;const a=l.target.closest("a");if(a&&!a.closest(".vp-raw")&&(a instanceof SVGElement||!a.download)){const{target:f}=a,{href:h,origin:m,pathname:w,hash:E,search:T}=new URL(a.href instanceof SVGAnimatedString?a.href.animVal:a.href,a.baseURI),L=window.location,B=w.match(/\.\w+$/);!l.ctrlKey&&!l.shiftKey&&!l.altKey&&!l.metaKey&&!f&&m===L.origin&&!(B&&B[0]!==".html")&&(l.preventDefault(),w===L.pathname&&T===L.search?(E!==L.hash&&(history.pushState(null,"",E),window.dispatchEvent(new Event("hashchange"))),E?Bs(a,E,a.classList.contains("header-anchor")):(Us(h),window.scrollTo(0,0))):s(h))}},{capture:!0}),window.addEventListener("popstate",l=>{i(gr(location.href),l.state&&l.state.scrollPosition||0)}),window.addEventListener("hashchange",l=>{l.preventDefault()})),r}function Sa(){const e=wt(Ta);if(!e)throw new Error("useRouter() is called without provider.");return e}function ci(){return Sa().route}function Bs(e,t,n=!1){let r=null;try{r=e.classList.contains("header-anchor")?e:document.getElementById(decodeURIComponent(t).slice(1))}catch(s){console.warn(s)}if(r){let a=function(){!n||Math.abs(c-window.scrollY)>window.innerHeight?window.scrollTo(0,c):window.scrollTo({left:0,top:c,behavior:"smooth"})},s=at.value.scrollOffset,o=0,i=24;if(typeof s=="object"&&"padding"in s&&(i=s.padding,s=s.selector),typeof s=="number")o=s;else if(typeof s=="string")o=ks(s,i);else if(Array.isArray(s))for(const f of s){const h=ks(f,i);if(h){o=h;break}}const l=parseInt(window.getComputedStyle(r).paddingTop,10),c=window.scrollY+r.getBoundingClientRect().top-o+l;requestAnimationFrame(a)}}function ks(e,t){const n=document.querySelector(e);if(!n)return 0;const r=n.getBoundingClientRect().bottom;return r<0?0:r+t}function Us(e){Ee&&e!==gr(location.href)&&(history.replaceState({scrollPosition:window.scrollY},document.title),history.pushState(null,"",e))}function gr(e){const t=new URL(e,li);return t.pathname=t.pathname.replace(/(^|\/)index(\.html)?$/,"$1"),at.value.cleanUrls?t.pathname=t.pathname.replace(/\.html$/,""):!t.pathname.endsWith("/")&&!t.pathname.endsWith(".html")&&(t.pathname+=".html"),t.pathname+t.search+t.hash}const Ks=()=>gn.forEach(e=>e()),pu=Lr({name:"VitePressContent",props:{as:{type:[Object,String],default:"div"}},setup(e){const t=ci(),{site:n}=Ca();return()=>hr(e.as,n.value.contentProps??{style:{position:"relative"}},[t.component?hr(t.component,{onVnodeMounted:Ks,onVnodeUpdated:Ks}):"404 Page Not Found"])}}),gu=Lr({setup(e,{slots:t}){const n=ae(!1);return Rt(()=>{n.value=!0}),()=>n.value&&t.default?t.default():null}});function mu(){Ee&&window.addEventListener("click",e=>{var n;const t=e.target;if(t.matches(".vp-code-group input")){const r=(n=t.parentElement)==null?void 0:n.parentElement;if(!r)return;const s=Array.from(r.querySelectorAll("input")).indexOf(t);if(s<0)return;const o=r.querySelector(".blocks");if(!o)return;const i=Array.from(o.children).find(a=>a.classList.contains("active"));if(!i)return;const l=o.children[s];if(!l||i===l)return;i.classList.remove("active"),l.classList.add("active");const c=r==null?void 0:r.querySelector(`label[for="${t.id}"]`);c==null||c.scrollIntoView({block:"nearest"})}})}function yu(){if(Ee){const e=new WeakMap;window.addEventListener("click",t=>{var r;const n=t.target;if(n.matches('div[class*="language-"] > button.copy')){const s=n.parentElement,o=(r=n.nextElementSibling)==null?void 0:r.nextElementSibling;if(!s||!o)return;const i=/language-(shellscript|shell|bash|sh|zsh)/.test(s.className);let l="";o.querySelectorAll("span.line:not(.diff.remove)").forEach(c=>l+=(c.textContent||"")+`
 `),l=l.slice(0,-1),i&&(l=l.replace(/^ *(\$|>) /gm,"").trim()),Ra(l).then(()=>{n.classList.add("copied"),clearTimeout(e.get(n));const c=setTimeout(()=>{n.classList.remove("copied"),n.blur(),e.delete(n)},2e3);e.set(n,c)})}})}}async function Ra(e){try{return navigator.clipboard.writeText(e)}catch{const t=document.createElement("textarea"),n=document.activeElement;t.value=e,t.setAttribute("readonly",""),t.style.contain="strict",t.style.position="absolute",t.style.left="-9999px",t.style.fontSize="12pt";const r=document.getSelection(),s=r?r.rangeCount>0&&r.getRangeAt(0):null;document.body.appendChild(t),t.select(),t.selectionStart=0,t.selectionEnd=e.length,document.execCommand("copy"),document.body.removeChild(t),s&&(r.removeAllRanges(),r.addRange(s)),n&&n.focus()}}function _u(e,t){let n=[],r=!0;const s=o=>{if(r){r=!1;return}const i=o.map(Ws);n.forEach((l,c)=>{const a=i.findIndex(f=>f==null?void 0:f.isEqualNode(l??null));a!==-1?delete i[a]:(l==null||l.remove(),delete n[c])}),i.forEach(l=>l&&document.head.appendChild(l)),n=[...n,...i].filter(Boolean)};Ir(()=>{const o=e.data,i=t.value,l=o&&o.description,c=o&&o.frontmatter.head||[],a=oi(i,o);a!==document.title&&(document.title=a);const f=l||i.description;let h=document.querySelector("meta[name=description]");h?h.getAttribute("content")!==f&&h.setAttribute("content",f):Ws(["meta",{name:"description",content:f}]),s(ii(i.head,Pa(c)))})}function Ws([e,t,n]){const r=document.createElement(e);for(const s in t)r.setAttribute(s,t[s]);return n&&(r.innerHTML=n),e==="script"&&!t.async&&(r.async=!1),r}function Oa(e){return e[0]==="meta"&&e[1]&&e[1].name==="description"}function Pa(e){return e.filter(t=>!Oa(t))}const Gn=new Set,ai=()=>document.createElement("link"),Ma=e=>{const t=ai();t.rel="prefetch",t.href=e,document.head.appendChild(t)},Fa=e=>{const t=new XMLHttpRequest;t.open("GET",e,t.withCredentials=!0),t.send()};let fn;const Ia=Ee&&(fn=ai())&&fn.relList&&fn.relList.supports&&fn.relList.supports("prefetch")?Ma:Fa;function bu(){if(!Ee||!window.IntersectionObserver)return;let e;if((e=navigator.connection)&&(e.saveData||/2g/.test(e.effectiveType)))return;const t=window.requestIdleCallback||setTimeout;let n=null;const r=()=>{n&&n.disconnect(),n=new IntersectionObserver(o=>{o.forEach(i=>{if(i.isIntersecting){const l=i.target;n.unobserve(l);const{pathname:c}=l;if(!Gn.has(c)){Gn.add(c);const a=xa(c);a&&Ia(a)}}})}),t(()=>{document.querySelectorAll("#app a").forEach(o=>{const{hostname:i,pathname:l}=new URL(o.href instanceof SVGAnimatedString?o.href.animVal:o.href,o.baseURI),c=l.match(/\.\w+$/);c&&c[0]!==".html"||o.target!=="_blank"&&i===location.hostname&&(l!==location.pathname?n.observe(o):Gn.add(l))})})};Rt(r);const s=ci();Xe(()=>s.path,r),jn(()=>{n&&n.disconnect()})}export{Za as $,$a as A,Sl as B,Ba as C,Ua as D,Pr as E,me as F,du as G,re as H,ka as I,ni as J,ci as K,rc as L,wt as M,vr as N,Fn as O,uu as P,Ya as Q,Mn as R,ru as S,Vo as T,nl as U,iu as V,Da as W,nu as X,cu as Y,kl as Z,tu as _,ko as a,Wa as a0,Qa as a1,Va as a2,_u as a3,Ta as a4,fu as a5,wa as a6,pu as a7,gu as a8,at as a9,eu as aa,hu as ab,xa as ac,bu as ad,yu as ae,mu as af,hr as ag,Go as ah,kr as ai,ou as aj,au as ak,lu as al,su as am,Sa as an,qt as ao,Co as ap,ja as aq,Xa as ar,ce as as,qa as at,Lt as au,Ga as av,jo as b,za as c,Lr as d,Ja as e,Ds as f,ie as g,ae as h,ga as i,Rt as j,Bo as k,Mr as l,Ha as m,wr as n,Ho as o,Na as p,pa as q,Ka as r,Ee as s,La as t,Ca as u,ra as v,dl as w,Xe as x,Ir as y,jn as z};
diff --git a/assets/chunks/mutationObserver.46371927.js b/assets/chunks/mutationObserver.46371927.js
new file mode 100644
index 0000000..3d36053
--- /dev/null
+++ b/assets/chunks/mutationObserver.46371927.js
@@ -0,0 +1 @@
+const s="/assets/images/mutationObserver.png";export{s as _};
diff --git a/assets/chunks/mutationObserver.a5873c86.js b/assets/chunks/mutationObserver.a5873c86.js
deleted file mode 100644
index f4ee663..0000000
--- a/assets/chunks/mutationObserver.a5873c86.js
+++ /dev/null
@@ -1 +0,0 @@
-const s="/learning-docs2/assets/images/mutationObserver.png";export{s as _};
diff --git a/assets/chunks/theme.668a0457.js b/assets/chunks/theme.c533df5a.js
similarity index 99%
rename from assets/chunks/theme.668a0457.js
rename to assets/chunks/theme.c533df5a.js
index fe30e50..d9d931c 100644
--- a/assets/chunks/theme.668a0457.js
+++ b/assets/chunks/theme.c533df5a.js
@@ -1 +1 @@
-import{d as b,o as a,c as i,r as u,n as T,a as x,t as L,_ as m,b as $,w as v,T as ce,e as f,u as ze,i as De,f as ue,g as k,h as M,j as G,k as c,l,p as H,m as z,q as O,s as q,v as re,x as U,y as te,z as de,A as Ve,B as Ee,C as j,F as N,D as A,E as _e,G as Y,H as h,I as F,J as we,K as se,L as Z,M as ne,N as Fe,O as Oe,P as Le,Q as Ge,R as Ue,S as je,U as Ke,V as ke,W as Re,X as qe,Y as Se,Z as Me,$ as We,a0 as Ye,a1 as Je,a2 as Xe}from"./framework.7c0fadea.js";const Ze=b({__name:"VPBadge",props:{text:{},type:{default:"tip"}},setup(s){return(e,t)=>(a(),i("span",{class:T(["VPBadge",e.type])},[u(e.$slots,"default",{},()=>[x(L(e.text),1)],!0)],2))}});const Qe=m(Ze,[["__scopeId","data-v-9613cc9f"]]),et={key:0,class:"VPBackdrop"},tt=b({__name:"VPBackdrop",props:{show:{type:Boolean}},setup(s){return(e,t)=>(a(),$(ce,{name:"fade"},{default:v(()=>[e.show?(a(),i("div",et)):f("",!0)]),_:1}))}});const st=m(tt,[["__scopeId","data-v-c79a1216"]]),P=ze;function nt(s,e){let t,n=!1;return()=>{t&&clearTimeout(t),n?t=setTimeout(s,e):(s(),(n=!0)&&setTimeout(()=>n=!1,e))}}function le(s){return/^\//.test(s)?s:`/${s}`}function J(s){const{pathname:e,search:t,hash:n,protocol:o}=new URL(s,"http://a.com");if(De(s)||s.startsWith("#")||!o.startsWith("http")||/\.(?!html|md)\w+($|\?)/i.test(s))return s;const{site:r}=P(),d=e.endsWith("/")||e.endsWith(".html")?s:s.replace(/(?:(^\.+)\/)?.*$/,`$1${e.replace(/(\.md)?$/,r.value.cleanUrls?"":".html")}${t}${n}`);return ue(d)}function X({removeCurrent:s=!0,correspondingLink:e=!1}={}){const{site:t,localeIndex:n,page:o,theme:r}=P(),d=k(()=>{var _,g;return{label:(_=t.value.locales[n.value])==null?void 0:_.label,link:((g=t.value.locales[n.value])==null?void 0:g.link)||(n.value==="root"?"/":`/${n.value}/`)}});return{localeLinks:k(()=>Object.entries(t.value.locales).flatMap(([_,g])=>s&&d.value.label===g.label?[]:{text:g.label,link:ot(g.link||(_==="root"?"/":`/${_}/`),r.value.i18nRouting!==!1&&e,o.value.relativePath.slice(d.value.link.length-1),!t.value.cleanUrls)})),currentLang:d}}function ot(s,e,t,n){return e?s.replace(/\/$/,"")+le(t.replace(/(^|\/)index\.md$/,"$1").replace(/\.md$/,n?".html":"")):s}const at=s=>(H("data-v-f87ff6e4"),s=s(),z(),s),rt={class:"NotFound"},lt={class:"code"},it={class:"title"},ct=at(()=>c("div",{class:"divider"},null,-1)),ut={class:"quote"},dt={class:"action"},_t=["href","aria-label"],vt=b({__name:"NotFound",setup(s){const{site:e,theme:t}=P(),{localeLinks:n}=X({removeCurrent:!1}),o=M("/");return G(()=>{var d;const r=window.location.pathname.replace(e.value.base,"").replace(/(^.*?\/).*$/,"/$1");n.value.length&&(o.value=((d=n.value.find(({link:p})=>p.startsWith(r)))==null?void 0:d.link)||n.value[0].link)}),(r,d)=>{var p,_,g,V,y;return a(),i("div",rt,[c("p",lt,L(((p=l(t).notFound)==null?void 0:p.code)??"404"),1),c("h1",it,L(((_=l(t).notFound)==null?void 0:_.title)??"PAGE NOT FOUND"),1),ct,c("blockquote",ut,L(((g=l(t).notFound)==null?void 0:g.quote)??"But if you don't change your direction, and if you keep looking, you may end up where you are heading."),1),c("div",dt,[c("a",{class:"link",href:l(ue)(o.value),"aria-label":((V=l(t).notFound)==null?void 0:V.linkLabel)??"go to home"},L(((y=l(t).notFound)==null?void 0:y.linkText)??"Take me home"),9,_t)])])}}});const pt=m(vt,[["__scopeId","data-v-f87ff6e4"]]);function Ne(s,e){if(Array.isArray(s))return Q(s);if(s==null)return[];e=le(e);const t=Object.keys(s).sort((o,r)=>r.split("/").length-o.split("/").length).find(o=>e.startsWith(le(o))),n=t?s[t]:[];return Array.isArray(n)?Q(n):Q(n.items,n.base)}function ht(s){const e=[];let t=0;for(const n in s){const o=s[n];if(o.items){t=e.push(o);continue}e[t]||e.push({items:[]}),e[t].items.push(o)}return e}function ft(s){const e=[];function t(n){for(const o of n)o.text&&o.link&&e.push({text:o.text,link:o.link,docFooterText:o.docFooterText}),o.items&&t(o.items)}return t(s),e}function ie(s,e){return Array.isArray(e)?e.some(t=>ie(s,t)):O(s,e.link)?!0:e.items?ie(s,e.items):!1}function Q(s,e){return[...s].map(t=>{const n={...t},o=n.base||e;return o&&n.link&&(n.link=o+n.link),n.items&&(n.items=Q(n.items,o)),n})}function D(){const{frontmatter:s,page:e,theme:t}=P(),n=re("(min-width: 960px)"),o=M(!1),r=k(()=>{const B=t.value.sidebar,w=e.value.relativePath;return B?Ne(B,w):[]}),d=M(r.value);U(r,(B,w)=>{JSON.stringify(B)!==JSON.stringify(w)&&(d.value=r.value)});const p=k(()=>s.value.sidebar!==!1&&d.value.length>0&&s.value.layout!=="home"),_=k(()=>g?s.value.aside==null?t.value.aside==="left":s.value.aside==="left":!1),g=k(()=>s.value.layout==="home"?!1:s.value.aside!=null?!!s.value.aside:t.value.aside!==!1),V=k(()=>p.value&&n.value),y=k(()=>p.value?ht(d.value):[]);function I(){o.value=!0}function S(){o.value=!1}function C(){o.value?S():I()}return{isOpen:o,sidebar:d,sidebarGroups:y,hasSidebar:p,hasAside:g,leftAside:_,isSidebarEnabled:V,open:I,close:S,toggle:C}}function mt(s,e){let t;te(()=>{t=s.value?document.activeElement:void 0}),G(()=>{window.addEventListener("keyup",n)}),de(()=>{window.removeEventListener("keyup",n)});function n(o){o.key==="Escape"&&s.value&&(e(),t==null||t.focus())}}const Ie=M(q?location.hash:"");q&&window.addEventListener("hashchange",()=>{Ie.value=location.hash});function gt(s){const{page:e}=P(),t=M(!1),n=k(()=>s.value.collapsed!=null),o=k(()=>!!s.value.link),r=M(!1),d=()=>{r.value=O(e.value.relativePath,s.value.link)};U([e,s,Ie],d),G(d);const p=k(()=>r.value?!0:s.value.items?ie(e.value.relativePath,s.value.items):!1),_=k(()=>!!(s.value.items&&s.value.items.length));te(()=>{t.value=!!(n.value&&s.value.collapsed)}),Ve(()=>{(r.value||p.value)&&(t.value=!1)});function g(){n.value&&(t.value=!t.value)}return{collapsed:t,collapsible:n,isLink:o,isActiveLink:r,hasActiveLink:p,hasChildren:_,toggle:g}}function bt(){const{hasSidebar:s}=D(),e=re("(min-width: 960px)"),t=re("(min-width: 1280px)");return{isAsideEnabled:k(()=>!t.value&&!e.value?!1:s.value?t.value:e.value)}}const $t=71;function ve(s){return typeof s.outline=="object"&&!Array.isArray(s.outline)&&s.outline.label||s.outlineTitle||"On this page"}function pe(s){const e=[...document.querySelectorAll(".VPDoc :where(h1,h2,h3,h4,h5,h6)")].filter(t=>t.id&&t.hasChildNodes()).map(t=>{const n=Number(t.tagName[1]);return{title:kt(t),link:"#"+t.id,level:n}});return yt(e,s)}function kt(s){let e="";for(const t of s.childNodes)if(t.nodeType===1){if(t.classList.contains("VPBadge")||t.classList.contains("header-anchor"))continue;e+=t.textContent}else t.nodeType===3&&(e+=t.textContent);return e.trim()}function yt(s,e){if(e===!1)return[];const t=(typeof e=="object"&&!Array.isArray(e)?e.level:e)||2,[n,o]=typeof t=="number"?[t,t]:t==="deep"?[2,6]:t;s=s.filter(d=>d.level>=n&&d.level<=o);const r=[];e:for(let d=0;d<s.length;d++){const p=s[d];if(d===0)r.push(p);else{for(let _=d-1;_>=0;_--){const g=s[_];if(g.level<p.level){(g.children||(g.children=[])).push(p);continue e}}r.push(p)}}return r}function Pt(s,e){const{isAsideEnabled:t}=bt(),n=nt(r,100);let o=null;G(()=>{requestAnimationFrame(r),window.addEventListener("scroll",n)}),Ee(()=>{d(location.hash)}),de(()=>{window.removeEventListener("scroll",n)});function r(){if(!t.value)return;const p=[].slice.call(s.value.querySelectorAll(".outline-link")),_=[].slice.call(document.querySelectorAll(".content .header-anchor")).filter(S=>p.some(C=>C.hash===S.hash&&S.offsetParent!==null)),g=window.scrollY,V=window.innerHeight,y=document.body.offsetHeight,I=Math.abs(g+V-y)<1;if(_.length&&I){d(_[_.length-1].hash);return}for(let S=0;S<_.length;S++){const C=_[S],B=_[S+1],[w,K]=Vt(S,C,B);if(w){d(K);return}}}function d(p){o&&o.classList.remove("active"),p==null?o=null:o=s.value.querySelector(`a[href="${decodeURIComponent(p)}"]`);const _=o;_?(_.classList.add("active"),e.value.style.top=_.offsetTop+33+"px",e.value.style.opacity="1"):(e.value.style.top="33px",e.value.style.opacity="0")}}function ye(s){return s.parentElement.offsetTop-$t}function Vt(s,e,t){const n=window.scrollY;return s===0&&n===0?[!0,null]:n<ye(e)?[!1,null]:!t||n<ye(t)?[!0,e.hash]:[!1,null]}const wt=["href","title"],Lt=b({__name:"VPDocOutlineItem",props:{headers:{},root:{type:Boolean}},setup(s){function e({target:t}){const n=t.href.split("#")[1],o=document.getElementById(decodeURIComponent(n));o==null||o.focus({preventScroll:!0})}return(t,n)=>{const o=j("VPDocOutlineItem",!0);return a(),i("ul",{class:T(t.root?"root":"nested")},[(a(!0),i(N,null,A(t.headers,({children:r,link:d,title:p})=>(a(),i("li",null,[c("a",{class:"outline-link",href:d,onClick:e,title:p},L(p),9,wt),r!=null&&r.length?(a(),$(o,{key:0,headers:r},null,8,["headers"])):f("",!0)]))),256))],2)}}});const he=m(Lt,[["__scopeId","data-v-d0ee3533"]]),St=s=>(H("data-v-d330b1bb"),s=s(),z(),s),Mt={class:"content"},Nt={class:"outline-title",role:"heading","aria-level":"2"},It={"aria-labelledby":"doc-outline-aria-label"},Tt=St(()=>c("span",{class:"visually-hidden",id:"doc-outline-aria-label"}," Table of Contents for current page ",-1)),Ct=b({__name:"VPDocAsideOutline",setup(s){const{frontmatter:e,theme:t}=P(),n=_e([]);Y(()=>{n.value=pe(e.value.outline??t.value.outline)});const o=M(),r=M();return Pt(o,r),(d,p)=>(a(),i("div",{class:T(["VPDocAsideOutline",{"has-outline":n.value.length>0}]),ref_key:"container",ref:o,role:"navigation"},[c("div",Mt,[c("div",{class:"outline-marker",ref_key:"marker",ref:r},null,512),c("div",Nt,L(l(ve)(l(t))),1),c("nav",It,[Tt,h(he,{headers:n.value,root:!0},null,8,["headers"])])])],2))}});const Bt=m(Ct,[["__scopeId","data-v-d330b1bb"]]),At={class:"VPDocAsideCarbonAds"},xt=b({__name:"VPDocAsideCarbonAds",props:{carbonAds:{}},setup(s){const e=()=>null;return(t,n)=>(a(),i("div",At,[h(l(e),{"carbon-ads":t.carbonAds},null,8,["carbon-ads"])]))}}),Ht=s=>(H("data-v-3f215769"),s=s(),z(),s),zt={class:"VPDocAside"},Dt=Ht(()=>c("div",{class:"spacer"},null,-1)),Et=b({__name:"VPDocAside",setup(s){const{theme:e}=P();return(t,n)=>(a(),i("div",zt,[u(t.$slots,"aside-top",{},void 0,!0),u(t.$slots,"aside-outline-before",{},void 0,!0),h(Bt),u(t.$slots,"aside-outline-after",{},void 0,!0),Dt,u(t.$slots,"aside-ads-before",{},void 0,!0),l(e).carbonAds?(a(),$(xt,{key:0,"carbon-ads":l(e).carbonAds},null,8,["carbon-ads"])):f("",!0),u(t.$slots,"aside-ads-after",{},void 0,!0),u(t.$slots,"aside-bottom",{},void 0,!0)]))}});const Ft=m(Et,[["__scopeId","data-v-3f215769"]]);function Ot(){const{theme:s,page:e}=P();return k(()=>{const{text:t="Edit this page",pattern:n=""}=s.value.editLink||{};let o;return typeof n=="function"?o=n(e.value):o=n.replace(/:path/g,e.value.filePath),{url:o,text:t}})}function Gt(){const{page:s,theme:e,frontmatter:t}=P();return k(()=>{var _,g,V,y,I,S,C,B;const n=Ne(e.value.sidebar,s.value.relativePath),o=ft(n),r=o.findIndex(w=>O(s.value.relativePath,w.link)),d=((_=e.value.docFooter)==null?void 0:_.prev)===!1&&!t.value.prev||t.value.prev===!1,p=((g=e.value.docFooter)==null?void 0:g.next)===!1&&!t.value.next||t.value.next===!1;return{prev:d?void 0:{text:(typeof t.value.prev=="string"?t.value.prev:typeof t.value.prev=="object"?t.value.prev.text:void 0)??((V=o[r-1])==null?void 0:V.docFooterText)??((y=o[r-1])==null?void 0:y.text),link:(typeof t.value.prev=="object"?t.value.prev.link:void 0)??((I=o[r-1])==null?void 0:I.link)},next:p?void 0:{text:(typeof t.value.next=="string"?t.value.next:typeof t.value.next=="object"?t.value.next.text:void 0)??((S=o[r+1])==null?void 0:S.docFooterText)??((C=o[r+1])==null?void 0:C.text),link:(typeof t.value.next=="object"?t.value.next.link:void 0)??((B=o[r+1])==null?void 0:B.link)}}})}const Ut={},jt={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},Kt=c("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"},null,-1),Rt=c("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"},null,-1),qt=[Kt,Rt];function Wt(s,e){return a(),i("svg",jt,qt)}const Yt=m(Ut,[["render",Wt]]),E=b({__name:"VPLink",props:{tag:{},href:{},noIcon:{type:Boolean},target:{},rel:{}},setup(s){const e=s,t=k(()=>e.tag??(e.href?"a":"span")),n=k(()=>e.href&&we.test(e.href));return(o,r)=>(a(),$(F(t.value),{class:T(["VPLink",{link:o.href,"vp-external-link-icon":n.value,"no-icon":o.noIcon}]),href:o.href?l(J)(o.href):void 0,target:o.target??(n.value?"_blank":void 0),rel:o.rel??(n.value?"noreferrer":void 0)},{default:v(()=>[u(o.$slots,"default")]),_:3},8,["class","href","target","rel"]))}}),Jt={class:"VPLastUpdated"},Xt=["datetime"],Zt=b({__name:"VPDocFooterLastUpdated",setup(s){const{theme:e,page:t,frontmatter:n,lang:o}=P(),r=k(()=>new Date(n.value.lastUpdated??t.value.lastUpdated)),d=k(()=>r.value.toISOString()),p=M("");return G(()=>{te(()=>{var _,g,V;p.value=new Intl.DateTimeFormat((g=(_=e.value.lastUpdated)==null?void 0:_.formatOptions)!=null&&g.forceLocale?o.value:void 0,((V=e.value.lastUpdated)==null?void 0:V.formatOptions)??{dateStyle:"short",timeStyle:"short"}).format(r.value)})}),(_,g)=>{var V;return a(),i("p",Jt,[x(L(((V=l(e).lastUpdated)==null?void 0:V.text)||l(e).lastUpdatedText||"Last updated")+": ",1),c("time",{datetime:d.value},L(p.value),9,Xt)])}}});const Qt=m(Zt,[["__scopeId","data-v-7e05ebdb"]]),es={key:0,class:"VPDocFooter"},ts={key:0,class:"edit-info"},ss={key:0,class:"edit-link"},ns={key:1,class:"last-updated"},os={key:1,class:"prev-next"},as={class:"pager"},rs=["href"],ls=["innerHTML"],is=["innerHTML"],cs={class:"pager"},us=["href"],ds=["innerHTML"],_s=["innerHTML"],vs=b({__name:"VPDocFooter",setup(s){const{theme:e,page:t,frontmatter:n}=P(),o=Ot(),r=Gt(),d=k(()=>e.value.editLink&&n.value.editLink!==!1),p=k(()=>t.value.lastUpdated&&n.value.lastUpdated!==!1),_=k(()=>d.value||p.value||r.value.prev||r.value.next);return(g,V)=>{var y,I,S,C,B,w;return _.value?(a(),i("footer",es,[u(g.$slots,"doc-footer-before",{},void 0,!0),d.value||p.value?(a(),i("div",ts,[d.value?(a(),i("div",ss,[h(E,{class:"edit-link-button",href:l(o).url,"no-icon":!0},{default:v(()=>[h(Yt,{class:"edit-link-icon","aria-label":"edit icon"}),x(" "+L(l(o).text),1)]),_:1},8,["href"])])):f("",!0),p.value?(a(),i("div",ns,[h(Qt)])):f("",!0)])):f("",!0),(y=l(r).prev)!=null&&y.link||(I=l(r).next)!=null&&I.link?(a(),i("nav",os,[c("div",as,[(S=l(r).prev)!=null&&S.link?(a(),i("a",{key:0,class:"pager-link prev",href:l(J)(l(r).prev.link)},[c("span",{class:"desc",innerHTML:((C=l(e).docFooter)==null?void 0:C.prev)||"Previous page"},null,8,ls),c("span",{class:"title",innerHTML:l(r).prev.text},null,8,is)],8,rs)):f("",!0)]),c("div",cs,[(B=l(r).next)!=null&&B.link?(a(),i("a",{key:0,class:"pager-link next",href:l(J)(l(r).next.link)},[c("span",{class:"desc",innerHTML:((w=l(e).docFooter)==null?void 0:w.next)||"Next page"},null,8,ds),c("span",{class:"title",innerHTML:l(r).next.text},null,8,_s)],8,us)):f("",!0)])])):f("",!0)])):f("",!0)}}});const ps=m(vs,[["__scopeId","data-v-ef5dee53"]]),hs={},fs={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},ms=c("path",{d:"M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"},null,-1),gs=[ms];function bs(s,e){return a(),i("svg",fs,gs)}const fe=m(hs,[["render",bs]]),$s={key:0,class:"VPDocOutlineDropdown"},ks={key:0,class:"items"},ys=b({__name:"VPDocOutlineDropdown",setup(s){const{frontmatter:e,theme:t}=P(),n=M(!1);Y(()=>{n.value=!1});const o=_e([]);return Y(()=>{o.value=pe(e.value.outline??t.value.outline)}),(r,d)=>o.value.length>0?(a(),i("div",$s,[c("button",{onClick:d[0]||(d[0]=p=>n.value=!n.value),class:T({open:n.value})},[x(L(l(ve)(l(t)))+" ",1),h(fe,{class:"icon"})],2),n.value?(a(),i("div",ks,[h(he,{headers:o.value},null,8,["headers"])])):f("",!0)])):f("",!0)}});const Ps=m(ys,[["__scopeId","data-v-eadfb36b"]]),Vs=s=>(H("data-v-6b87e69f"),s=s(),z(),s),ws={class:"container"},Ls=Vs(()=>c("div",{class:"aside-curtain"},null,-1)),Ss={class:"aside-container"},Ms={class:"aside-content"},Ns={class:"content"},Is={class:"content-container"},Ts={class:"main"},Cs=b({__name:"VPDoc",setup(s){const{theme:e}=P(),t=se(),{hasSidebar:n,hasAside:o,leftAside:r}=D(),d=k(()=>t.path.replace(/[./]+/g,"_").replace(/_html$/,""));return(p,_)=>{const g=j("Content");return a(),i("div",{class:T(["VPDoc",{"has-sidebar":l(n),"has-aside":l(o)}])},[u(p.$slots,"doc-top",{},void 0,!0),c("div",ws,[l(o)?(a(),i("div",{key:0,class:T(["aside",{"left-aside":l(r)}])},[Ls,c("div",Ss,[c("div",Ms,[h(Ft,null,{"aside-top":v(()=>[u(p.$slots,"aside-top",{},void 0,!0)]),"aside-bottom":v(()=>[u(p.$slots,"aside-bottom",{},void 0,!0)]),"aside-outline-before":v(()=>[u(p.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":v(()=>[u(p.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":v(()=>[u(p.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":v(()=>[u(p.$slots,"aside-ads-after",{},void 0,!0)]),_:3})])])],2)):f("",!0),c("div",Ns,[c("div",Is,[u(p.$slots,"doc-before",{},void 0,!0),h(Ps),c("main",Ts,[h(g,{class:T(["vp-doc",[d.value,l(e).externalLinkIcon&&"external-link-icon-enabled"]])},null,8,["class"])]),h(ps,null,{"doc-footer-before":v(()=>[u(p.$slots,"doc-footer-before",{},void 0,!0)]),_:3}),u(p.$slots,"doc-after",{},void 0,!0)])])]),u(p.$slots,"doc-bottom",{},void 0,!0)],2)}}});const Bs=m(Cs,[["__scopeId","data-v-6b87e69f"]]),As=b({__name:"VPButton",props:{tag:{},size:{default:"medium"},theme:{default:"brand"},text:{},href:{}},setup(s){const e=s,t=k(()=>e.href&&we.test(e.href)),n=k(()=>e.tag||e.href?"a":"button");return(o,r)=>(a(),$(F(n.value),{class:T(["VPButton",[o.size,o.theme]]),href:o.href?l(J)(o.href):void 0,target:t.value?"_blank":void 0,rel:t.value?"noreferrer":void 0},{default:v(()=>[x(L(o.text),1)]),_:1},8,["class","href","target","rel"]))}});const xs=m(As,[["__scopeId","data-v-c1c5efc1"]]),Hs=["src","alt"],zs=b({inheritAttrs:!1,__name:"VPImage",props:{image:{},alt:{}},setup(s){return(e,t)=>{const n=j("VPImage",!0);return e.image?(a(),i(N,{key:0},[typeof e.image=="string"||"src"in e.image?(a(),i("img",Z({key:0,class:"VPImage"},typeof e.image=="string"?e.$attrs:{...e.image,...e.$attrs},{src:l(ue)(typeof e.image=="string"?e.image:e.image.src),alt:e.alt??(typeof e.image=="string"?"":e.image.alt||"")}),null,16,Hs)):(a(),i(N,{key:1},[h(n,Z({class:"dark",image:e.image.dark,alt:e.image.alt},e.$attrs),null,16,["image","alt"]),h(n,Z({class:"light",image:e.image.light,alt:e.image.alt},e.$attrs),null,16,["image","alt"])],64))],64)):f("",!0)}}});const ee=m(zs,[["__scopeId","data-v-8426fc1a"]]),Ds=s=>(H("data-v-da5d1713"),s=s(),z(),s),Es={class:"container"},Fs={class:"main"},Os={key:0,class:"name"},Gs=["innerHTML"],Us=["innerHTML"],js=["innerHTML"],Ks={key:0,class:"actions"},Rs={key:0,class:"image"},qs={class:"image-container"},Ws=Ds(()=>c("div",{class:"image-bg"},null,-1)),Ys=b({__name:"VPHero",props:{name:{},text:{},tagline:{},image:{},actions:{}},setup(s){const e=ne("hero-image-slot-exists");return(t,n)=>(a(),i("div",{class:T(["VPHero",{"has-image":t.image||l(e)}])},[c("div",Es,[c("div",Fs,[u(t.$slots,"home-hero-info",{},()=>[t.name?(a(),i("h1",Os,[c("span",{innerHTML:t.name,class:"clip"},null,8,Gs)])):f("",!0),t.text?(a(),i("p",{key:1,innerHTML:t.text,class:"text"},null,8,Us)):f("",!0),t.tagline?(a(),i("p",{key:2,innerHTML:t.tagline,class:"tagline"},null,8,js)):f("",!0)],!0),t.actions?(a(),i("div",Ks,[(a(!0),i(N,null,A(t.actions,o=>(a(),i("div",{key:o.link,class:"action"},[h(xs,{tag:"a",size:"medium",theme:o.theme,text:o.text,href:o.link},null,8,["theme","text","href"])]))),128))])):f("",!0)]),t.image||l(e)?(a(),i("div",Rs,[c("div",qs,[Ws,u(t.$slots,"home-hero-image",{},()=>[t.image?(a(),$(ee,{key:0,class:"image-src",image:t.image},null,8,["image"])):f("",!0)],!0)])])):f("",!0)])],2))}});const Js=m(Ys,[["__scopeId","data-v-da5d1713"]]),Xs=b({__name:"VPHomeHero",setup(s){const{frontmatter:e}=P();return(t,n)=>l(e).hero?(a(),$(Js,{key:0,class:"VPHomeHero",name:l(e).hero.name,text:l(e).hero.text,tagline:l(e).hero.tagline,image:l(e).hero.image,actions:l(e).hero.actions},{"home-hero-info":v(()=>[u(t.$slots,"home-hero-info")]),"home-hero-image":v(()=>[u(t.$slots,"home-hero-image")]),_:3},8,["name","text","tagline","image","actions"])):f("",!0)}}),Zs={},Qs={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},en=c("path",{d:"M19.9,12.4c0.1-0.2,0.1-0.5,0-0.8c-0.1-0.1-0.1-0.2-0.2-0.3l-7-7c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4l5.3,5.3H5c-0.6,0-1,0.4-1,1s0.4,1,1,1h11.6l-5.3,5.3c-0.4,0.4-0.4,1,0,1.4c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3l7-7C19.8,12.6,19.9,12.5,19.9,12.4z"},null,-1),tn=[en];function sn(s,e){return a(),i("svg",Qs,tn)}const nn=m(Zs,[["render",sn]]),on={class:"box"},an={key:0,class:"icon"},rn=["innerHTML"],ln=["innerHTML"],cn=["innerHTML"],un={key:4,class:"link-text"},dn={class:"link-text-value"},_n=b({__name:"VPFeature",props:{icon:{},title:{},details:{},link:{},linkText:{},rel:{},target:{}},setup(s){return(e,t)=>(a(),$(E,{class:"VPFeature",href:e.link,rel:e.rel,target:e.target,"no-icon":!0,tag:e.link?"a":"div"},{default:v(()=>[c("article",on,[typeof e.icon=="object"&&e.icon.wrap?(a(),i("div",an,[h(ee,{image:e.icon,alt:e.icon.alt,height:e.icon.height||48,width:e.icon.width||48},null,8,["image","alt","height","width"])])):typeof e.icon=="object"?(a(),$(ee,{key:1,image:e.icon,alt:e.icon.alt,height:e.icon.height||48,width:e.icon.width||48},null,8,["image","alt","height","width"])):e.icon?(a(),i("div",{key:2,class:"icon",innerHTML:e.icon},null,8,rn)):f("",!0),c("h2",{class:"title",innerHTML:e.title},null,8,ln),e.details?(a(),i("p",{key:3,class:"details",innerHTML:e.details},null,8,cn)):f("",!0),e.linkText?(a(),i("div",un,[c("p",dn,[x(L(e.linkText)+" ",1),h(nn,{class:"link-text-icon"})])])):f("",!0)])]),_:1},8,["href","rel","target","tag"]))}});const vn=m(_n,[["__scopeId","data-v-33204567"]]),pn={key:0,class:"VPFeatures"},hn={class:"container"},fn={class:"items"},mn=b({__name:"VPFeatures",props:{features:{}},setup(s){const e=s,t=k(()=>{const n=e.features.length;if(n){if(n===2)return"grid-2";if(n===3)return"grid-3";if(n%3===0)return"grid-6";if(n>3)return"grid-4"}else return});return(n,o)=>n.features?(a(),i("div",pn,[c("div",hn,[c("div",fn,[(a(!0),i(N,null,A(n.features,r=>(a(),i("div",{key:r.title,class:T(["item",[t.value]])},[h(vn,{icon:r.icon,title:r.title,details:r.details,link:r.link,"link-text":r.linkText,rel:r.rel,target:r.target},null,8,["icon","title","details","link","link-text","rel","target"])],2))),128))])])])):f("",!0)}});const gn=m(mn,[["__scopeId","data-v-a6181336"]]),bn=b({__name:"VPHomeFeatures",setup(s){const{frontmatter:e}=P();return(t,n)=>l(e).features?(a(),$(gn,{key:0,class:"VPHomeFeatures",features:l(e).features},null,8,["features"])):f("",!0)}}),$n={class:"VPHome"},kn=b({__name:"VPHome",setup(s){return(e,t)=>{const n=j("Content");return a(),i("div",$n,[u(e.$slots,"home-hero-before",{},void 0,!0),h(Xs,null,{"home-hero-info":v(()=>[u(e.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-image":v(()=>[u(e.$slots,"home-hero-image",{},void 0,!0)]),_:3}),u(e.$slots,"home-hero-after",{},void 0,!0),u(e.$slots,"home-features-before",{},void 0,!0),h(bn),u(e.$slots,"home-features-after",{},void 0,!0),h(n)])}}});const yn=m(kn,[["__scopeId","data-v-d82743a8"]]),Pn={},Vn={class:"VPPage"};function wn(s,e){const t=j("Content");return a(),i("div",Vn,[u(s.$slots,"page-top"),h(t),u(s.$slots,"page-bottom")])}const Ln=m(Pn,[["render",wn]]),Sn=b({__name:"VPContent",setup(s){const{page:e,frontmatter:t}=P(),{hasSidebar:n}=D();return(o,r)=>(a(),i("div",{class:T(["VPContent",{"has-sidebar":l(n),"is-home":l(t).layout==="home"}]),id:"VPContent"},[l(e).isNotFound?u(o.$slots,"not-found",{key:0},()=>[h(pt)],!0):l(t).layout==="page"?(a(),$(Ln,{key:1},{"page-top":v(()=>[u(o.$slots,"page-top",{},void 0,!0)]),"page-bottom":v(()=>[u(o.$slots,"page-bottom",{},void 0,!0)]),_:3})):l(t).layout==="home"?(a(),$(yn,{key:2},{"home-hero-before":v(()=>[u(o.$slots,"home-hero-before",{},void 0,!0)]),"home-hero-info":v(()=>[u(o.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-image":v(()=>[u(o.$slots,"home-hero-image",{},void 0,!0)]),"home-hero-after":v(()=>[u(o.$slots,"home-hero-after",{},void 0,!0)]),"home-features-before":v(()=>[u(o.$slots,"home-features-before",{},void 0,!0)]),"home-features-after":v(()=>[u(o.$slots,"home-features-after",{},void 0,!0)]),_:3})):l(t).layout&&l(t).layout!=="doc"?(a(),$(F(l(t).layout),{key:3})):(a(),$(Bs,{key:4},{"doc-top":v(()=>[u(o.$slots,"doc-top",{},void 0,!0)]),"doc-bottom":v(()=>[u(o.$slots,"doc-bottom",{},void 0,!0)]),"doc-footer-before":v(()=>[u(o.$slots,"doc-footer-before",{},void 0,!0)]),"doc-before":v(()=>[u(o.$slots,"doc-before",{},void 0,!0)]),"doc-after":v(()=>[u(o.$slots,"doc-after",{},void 0,!0)]),"aside-top":v(()=>[u(o.$slots,"aside-top",{},void 0,!0)]),"aside-outline-before":v(()=>[u(o.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":v(()=>[u(o.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":v(()=>[u(o.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":v(()=>[u(o.$slots,"aside-ads-after",{},void 0,!0)]),"aside-bottom":v(()=>[u(o.$slots,"aside-bottom",{},void 0,!0)]),_:3}))],2))}});const Mn=m(Sn,[["__scopeId","data-v-669faec9"]]),Nn={class:"container"},In=["innerHTML"],Tn=["innerHTML"],Cn=b({__name:"VPFooter",setup(s){const{theme:e,frontmatter:t}=P(),{hasSidebar:n}=D();return(o,r)=>l(e).footer&&l(t).footer!==!1?(a(),i("footer",{key:0,class:T(["VPFooter",{"has-sidebar":l(n)}])},[c("div",Nn,[l(e).footer.message?(a(),i("p",{key:0,class:"message",innerHTML:l(e).footer.message},null,8,In)):f("",!0),l(e).footer.copyright?(a(),i("p",{key:1,class:"copyright",innerHTML:l(e).footer.copyright},null,8,Tn)):f("",!0)])],2)):f("",!0)}});const Bn=m(Cn,[["__scopeId","data-v-e03eb2e1"]]),An={class:"header"},xn={class:"outline"},Hn=b({__name:"VPLocalNavOutlineDropdown",props:{headers:{},navHeight:{}},setup(s){const e=s,{theme:t}=P(),n=M(!1),o=M(0),r=M();Y(()=>{n.value=!1});function d(){n.value=!n.value,o.value=window.innerHeight+Math.min(window.scrollY-e.navHeight,0)}function p(g){g.target.classList.contains("outline-link")&&(r.value&&(r.value.style.transition="none"),Oe(()=>{n.value=!1}))}function _(){n.value=!1,window.scrollTo({top:0,left:0,behavior:"smooth"})}return(g,V)=>(a(),i("div",{class:"VPLocalNavOutlineDropdown",style:Fe({"--vp-vh":o.value+"px"})},[g.headers.length>0?(a(),i("button",{key:0,onClick:d,class:T({open:n.value})},[x(L(l(ve)(l(t)))+" ",1),h(fe,{class:"icon"})],2)):(a(),i("button",{key:1,onClick:_},L(l(t).returnToTopLabel||"Return to top"),1)),h(ce,{name:"flyout"},{default:v(()=>[n.value?(a(),i("div",{key:0,ref_key:"items",ref:r,class:"items",onClick:p},[c("div",An,[c("a",{class:"top-link",href:"#",onClick:_},L(l(t).returnToTopLabel||"Return to top"),1)]),c("div",xn,[h(he,{headers:g.headers},null,8,["headers"])])],512)):f("",!0)]),_:1})],4))}});const zn=m(Hn,[["__scopeId","data-v-1c15a60a"]]),Dn={},En={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},Fn=c("path",{d:"M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"},null,-1),On=c("path",{d:"M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"},null,-1),Gn=c("path",{d:"M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"},null,-1),Un=c("path",{d:"M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"},null,-1),jn=[Fn,On,Gn,Un];function Kn(s,e){return a(),i("svg",En,jn)}const Rn=m(Dn,[["render",Kn]]),qn=["aria-expanded"],Wn={class:"menu-text"},Yn=b({__name:"VPLocalNav",props:{open:{type:Boolean}},emits:["open-menu"],setup(s){const{theme:e,frontmatter:t}=P(),{hasSidebar:n}=D(),{y:o}=Le(),r=_e([]),d=M(0);G(()=>{d.value=parseInt(getComputedStyle(document.documentElement).getPropertyValue("--vp-nav-height"))}),Y(()=>{r.value=pe(t.value.outline??e.value.outline)});const p=k(()=>r.value.length===0&&!n.value),_=k(()=>({VPLocalNav:!0,fixed:p.value,"reached-top":o.value>=d.value}));return(g,V)=>l(t).layout!=="home"&&(!p.value||l(o)>=d.value)?(a(),i("div",{key:0,class:T(_.value)},[l(n)?(a(),i("button",{key:0,class:"menu","aria-expanded":g.open,"aria-controls":"VPSidebarNav",onClick:V[0]||(V[0]=y=>g.$emit("open-menu"))},[h(Rn,{class:"menu-icon"}),c("span",Wn,L(l(e).sidebarMenuLabel||"Menu"),1)],8,qn)):f("",!0),h(zn,{headers:r.value,navHeight:d.value},null,8,["headers","navHeight"])],2)):f("",!0)}});const Jn=m(Yn,[["__scopeId","data-v-79c8c1df"]]);function Xn(){const s=M(!1);function e(){s.value=!0,window.addEventListener("resize",o)}function t(){s.value=!1,window.removeEventListener("resize",o)}function n(){s.value?t():e()}function o(){window.outerWidth>=768&&t()}const r=se();return U(()=>r.path,t),{isScreenOpen:s,openScreen:e,closeScreen:t,toggleScreen:n}}const Zn={},Qn={class:"VPSwitch",type:"button",role:"switch"},eo={class:"check"},to={key:0,class:"icon"};function so(s,e){return a(),i("button",Qn,[c("span",eo,[s.$slots.default?(a(),i("span",to,[u(s.$slots,"default",{},void 0,!0)])):f("",!0)])])}const no=m(Zn,[["render",so],["__scopeId","data-v-b1685198"]]),oo={},ao={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},ro=c("path",{d:"M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"},null,-1),lo=[ro];function io(s,e){return a(),i("svg",ao,lo)}const co=m(oo,[["render",io]]),uo={},_o={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},vo=Ge('<path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path>',9),po=[vo];function ho(s,e){return a(),i("svg",_o,po)}const fo=m(uo,[["render",ho]]),mo=b({__name:"VPSwitchAppearance",setup(s){const{isDark:e}=P(),t=ne("toggle-appearance",()=>{e.value=!e.value});return(n,o)=>(a(),$(no,{title:"toggle dark mode",class:"VPSwitchAppearance","aria-checked":l(e),onClick:l(t)},{default:v(()=>[h(fo,{class:"sun"}),h(co,{class:"moon"})]),_:1},8,["aria-checked","onClick"]))}});const me=m(mo,[["__scopeId","data-v-ce54a7d1"]]),go={key:0,class:"VPNavBarAppearance"},bo=b({__name:"VPNavBarAppearance",setup(s){const{site:e}=P();return(t,n)=>l(e).appearance&&l(e).appearance!=="force-dark"?(a(),i("div",go,[h(me)])):f("",!0)}});const $o=m(bo,[["__scopeId","data-v-e6aabb21"]]),ge=M();let Te=!1,ae=0;function ko(s){const e=M(!1);if(q){!Te&&yo(),ae++;const t=U(ge,n=>{var o,r,d;n===s.el.value||(o=s.el.value)!=null&&o.contains(n)?(e.value=!0,(r=s.onFocus)==null||r.call(s)):(e.value=!1,(d=s.onBlur)==null||d.call(s))});de(()=>{t(),ae--,ae||Po()})}return Ue(e)}function yo(){document.addEventListener("focusin",Ce),Te=!0,ge.value=document.activeElement}function Po(){document.removeEventListener("focusin",Ce)}function Ce(){ge.value=document.activeElement}const Vo={},wo={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},Lo=c("path",{d:"M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"},null,-1),So=[Lo];function Mo(s,e){return a(),i("svg",wo,So)}const Be=m(Vo,[["render",Mo]]),No={},Io={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},To=c("circle",{cx:"12",cy:"12",r:"2"},null,-1),Co=c("circle",{cx:"19",cy:"12",r:"2"},null,-1),Bo=c("circle",{cx:"5",cy:"12",r:"2"},null,-1),Ao=[To,Co,Bo];function xo(s,e){return a(),i("svg",Io,Ao)}const Ho=m(No,[["render",xo]]),zo={class:"VPMenuLink"},Do=b({__name:"VPMenuLink",props:{item:{}},setup(s){const{page:e}=P();return(t,n)=>(a(),i("div",zo,[h(E,{class:T({active:l(O)(l(e).relativePath,t.item.activeMatch||t.item.link,!!t.item.activeMatch)}),href:t.item.link,target:t.item.target,rel:t.item.rel},{default:v(()=>[x(L(t.item.text),1)]),_:1},8,["class","href","target","rel"])]))}});const oe=m(Do,[["__scopeId","data-v-43f1e123"]]),Eo={class:"VPMenuGroup"},Fo={key:0,class:"title"},Oo=b({__name:"VPMenuGroup",props:{text:{},items:{}},setup(s){return(e,t)=>(a(),i("div",Eo,[e.text?(a(),i("p",Fo,L(e.text),1)):f("",!0),(a(!0),i(N,null,A(e.items,n=>(a(),i(N,null,["link"in n?(a(),$(oe,{key:0,item:n},null,8,["item"])):f("",!0)],64))),256))]))}});const Go=m(Oo,[["__scopeId","data-v-69e747b5"]]),Uo={class:"VPMenu"},jo={key:0,class:"items"},Ko=b({__name:"VPMenu",props:{items:{}},setup(s){return(e,t)=>(a(),i("div",Uo,[e.items?(a(),i("div",jo,[(a(!0),i(N,null,A(e.items,n=>(a(),i(N,{key:n.text},["link"in n?(a(),$(oe,{key:0,item:n},null,8,["item"])):(a(),$(Go,{key:1,text:n.text,items:n.items},null,8,["text","items"]))],64))),128))])):f("",!0),u(e.$slots,"default",{},void 0,!0)]))}});const Ro=m(Ko,[["__scopeId","data-v-e7ea1737"]]),qo=["aria-expanded","aria-label"],Wo={key:0,class:"text"},Yo=["innerHTML"],Jo={class:"menu"},Xo=b({__name:"VPFlyout",props:{icon:{},button:{},label:{},items:{}},setup(s){const e=M(!1),t=M();ko({el:t,onBlur:n});function n(){e.value=!1}return(o,r)=>(a(),i("div",{class:"VPFlyout",ref_key:"el",ref:t,onMouseenter:r[1]||(r[1]=d=>e.value=!0),onMouseleave:r[2]||(r[2]=d=>e.value=!1)},[c("button",{type:"button",class:"button","aria-haspopup":"true","aria-expanded":e.value,"aria-label":o.label,onClick:r[0]||(r[0]=d=>e.value=!e.value)},[o.button||o.icon?(a(),i("span",Wo,[o.icon?(a(),$(F(o.icon),{key:0,class:"option-icon"})):f("",!0),o.button?(a(),i("span",{key:1,innerHTML:o.button},null,8,Yo)):f("",!0),h(Be,{class:"text-icon"})])):(a(),$(Ho,{key:1,class:"icon"}))],8,qo),c("div",Jo,[h(Ro,{items:o.items},{default:v(()=>[u(o.$slots,"default",{},void 0,!0)]),_:3},8,["items"])])],544))}});const be=m(Xo,[["__scopeId","data-v-9c007e85"]]),Zo={discord:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Discord</title><path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z"/></svg>',facebook:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Facebook</title><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>',github:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>',instagram:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Instagram</title><path d="M12 0C8.74 0 8.333.015 7.053.072 5.775.132 4.905.333 4.14.63c-.789.306-1.459.717-2.126 1.384S.935 3.35.63 4.14C.333 4.905.131 5.775.072 7.053.012 8.333 0 8.74 0 12s.015 3.667.072 4.947c.06 1.277.261 2.148.558 2.913.306.788.717 1.459 1.384 2.126.667.666 1.336 1.079 2.126 1.384.766.296 1.636.499 2.913.558C8.333 23.988 8.74 24 12 24s3.667-.015 4.947-.072c1.277-.06 2.148-.262 2.913-.558.788-.306 1.459-.718 2.126-1.384.666-.667 1.079-1.335 1.384-2.126.296-.765.499-1.636.558-2.913.06-1.28.072-1.687.072-4.947s-.015-3.667-.072-4.947c-.06-1.277-.262-2.149-.558-2.913-.306-.789-.718-1.459-1.384-2.126C21.319 1.347 20.651.935 19.86.63c-.765-.297-1.636-.499-2.913-.558C15.667.012 15.26 0 12 0zm0 2.16c3.203 0 3.585.016 4.85.071 1.17.055 1.805.249 2.227.415.562.217.96.477 1.382.896.419.42.679.819.896 1.381.164.422.36 1.057.413 2.227.057 1.266.07 1.646.07 4.85s-.015 3.585-.074 4.85c-.061 1.17-.256 1.805-.421 2.227-.224.562-.479.96-.899 1.382-.419.419-.824.679-1.38.896-.42.164-1.065.36-2.235.413-1.274.057-1.649.07-4.859.07-3.211 0-3.586-.015-4.859-.074-1.171-.061-1.816-.256-2.236-.421-.569-.224-.96-.479-1.379-.899-.421-.419-.69-.824-.9-1.38-.165-.42-.359-1.065-.42-2.235-.045-1.26-.061-1.649-.061-4.844 0-3.196.016-3.586.061-4.861.061-1.17.255-1.814.42-2.234.21-.57.479-.96.9-1.381.419-.419.81-.689 1.379-.898.42-.166 1.051-.361 2.221-.421 1.275-.045 1.65-.06 4.859-.06l.045.03zm0 3.678c-3.405 0-6.162 2.76-6.162 6.162 0 3.405 2.76 6.162 6.162 6.162 3.405 0 6.162-2.76 6.162-6.162 0-3.405-2.76-6.162-6.162-6.162zM12 16c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4zm7.846-10.405c0 .795-.646 1.44-1.44 1.44-.795 0-1.44-.646-1.44-1.44 0-.794.646-1.439 1.44-1.439.793-.001 1.44.645 1.44 1.439z"/></svg>',linkedin:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>LinkedIn</title><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>',mastodon:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Mastodon</title><path d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z"/></svg>',slack:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Slack</title><path d="M5.042 15.165a2.528 2.528 0 0 1-2.52 2.523A2.528 2.528 0 0 1 0 15.165a2.527 2.527 0 0 1 2.522-2.52h2.52v2.52zM6.313 15.165a2.527 2.527 0 0 1 2.521-2.52 2.527 2.527 0 0 1 2.521 2.52v6.313A2.528 2.528 0 0 1 8.834 24a2.528 2.528 0 0 1-2.521-2.522v-6.313zM8.834 5.042a2.528 2.528 0 0 1-2.521-2.52A2.528 2.528 0 0 1 8.834 0a2.528 2.528 0 0 1 2.521 2.522v2.52H8.834zM8.834 6.313a2.528 2.528 0 0 1 2.521 2.521 2.528 2.528 0 0 1-2.521 2.521H2.522A2.528 2.528 0 0 1 0 8.834a2.528 2.528 0 0 1 2.522-2.521h6.312zM18.956 8.834a2.528 2.528 0 0 1 2.522-2.521A2.528 2.528 0 0 1 24 8.834a2.528 2.528 0 0 1-2.522 2.521h-2.522V8.834zM17.688 8.834a2.528 2.528 0 0 1-2.523 2.521 2.527 2.527 0 0 1-2.52-2.521V2.522A2.527 2.527 0 0 1 15.165 0a2.528 2.528 0 0 1 2.523 2.522v6.312zM15.165 18.956a2.528 2.528 0 0 1 2.523 2.522A2.528 2.528 0 0 1 15.165 24a2.527 2.527 0 0 1-2.52-2.522v-2.522h2.52zM15.165 17.688a2.527 2.527 0 0 1-2.52-2.523 2.526 2.526 0 0 1 2.52-2.52h6.313A2.527 2.527 0 0 1 24 15.165a2.528 2.528 0 0 1-2.522 2.523h-6.313z"/></svg>',twitter:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Twitter</title><path d="M21.543 7.104c.015.211.015.423.015.636 0 6.507-4.954 14.01-14.01 14.01v-.003A13.94 13.94 0 0 1 0 19.539a9.88 9.88 0 0 0 7.287-2.041 4.93 4.93 0 0 1-4.6-3.42 4.916 4.916 0 0 0 2.223-.084A4.926 4.926 0 0 1 .96 9.167v-.062a4.887 4.887 0 0 0 2.235.616A4.928 4.928 0 0 1 1.67 3.148 13.98 13.98 0 0 0 11.82 8.292a4.929 4.929 0 0 1 8.39-4.49 9.868 9.868 0 0 0 3.128-1.196 4.941 4.941 0 0 1-2.165 2.724A9.828 9.828 0 0 0 24 4.555a10.019 10.019 0 0 1-2.457 2.549z"/></svg>',x:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>X</title><path d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932ZM17.61 20.644h2.039L6.486 3.24H4.298Z"/></svg>',youtube:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>YouTube</title><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>'},Qo=["href","aria-label","innerHTML"],ea=b({__name:"VPSocialLink",props:{icon:{},link:{},ariaLabel:{}},setup(s){const e=s,t=k(()=>typeof e.icon=="object"?e.icon.svg:Zo[e.icon]);return(n,o)=>(a(),i("a",{class:"VPSocialLink no-icon",href:n.link,"aria-label":n.ariaLabel??(typeof n.icon=="string"?n.icon:""),target:"_blank",rel:"noopener",innerHTML:t.value},null,8,Qo))}});const ta=m(ea,[["__scopeId","data-v-f80f8133"]]),sa={class:"VPSocialLinks"},na=b({__name:"VPSocialLinks",props:{links:{}},setup(s){return(e,t)=>(a(),i("div",sa,[(a(!0),i(N,null,A(e.links,({link:n,icon:o,ariaLabel:r})=>(a(),$(ta,{key:n,icon:o,link:n,ariaLabel:r},null,8,["icon","link","ariaLabel"]))),128))]))}});const $e=m(na,[["__scopeId","data-v-7bc22406"]]),oa={key:0,class:"group translations"},aa={class:"trans-title"},ra={key:1,class:"group"},la={class:"item appearance"},ia={class:"label"},ca={class:"appearance-action"},ua={key:2,class:"group"},da={class:"item social-links"},_a=b({__name:"VPNavBarExtra",setup(s){const{site:e,theme:t}=P(),{localeLinks:n,currentLang:o}=X({correspondingLink:!0}),r=k(()=>n.value.length&&o.value.label||e.value.appearance||t.value.socialLinks);return(d,p)=>r.value?(a(),$(be,{key:0,class:"VPNavBarExtra",label:"extra navigation"},{default:v(()=>[l(n).length&&l(o).label?(a(),i("div",oa,[c("p",aa,L(l(o).label),1),(a(!0),i(N,null,A(l(n),_=>(a(),$(oe,{key:_.link,item:_},null,8,["item"]))),128))])):f("",!0),l(e).appearance?(a(),i("div",ra,[c("div",la,[c("p",ia,L(l(t).darkModeSwitchLabel||"Appearance"),1),c("div",ca,[h(me)])])])):f("",!0),l(t).socialLinks?(a(),i("div",ua,[c("div",da,[h($e,{class:"social-links-list",links:l(t).socialLinks},null,8,["links"])])])):f("",!0)]),_:1})):f("",!0)}});const va=m(_a,[["__scopeId","data-v-40855f84"]]),pa=s=>(H("data-v-e5dd9c1c"),s=s(),z(),s),ha=["aria-expanded"],fa=pa(()=>c("span",{class:"container"},[c("span",{class:"top"}),c("span",{class:"middle"}),c("span",{class:"bottom"})],-1)),ma=[fa],ga=b({__name:"VPNavBarHamburger",props:{active:{type:Boolean}},emits:["click"],setup(s){return(e,t)=>(a(),i("button",{type:"button",class:T(["VPNavBarHamburger",{active:e.active}]),"aria-label":"mobile navigation","aria-expanded":e.active,"aria-controls":"VPNavScreen",onClick:t[0]||(t[0]=n=>e.$emit("click"))},ma,10,ha))}});const ba=m(ga,[["__scopeId","data-v-e5dd9c1c"]]),$a=["innerHTML"],ka=b({__name:"VPNavBarMenuLink",props:{item:{}},setup(s){const{page:e}=P();return(t,n)=>(a(),$(E,{class:T({VPNavBarMenuLink:!0,active:l(O)(l(e).relativePath,t.item.activeMatch||t.item.link,!!t.item.activeMatch)}),href:t.item.link,target:t.item.target,rel:t.item.rel,tabindex:"0"},{default:v(()=>[c("span",{innerHTML:t.item.text},null,8,$a)]),_:1},8,["class","href","target","rel"]))}});const ya=m(ka,[["__scopeId","data-v-42ef59de"]]),Pa=b({__name:"VPNavBarMenuGroup",props:{item:{}},setup(s){const e=s,{page:t}=P(),n=r=>"link"in r?O(t.value.relativePath,r.link,!!e.item.activeMatch):r.items.some(n),o=k(()=>n(e.item));return(r,d)=>(a(),$(be,{class:T({VPNavBarMenuGroup:!0,active:l(O)(l(t).relativePath,r.item.activeMatch,!!r.item.activeMatch)||o.value}),button:r.item.text,items:r.item.items},null,8,["class","button","items"]))}}),Va=s=>(H("data-v-7f418b0f"),s=s(),z(),s),wa={key:0,"aria-labelledby":"main-nav-aria-label",class:"VPNavBarMenu"},La=Va(()=>c("span",{id:"main-nav-aria-label",class:"visually-hidden"},"Main Navigation",-1)),Sa=b({__name:"VPNavBarMenu",setup(s){const{theme:e}=P();return(t,n)=>l(e).nav?(a(),i("nav",wa,[La,(a(!0),i(N,null,A(l(e).nav,o=>(a(),i(N,{key:o.text},["link"in o?(a(),$(ya,{key:0,item:o},null,8,["item"])):(a(),$(Pa,{key:1,item:o},null,8,["item"]))],64))),128))])):f("",!0)}});const Ma=m(Sa,[["__scopeId","data-v-7f418b0f"]]);function Na(s,e){const{localeIndex:t}=P();function n(o){var S,C;const r=o.split("."),d=s&&typeof s=="object",p=d&&((C=(S=s.locales)==null?void 0:S[t.value])==null?void 0:C.translations)||null,_=d&&s.translations||null;let g=p,V=_,y=e;const I=r.pop();for(const B of r){let w=null;const K=y==null?void 0:y[B];K&&(w=y=K);const W=V==null?void 0:V[B];W&&(w=V=W);const R=g==null?void 0:g[B];R&&(w=g=R),K||(y=w),W||(V=w),R||(g=w)}return(g==null?void 0:g[I])??(V==null?void 0:V[I])??(y==null?void 0:y[I])??""}return n}const Ia=["aria-label"],Ta={class:"DocSearch-Button-Container"},Ca=c("svg",{class:"DocSearch-Search-Icon",width:"20",height:"20",viewBox:"0 0 20 20","aria-label":"search icon"},[c("path",{d:"M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z",stroke:"currentColor",fill:"none","fill-rule":"evenodd","stroke-linecap":"round","stroke-linejoin":"round"})],-1),Ba={class:"DocSearch-Button-Placeholder"},Aa=c("span",{class:"DocSearch-Button-Keys"},[c("kbd",{class:"DocSearch-Button-Key"}),c("kbd",{class:"DocSearch-Button-Key"},"K")],-1),Pe=b({__name:"VPNavBarSearchButton",setup(s){const{theme:e}=P(),t={button:{buttonText:"Search",buttonAriaLabel:"Search"}},n=je(Na)(Ke(()=>{var o;return(o=e.value.search)==null?void 0:o.options}),t);return(o,r)=>(a(),i("button",{type:"button",class:"DocSearch DocSearch-Button","aria-label":l(n)("button.buttonAriaLabel")},[c("span",Ta,[Ca,c("span",Ba,L(l(n)("button.buttonText")),1)]),Aa],8,Ia))}});const xa={class:"VPNavBarSearch"},Ha={id:"local-search"},za={key:1,id:"docsearch"},Da=b({__name:"VPNavBarSearch",setup(s){const e=Re(()=>qe(()=>import("./VPLocalSearchBox.527b26d1.js"),["assets/chunks/VPLocalSearchBox.527b26d1.js","assets/chunks/framework.7c0fadea.js"])),t=()=>null,{theme:n}=P(),o=M(!1),r=M(!1);G(()=>{});function d(){o.value||(o.value=!0,setTimeout(p,16))}function p(){const y=new Event("keydown");y.key="k",y.metaKey=!0,window.dispatchEvent(y),setTimeout(()=>{document.querySelector(".DocSearch-Modal")||p()},16)}function _(y){const I=y.target,S=I.tagName;return I.isContentEditable||S==="INPUT"||S==="SELECT"||S==="TEXTAREA"}const g=M(!1);ke("k",y=>{(y.ctrlKey||y.metaKey)&&(y.preventDefault(),g.value=!0)}),ke("/",y=>{_(y)||(y.preventDefault(),g.value=!0)});const V="local";return(y,I)=>{var S;return a(),i("div",xa,[l(V)==="local"?(a(),i(N,{key:0},[g.value?(a(),$(l(e),{key:0,onClose:I[0]||(I[0]=C=>g.value=!1)})):f("",!0),c("div",Ha,[h(Pe,{onClick:I[1]||(I[1]=C=>g.value=!0)})])],64)):l(V)==="algolia"?(a(),i(N,{key:1},[o.value?(a(),$(l(t),{key:0,algolia:((S=l(n).search)==null?void 0:S.options)??l(n).algolia,onVnodeBeforeMount:I[2]||(I[2]=C=>r.value=!0)},null,8,["algolia"])):f("",!0),r.value?f("",!0):(a(),i("div",za,[h(Pe,{onClick:d})]))],64)):f("",!0)])}}});const Ea=b({__name:"VPNavBarSocialLinks",setup(s){const{theme:e}=P();return(t,n)=>l(e).socialLinks?(a(),$($e,{key:0,class:"VPNavBarSocialLinks",links:l(e).socialLinks},null,8,["links"])):f("",!0)}});const Fa=m(Ea,[["__scopeId","data-v-0394ad82"]]),Oa=["href"],Ga=b({__name:"VPNavBarTitle",setup(s){const{site:e,theme:t}=P(),{hasSidebar:n}=D(),{currentLang:o}=X();return(r,d)=>(a(),i("div",{class:T(["VPNavBarTitle",{"has-sidebar":l(n)}])},[c("a",{class:"title",href:l(t).logoLink??l(J)(l(o).link)},[u(r.$slots,"nav-bar-title-before",{},void 0,!0),l(t).logo?(a(),$(ee,{key:0,class:"logo",image:l(t).logo},null,8,["image"])):f("",!0),l(t).siteTitle?(a(),i(N,{key:1},[x(L(l(t).siteTitle),1)],64)):l(t).siteTitle===void 0?(a(),i(N,{key:2},[x(L(l(e).title),1)],64)):f("",!0),u(r.$slots,"nav-bar-title-after",{},void 0,!0)],8,Oa)],2))}});const Ua=m(Ga,[["__scopeId","data-v-86d1bed8"]]),ja={},Ka={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},Ra=c("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),qa=c("path",{d:" M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z ",class:"css-c4d79v"},null,-1),Wa=[Ra,qa];function Ya(s,e){return a(),i("svg",Ka,Wa)}const Ae=m(ja,[["render",Ya]]),Ja={class:"items"},Xa={class:"title"},Za=b({__name:"VPNavBarTranslations",setup(s){const{theme:e}=P(),{localeLinks:t,currentLang:n}=X({correspondingLink:!0});return(o,r)=>l(t).length&&l(n).label?(a(),$(be,{key:0,class:"VPNavBarTranslations",icon:Ae,label:l(e).langMenuLabel||"Change language"},{default:v(()=>[c("div",Ja,[c("p",Xa,L(l(n).label),1),(a(!0),i(N,null,A(l(t),d=>(a(),$(oe,{key:d.link,item:d},null,8,["item"]))),128))])]),_:1},8,["label"])):f("",!0)}});const Qa=m(Za,[["__scopeId","data-v-74abcbb9"]]),er=s=>(H("data-v-a0fd61f4"),s=s(),z(),s),tr={class:"container"},sr={class:"title"},nr={class:"content"},or=er(()=>c("div",{class:"curtain"},null,-1)),ar={class:"content-body"},rr=b({__name:"VPNavBar",props:{isScreenOpen:{type:Boolean}},emits:["toggle-screen"],setup(s){const{y:e}=Le(),{hasSidebar:t}=D(),{frontmatter:n}=P(),o=M({});return Ve(()=>{o.value={"has-sidebar":t.value,top:n.value.layout==="home"&&e.value===0}}),(r,d)=>(a(),i("div",{class:T(["VPNavBar",o.value])},[c("div",tr,[c("div",sr,[h(Ua,null,{"nav-bar-title-before":v(()=>[u(r.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":v(()=>[u(r.$slots,"nav-bar-title-after",{},void 0,!0)]),_:3})]),c("div",nr,[or,c("div",ar,[u(r.$slots,"nav-bar-content-before",{},void 0,!0),h(Da,{class:"search"}),h(Ma,{class:"menu"}),h(Qa,{class:"translations"}),h($o,{class:"appearance"}),h(Fa,{class:"social-links"}),h(va,{class:"extra"}),u(r.$slots,"nav-bar-content-after",{},void 0,!0),h(ba,{class:"hamburger",active:r.isScreenOpen,onClick:d[0]||(d[0]=p=>r.$emit("toggle-screen"))},null,8,["active"])])])])],2))}});const lr=m(rr,[["__scopeId","data-v-a0fd61f4"]]),ir={key:0,class:"VPNavScreenAppearance"},cr={class:"text"},ur=b({__name:"VPNavScreenAppearance",setup(s){const{site:e,theme:t}=P();return(n,o)=>l(e).appearance?(a(),i("div",ir,[c("p",cr,L(l(t).darkModeSwitchLabel||"Appearance"),1),h(me)])):f("",!0)}});const dr=m(ur,[["__scopeId","data-v-add8f686"]]),_r=b({__name:"VPNavScreenMenuLink",props:{item:{}},setup(s){const e=ne("close-screen");return(t,n)=>(a(),$(E,{class:"VPNavScreenMenuLink",href:t.item.link,target:t.item.target,rel:t.item.rel,onClick:l(e)},{default:v(()=>[x(L(t.item.text),1)]),_:1},8,["href","target","rel","onClick"]))}});const vr=m(_r,[["__scopeId","data-v-05f27b2a"]]),pr={},hr={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},fr=c("path",{d:"M18.9,10.9h-6v-6c0-0.6-0.4-1-1-1s-1,0.4-1,1v6h-6c-0.6,0-1,0.4-1,1s0.4,1,1,1h6v6c0,0.6,0.4,1,1,1s1-0.4,1-1v-6h6c0.6,0,1-0.4,1-1S19.5,10.9,18.9,10.9z"},null,-1),mr=[fr];function gr(s,e){return a(),i("svg",hr,mr)}const br=m(pr,[["render",gr]]),$r=b({__name:"VPNavScreenMenuGroupLink",props:{item:{}},setup(s){const e=ne("close-screen");return(t,n)=>(a(),$(E,{class:"VPNavScreenMenuGroupLink",href:t.item.link,target:t.item.target,rel:t.item.rel,onClick:l(e)},{default:v(()=>[x(L(t.item.text),1)]),_:1},8,["href","target","rel","onClick"]))}});const xe=m($r,[["__scopeId","data-v-19976ae1"]]),kr={class:"VPNavScreenMenuGroupSection"},yr={key:0,class:"title"},Pr=b({__name:"VPNavScreenMenuGroupSection",props:{text:{},items:{}},setup(s){return(e,t)=>(a(),i("div",kr,[e.text?(a(),i("p",yr,L(e.text),1)):f("",!0),(a(!0),i(N,null,A(e.items,n=>(a(),$(xe,{key:n.text,item:n},null,8,["item"]))),128))]))}});const Vr=m(Pr,[["__scopeId","data-v-8133b170"]]),wr=["aria-controls","aria-expanded"],Lr={class:"button-text"},Sr=["id"],Mr={key:1,class:"group"},Nr=b({__name:"VPNavScreenMenuGroup",props:{text:{},items:{}},setup(s){const e=s,t=M(!1),n=k(()=>`NavScreenGroup-${e.text.replace(" ","-").toLowerCase()}`);function o(){t.value=!t.value}return(r,d)=>(a(),i("div",{class:T(["VPNavScreenMenuGroup",{open:t.value}])},[c("button",{class:"button","aria-controls":n.value,"aria-expanded":t.value,onClick:o},[c("span",Lr,L(r.text),1),h(br,{class:"button-icon"})],8,wr),c("div",{id:n.value,class:"items"},[(a(!0),i(N,null,A(r.items,p=>(a(),i(N,{key:p.text},["link"in p?(a(),i("div",{key:p.text,class:"item"},[h(xe,{item:p},null,8,["item"])])):(a(),i("div",Mr,[h(Vr,{text:p.text,items:p.items},null,8,["text","items"])]))],64))),128))],8,Sr)],2))}});const Ir=m(Nr,[["__scopeId","data-v-1ecb84e7"]]),Tr={key:0,class:"VPNavScreenMenu"},Cr=b({__name:"VPNavScreenMenu",setup(s){const{theme:e}=P();return(t,n)=>l(e).nav?(a(),i("nav",Tr,[(a(!0),i(N,null,A(l(e).nav,o=>(a(),i(N,{key:o.text},["link"in o?(a(),$(vr,{key:0,item:o},null,8,["item"])):(a(),$(Ir,{key:1,text:o.text||"",items:o.items},null,8,["text","items"]))],64))),128))])):f("",!0)}}),Br=b({__name:"VPNavScreenSocialLinks",setup(s){const{theme:e}=P();return(t,n)=>l(e).socialLinks?(a(),$($e,{key:0,class:"VPNavScreenSocialLinks",links:l(e).socialLinks},null,8,["links"])):f("",!0)}}),Ar={class:"list"},xr=b({__name:"VPNavScreenTranslations",setup(s){const{localeLinks:e,currentLang:t}=X({correspondingLink:!0}),n=M(!1);function o(){n.value=!n.value}return(r,d)=>l(e).length&&l(t).label?(a(),i("div",{key:0,class:T(["VPNavScreenTranslations",{open:n.value}])},[c("button",{class:"title",onClick:o},[h(Ae,{class:"icon lang"}),x(" "+L(l(t).label)+" ",1),h(Be,{class:"icon chevron"})]),c("ul",Ar,[(a(!0),i(N,null,A(l(e),p=>(a(),i("li",{key:p.link,class:"item"},[h(E,{class:"link",href:p.link},{default:v(()=>[x(L(p.text),1)]),_:2},1032,["href"])]))),128))])],2)):f("",!0)}});const Hr=m(xr,[["__scopeId","data-v-d72aa483"]]),zr={class:"container"},Dr=b({__name:"VPNavScreen",props:{open:{type:Boolean}},setup(s){const e=M(null),t=Se(q?document.body:null);return(n,o)=>(a(),$(ce,{name:"fade",onEnter:o[0]||(o[0]=r=>t.value=!0),onAfterLeave:o[1]||(o[1]=r=>t.value=!1)},{default:v(()=>[n.open?(a(),i("div",{key:0,class:"VPNavScreen",ref_key:"screen",ref:e,id:"VPNavScreen"},[c("div",zr,[u(n.$slots,"nav-screen-content-before",{},void 0,!0),h(Cr,{class:"menu"}),h(Hr,{class:"translations"}),h(dr,{class:"appearance"}),h(Br,{class:"social-links"}),u(n.$slots,"nav-screen-content-after",{},void 0,!0)])],512)):f("",!0)]),_:3}))}});const Er=m(Dr,[["__scopeId","data-v-cc5739dd"]]),Fr={key:0,class:"VPNav"},Or=b({__name:"VPNav",setup(s){const{isScreenOpen:e,closeScreen:t,toggleScreen:n}=Xn(),{frontmatter:o}=P(),r=k(()=>o.value.navbar!==!1);return Me("close-screen",t),te(()=>{q&&document.documentElement.classList.toggle("hide-nav",!r.value)}),(d,p)=>r.value?(a(),i("header",Fr,[h(lr,{"is-screen-open":l(e),onToggleScreen:l(n)},{"nav-bar-title-before":v(()=>[u(d.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":v(()=>[u(d.$slots,"nav-bar-title-after",{},void 0,!0)]),"nav-bar-content-before":v(()=>[u(d.$slots,"nav-bar-content-before",{},void 0,!0)]),"nav-bar-content-after":v(()=>[u(d.$slots,"nav-bar-content-after",{},void 0,!0)]),_:3},8,["is-screen-open","onToggleScreen"]),h(Er,{open:l(e)},{"nav-screen-content-before":v(()=>[u(d.$slots,"nav-screen-content-before",{},void 0,!0)]),"nav-screen-content-after":v(()=>[u(d.$slots,"nav-screen-content-after",{},void 0,!0)]),_:3},8,["open"])])):f("",!0)}});const Gr=m(Or,[["__scopeId","data-v-ae24b3ad"]]),Ur=s=>(H("data-v-e31bd47b"),s=s(),z(),s),jr=["role","tabindex"],Kr=Ur(()=>c("div",{class:"indicator"},null,-1)),Rr=["onKeydown"],qr={key:1,class:"items"},Wr=b({__name:"VPSidebarItem",props:{item:{},depth:{}},setup(s){const e=s,{collapsed:t,collapsible:n,isLink:o,isActiveLink:r,hasActiveLink:d,hasChildren:p,toggle:_}=gt(k(()=>e.item)),g=k(()=>p.value?"section":"div"),V=k(()=>o.value?"a":"div"),y=k(()=>p.value?e.depth+2===7?"p":`h${e.depth+2}`:"p"),I=k(()=>o.value?void 0:"button"),S=k(()=>[[`level-${e.depth}`],{collapsible:n.value},{collapsed:t.value},{"is-link":o.value},{"is-active":r.value},{"has-active":d.value}]);function C(w){"key"in w&&w.key!=="Enter"||!e.item.link&&_()}function B(){e.item.link&&_()}return(w,K)=>{const W=j("VPSidebarItem",!0);return a(),$(F(g.value),{class:T(["VPSidebarItem",S.value])},{default:v(()=>[w.item.text?(a(),i("div",Z({key:0,class:"item",role:I.value},Ye(w.item.items?{click:C,keydown:C}:{},!0),{tabindex:w.item.items&&0}),[Kr,w.item.link?(a(),$(E,{key:0,tag:V.value,class:"link",href:w.item.link,rel:w.item.rel,target:w.item.target},{default:v(()=>[(a(),$(F(y.value),{class:"text",innerHTML:w.item.text},null,8,["innerHTML"]))]),_:1},8,["tag","href","rel","target"])):(a(),$(F(y.value),{key:1,class:"text",innerHTML:w.item.text},null,8,["innerHTML"])),w.item.collapsed!=null?(a(),i("div",{key:2,class:"caret",role:"button","aria-label":"toggle section",onClick:B,onKeydown:We(B,["enter"]),tabindex:"0"},[h(fe,{class:"caret-icon"})],40,Rr)):f("",!0)],16,jr)):f("",!0),w.item.items&&w.item.items.length?(a(),i("div",qr,[w.depth<5?(a(!0),i(N,{key:0},A(w.item.items,R=>(a(),$(W,{key:R.text,item:R,depth:w.depth+1},null,8,["item","depth"]))),128)):f("",!0)])):f("",!0)]),_:1},8,["class"])}}});const Yr=m(Wr,[["__scopeId","data-v-e31bd47b"]]),He=s=>(H("data-v-b00e2fdd"),s=s(),z(),s),Jr=He(()=>c("div",{class:"curtain"},null,-1)),Xr={class:"nav",id:"VPSidebarNav","aria-labelledby":"sidebar-aria-label",tabindex:"-1"},Zr=He(()=>c("span",{class:"visually-hidden",id:"sidebar-aria-label"}," Sidebar Navigation ",-1)),Qr=b({__name:"VPSidebar",props:{open:{type:Boolean}},setup(s){const{sidebarGroups:e,hasSidebar:t}=D(),n=s,o=M(null),r=Se(q?document.body:null);return U([n,o],()=>{var d;n.open?(r.value=!0,(d=o.value)==null||d.focus()):r.value=!1},{immediate:!0,flush:"post"}),(d,p)=>l(t)?(a(),i("aside",{key:0,class:T(["VPSidebar",{open:d.open}]),ref_key:"navEl",ref:o,onClick:p[0]||(p[0]=Je(()=>{},["stop"]))},[Jr,c("nav",Xr,[Zr,u(d.$slots,"sidebar-nav-before",{},void 0,!0),(a(!0),i(N,null,A(l(e),_=>(a(),i("div",{key:_.text,class:"group"},[h(Yr,{item:_,depth:0},null,8,["item"])]))),128)),u(d.$slots,"sidebar-nav-after",{},void 0,!0)])],2)):f("",!0)}});const el=m(Qr,[["__scopeId","data-v-b00e2fdd"]]),tl=b({__name:"VPSkipLink",setup(s){const e=se(),t=M();U(()=>e.path,()=>t.value.focus());function n({target:o}){const r=document.getElementById(decodeURIComponent(o.hash).slice(1));if(r){const d=()=>{r.removeAttribute("tabindex"),r.removeEventListener("blur",d)};r.setAttribute("tabindex","-1"),r.addEventListener("blur",d),r.focus(),window.scrollTo(0,0)}}return(o,r)=>(a(),i(N,null,[c("span",{ref_key:"backToTop",ref:t,tabindex:"-1"},null,512),c("a",{href:"#VPContent",class:"VPSkipLink visually-hidden",onClick:n}," Skip to content ")],64))}});const sl=m(tl,[["__scopeId","data-v-0f60ec36"]]),nl=b({__name:"Layout",setup(s){const{isOpen:e,open:t,close:n}=D(),o=se();U(()=>o.path,n),mt(e,n);const{frontmatter:r}=P(),d=Xe(),p=k(()=>!!d["home-hero-image"]);return Me("hero-image-slot-exists",p),(_,g)=>{const V=j("Content");return l(r).layout!==!1?(a(),i("div",{key:0,class:T(["Layout",l(r).pageClass])},[u(_.$slots,"layout-top",{},void 0,!0),h(sl),h(st,{class:"backdrop",show:l(e),onClick:l(n)},null,8,["show","onClick"]),h(Gr,null,{"nav-bar-title-before":v(()=>[u(_.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":v(()=>[u(_.$slots,"nav-bar-title-after",{},void 0,!0)]),"nav-bar-content-before":v(()=>[u(_.$slots,"nav-bar-content-before",{},void 0,!0)]),"nav-bar-content-after":v(()=>[u(_.$slots,"nav-bar-content-after",{},void 0,!0)]),"nav-screen-content-before":v(()=>[u(_.$slots,"nav-screen-content-before",{},void 0,!0)]),"nav-screen-content-after":v(()=>[u(_.$slots,"nav-screen-content-after",{},void 0,!0)]),_:3}),h(Jn,{open:l(e),onOpenMenu:l(t)},null,8,["open","onOpenMenu"]),h(el,{open:l(e)},{"sidebar-nav-before":v(()=>[u(_.$slots,"sidebar-nav-before",{},void 0,!0)]),"sidebar-nav-after":v(()=>[u(_.$slots,"sidebar-nav-after",{},void 0,!0)]),_:3},8,["open"]),h(Mn,null,{"page-top":v(()=>[u(_.$slots,"page-top",{},void 0,!0)]),"page-bottom":v(()=>[u(_.$slots,"page-bottom",{},void 0,!0)]),"not-found":v(()=>[u(_.$slots,"not-found",{},void 0,!0)]),"home-hero-before":v(()=>[u(_.$slots,"home-hero-before",{},void 0,!0)]),"home-hero-info":v(()=>[u(_.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-image":v(()=>[u(_.$slots,"home-hero-image",{},void 0,!0)]),"home-hero-after":v(()=>[u(_.$slots,"home-hero-after",{},void 0,!0)]),"home-features-before":v(()=>[u(_.$slots,"home-features-before",{},void 0,!0)]),"home-features-after":v(()=>[u(_.$slots,"home-features-after",{},void 0,!0)]),"doc-footer-before":v(()=>[u(_.$slots,"doc-footer-before",{},void 0,!0)]),"doc-before":v(()=>[u(_.$slots,"doc-before",{},void 0,!0)]),"doc-after":v(()=>[u(_.$slots,"doc-after",{},void 0,!0)]),"doc-top":v(()=>[u(_.$slots,"doc-top",{},void 0,!0)]),"doc-bottom":v(()=>[u(_.$slots,"doc-bottom",{},void 0,!0)]),"aside-top":v(()=>[u(_.$slots,"aside-top",{},void 0,!0)]),"aside-bottom":v(()=>[u(_.$slots,"aside-bottom",{},void 0,!0)]),"aside-outline-before":v(()=>[u(_.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":v(()=>[u(_.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":v(()=>[u(_.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":v(()=>[u(_.$slots,"aside-ads-after",{},void 0,!0)]),_:3}),h(Bn),u(_.$slots,"layout-bottom",{},void 0,!0)],2)):(a(),$(V,{key:1}))}}});const ol=m(nl,[["__scopeId","data-v-5a346dfe"]]);const rl={Layout:ol,enhanceApp:({app:s})=>{s.component("Badge",Qe)}};export{Na as c,rl as t,P as u};
+import{d as b,o as a,c as i,r as u,n as T,a as x,t as L,_ as m,b as $,w as v,T as ce,e as f,u as ze,i as De,f as ue,g as k,h as M,j as G,k as c,l,p as H,m as z,q as O,s as q,v as re,x as U,y as te,z as de,A as Ve,B as Ee,C as j,F as N,D as A,E as _e,G as Y,H as h,I as F,J as we,K as se,L as Z,M as ne,N as Fe,O as Oe,P as Le,Q as Ge,R as Ue,S as je,U as Ke,V as ke,W as Re,X as qe,Y as Se,Z as Me,$ as We,a0 as Ye,a1 as Je,a2 as Xe}from"./framework.0e8ae64e.js";const Ze=b({__name:"VPBadge",props:{text:{},type:{default:"tip"}},setup(s){return(e,t)=>(a(),i("span",{class:T(["VPBadge",e.type])},[u(e.$slots,"default",{},()=>[x(L(e.text),1)],!0)],2))}});const Qe=m(Ze,[["__scopeId","data-v-9613cc9f"]]),et={key:0,class:"VPBackdrop"},tt=b({__name:"VPBackdrop",props:{show:{type:Boolean}},setup(s){return(e,t)=>(a(),$(ce,{name:"fade"},{default:v(()=>[e.show?(a(),i("div",et)):f("",!0)]),_:1}))}});const st=m(tt,[["__scopeId","data-v-c79a1216"]]),P=ze;function nt(s,e){let t,n=!1;return()=>{t&&clearTimeout(t),n?t=setTimeout(s,e):(s(),(n=!0)&&setTimeout(()=>n=!1,e))}}function le(s){return/^\//.test(s)?s:`/${s}`}function J(s){const{pathname:e,search:t,hash:n,protocol:o}=new URL(s,"http://a.com");if(De(s)||s.startsWith("#")||!o.startsWith("http")||/\.(?!html|md)\w+($|\?)/i.test(s))return s;const{site:r}=P(),d=e.endsWith("/")||e.endsWith(".html")?s:s.replace(/(?:(^\.+)\/)?.*$/,`$1${e.replace(/(\.md)?$/,r.value.cleanUrls?"":".html")}${t}${n}`);return ue(d)}function X({removeCurrent:s=!0,correspondingLink:e=!1}={}){const{site:t,localeIndex:n,page:o,theme:r}=P(),d=k(()=>{var _,g;return{label:(_=t.value.locales[n.value])==null?void 0:_.label,link:((g=t.value.locales[n.value])==null?void 0:g.link)||(n.value==="root"?"/":`/${n.value}/`)}});return{localeLinks:k(()=>Object.entries(t.value.locales).flatMap(([_,g])=>s&&d.value.label===g.label?[]:{text:g.label,link:ot(g.link||(_==="root"?"/":`/${_}/`),r.value.i18nRouting!==!1&&e,o.value.relativePath.slice(d.value.link.length-1),!t.value.cleanUrls)})),currentLang:d}}function ot(s,e,t,n){return e?s.replace(/\/$/,"")+le(t.replace(/(^|\/)index\.md$/,"$1").replace(/\.md$/,n?".html":"")):s}const at=s=>(H("data-v-f87ff6e4"),s=s(),z(),s),rt={class:"NotFound"},lt={class:"code"},it={class:"title"},ct=at(()=>c("div",{class:"divider"},null,-1)),ut={class:"quote"},dt={class:"action"},_t=["href","aria-label"],vt=b({__name:"NotFound",setup(s){const{site:e,theme:t}=P(),{localeLinks:n}=X({removeCurrent:!1}),o=M("/");return G(()=>{var d;const r=window.location.pathname.replace(e.value.base,"").replace(/(^.*?\/).*$/,"/$1");n.value.length&&(o.value=((d=n.value.find(({link:p})=>p.startsWith(r)))==null?void 0:d.link)||n.value[0].link)}),(r,d)=>{var p,_,g,V,y;return a(),i("div",rt,[c("p",lt,L(((p=l(t).notFound)==null?void 0:p.code)??"404"),1),c("h1",it,L(((_=l(t).notFound)==null?void 0:_.title)??"PAGE NOT FOUND"),1),ct,c("blockquote",ut,L(((g=l(t).notFound)==null?void 0:g.quote)??"But if you don't change your direction, and if you keep looking, you may end up where you are heading."),1),c("div",dt,[c("a",{class:"link",href:l(ue)(o.value),"aria-label":((V=l(t).notFound)==null?void 0:V.linkLabel)??"go to home"},L(((y=l(t).notFound)==null?void 0:y.linkText)??"Take me home"),9,_t)])])}}});const pt=m(vt,[["__scopeId","data-v-f87ff6e4"]]);function Ne(s,e){if(Array.isArray(s))return Q(s);if(s==null)return[];e=le(e);const t=Object.keys(s).sort((o,r)=>r.split("/").length-o.split("/").length).find(o=>e.startsWith(le(o))),n=t?s[t]:[];return Array.isArray(n)?Q(n):Q(n.items,n.base)}function ht(s){const e=[];let t=0;for(const n in s){const o=s[n];if(o.items){t=e.push(o);continue}e[t]||e.push({items:[]}),e[t].items.push(o)}return e}function ft(s){const e=[];function t(n){for(const o of n)o.text&&o.link&&e.push({text:o.text,link:o.link,docFooterText:o.docFooterText}),o.items&&t(o.items)}return t(s),e}function ie(s,e){return Array.isArray(e)?e.some(t=>ie(s,t)):O(s,e.link)?!0:e.items?ie(s,e.items):!1}function Q(s,e){return[...s].map(t=>{const n={...t},o=n.base||e;return o&&n.link&&(n.link=o+n.link),n.items&&(n.items=Q(n.items,o)),n})}function D(){const{frontmatter:s,page:e,theme:t}=P(),n=re("(min-width: 960px)"),o=M(!1),r=k(()=>{const B=t.value.sidebar,w=e.value.relativePath;return B?Ne(B,w):[]}),d=M(r.value);U(r,(B,w)=>{JSON.stringify(B)!==JSON.stringify(w)&&(d.value=r.value)});const p=k(()=>s.value.sidebar!==!1&&d.value.length>0&&s.value.layout!=="home"),_=k(()=>g?s.value.aside==null?t.value.aside==="left":s.value.aside==="left":!1),g=k(()=>s.value.layout==="home"?!1:s.value.aside!=null?!!s.value.aside:t.value.aside!==!1),V=k(()=>p.value&&n.value),y=k(()=>p.value?ht(d.value):[]);function I(){o.value=!0}function S(){o.value=!1}function C(){o.value?S():I()}return{isOpen:o,sidebar:d,sidebarGroups:y,hasSidebar:p,hasAside:g,leftAside:_,isSidebarEnabled:V,open:I,close:S,toggle:C}}function mt(s,e){let t;te(()=>{t=s.value?document.activeElement:void 0}),G(()=>{window.addEventListener("keyup",n)}),de(()=>{window.removeEventListener("keyup",n)});function n(o){o.key==="Escape"&&s.value&&(e(),t==null||t.focus())}}const Ie=M(q?location.hash:"");q&&window.addEventListener("hashchange",()=>{Ie.value=location.hash});function gt(s){const{page:e}=P(),t=M(!1),n=k(()=>s.value.collapsed!=null),o=k(()=>!!s.value.link),r=M(!1),d=()=>{r.value=O(e.value.relativePath,s.value.link)};U([e,s,Ie],d),G(d);const p=k(()=>r.value?!0:s.value.items?ie(e.value.relativePath,s.value.items):!1),_=k(()=>!!(s.value.items&&s.value.items.length));te(()=>{t.value=!!(n.value&&s.value.collapsed)}),Ve(()=>{(r.value||p.value)&&(t.value=!1)});function g(){n.value&&(t.value=!t.value)}return{collapsed:t,collapsible:n,isLink:o,isActiveLink:r,hasActiveLink:p,hasChildren:_,toggle:g}}function bt(){const{hasSidebar:s}=D(),e=re("(min-width: 960px)"),t=re("(min-width: 1280px)");return{isAsideEnabled:k(()=>!t.value&&!e.value?!1:s.value?t.value:e.value)}}const $t=71;function ve(s){return typeof s.outline=="object"&&!Array.isArray(s.outline)&&s.outline.label||s.outlineTitle||"On this page"}function pe(s){const e=[...document.querySelectorAll(".VPDoc :where(h1,h2,h3,h4,h5,h6)")].filter(t=>t.id&&t.hasChildNodes()).map(t=>{const n=Number(t.tagName[1]);return{title:kt(t),link:"#"+t.id,level:n}});return yt(e,s)}function kt(s){let e="";for(const t of s.childNodes)if(t.nodeType===1){if(t.classList.contains("VPBadge")||t.classList.contains("header-anchor"))continue;e+=t.textContent}else t.nodeType===3&&(e+=t.textContent);return e.trim()}function yt(s,e){if(e===!1)return[];const t=(typeof e=="object"&&!Array.isArray(e)?e.level:e)||2,[n,o]=typeof t=="number"?[t,t]:t==="deep"?[2,6]:t;s=s.filter(d=>d.level>=n&&d.level<=o);const r=[];e:for(let d=0;d<s.length;d++){const p=s[d];if(d===0)r.push(p);else{for(let _=d-1;_>=0;_--){const g=s[_];if(g.level<p.level){(g.children||(g.children=[])).push(p);continue e}}r.push(p)}}return r}function Pt(s,e){const{isAsideEnabled:t}=bt(),n=nt(r,100);let o=null;G(()=>{requestAnimationFrame(r),window.addEventListener("scroll",n)}),Ee(()=>{d(location.hash)}),de(()=>{window.removeEventListener("scroll",n)});function r(){if(!t.value)return;const p=[].slice.call(s.value.querySelectorAll(".outline-link")),_=[].slice.call(document.querySelectorAll(".content .header-anchor")).filter(S=>p.some(C=>C.hash===S.hash&&S.offsetParent!==null)),g=window.scrollY,V=window.innerHeight,y=document.body.offsetHeight,I=Math.abs(g+V-y)<1;if(_.length&&I){d(_[_.length-1].hash);return}for(let S=0;S<_.length;S++){const C=_[S],B=_[S+1],[w,K]=Vt(S,C,B);if(w){d(K);return}}}function d(p){o&&o.classList.remove("active"),p==null?o=null:o=s.value.querySelector(`a[href="${decodeURIComponent(p)}"]`);const _=o;_?(_.classList.add("active"),e.value.style.top=_.offsetTop+33+"px",e.value.style.opacity="1"):(e.value.style.top="33px",e.value.style.opacity="0")}}function ye(s){return s.parentElement.offsetTop-$t}function Vt(s,e,t){const n=window.scrollY;return s===0&&n===0?[!0,null]:n<ye(e)?[!1,null]:!t||n<ye(t)?[!0,e.hash]:[!1,null]}const wt=["href","title"],Lt=b({__name:"VPDocOutlineItem",props:{headers:{},root:{type:Boolean}},setup(s){function e({target:t}){const n=t.href.split("#")[1],o=document.getElementById(decodeURIComponent(n));o==null||o.focus({preventScroll:!0})}return(t,n)=>{const o=j("VPDocOutlineItem",!0);return a(),i("ul",{class:T(t.root?"root":"nested")},[(a(!0),i(N,null,A(t.headers,({children:r,link:d,title:p})=>(a(),i("li",null,[c("a",{class:"outline-link",href:d,onClick:e,title:p},L(p),9,wt),r!=null&&r.length?(a(),$(o,{key:0,headers:r},null,8,["headers"])):f("",!0)]))),256))],2)}}});const he=m(Lt,[["__scopeId","data-v-d0ee3533"]]),St=s=>(H("data-v-d330b1bb"),s=s(),z(),s),Mt={class:"content"},Nt={class:"outline-title",role:"heading","aria-level":"2"},It={"aria-labelledby":"doc-outline-aria-label"},Tt=St(()=>c("span",{class:"visually-hidden",id:"doc-outline-aria-label"}," Table of Contents for current page ",-1)),Ct=b({__name:"VPDocAsideOutline",setup(s){const{frontmatter:e,theme:t}=P(),n=_e([]);Y(()=>{n.value=pe(e.value.outline??t.value.outline)});const o=M(),r=M();return Pt(o,r),(d,p)=>(a(),i("div",{class:T(["VPDocAsideOutline",{"has-outline":n.value.length>0}]),ref_key:"container",ref:o,role:"navigation"},[c("div",Mt,[c("div",{class:"outline-marker",ref_key:"marker",ref:r},null,512),c("div",Nt,L(l(ve)(l(t))),1),c("nav",It,[Tt,h(he,{headers:n.value,root:!0},null,8,["headers"])])])],2))}});const Bt=m(Ct,[["__scopeId","data-v-d330b1bb"]]),At={class:"VPDocAsideCarbonAds"},xt=b({__name:"VPDocAsideCarbonAds",props:{carbonAds:{}},setup(s){const e=()=>null;return(t,n)=>(a(),i("div",At,[h(l(e),{"carbon-ads":t.carbonAds},null,8,["carbon-ads"])]))}}),Ht=s=>(H("data-v-3f215769"),s=s(),z(),s),zt={class:"VPDocAside"},Dt=Ht(()=>c("div",{class:"spacer"},null,-1)),Et=b({__name:"VPDocAside",setup(s){const{theme:e}=P();return(t,n)=>(a(),i("div",zt,[u(t.$slots,"aside-top",{},void 0,!0),u(t.$slots,"aside-outline-before",{},void 0,!0),h(Bt),u(t.$slots,"aside-outline-after",{},void 0,!0),Dt,u(t.$slots,"aside-ads-before",{},void 0,!0),l(e).carbonAds?(a(),$(xt,{key:0,"carbon-ads":l(e).carbonAds},null,8,["carbon-ads"])):f("",!0),u(t.$slots,"aside-ads-after",{},void 0,!0),u(t.$slots,"aside-bottom",{},void 0,!0)]))}});const Ft=m(Et,[["__scopeId","data-v-3f215769"]]);function Ot(){const{theme:s,page:e}=P();return k(()=>{const{text:t="Edit this page",pattern:n=""}=s.value.editLink||{};let o;return typeof n=="function"?o=n(e.value):o=n.replace(/:path/g,e.value.filePath),{url:o,text:t}})}function Gt(){const{page:s,theme:e,frontmatter:t}=P();return k(()=>{var _,g,V,y,I,S,C,B;const n=Ne(e.value.sidebar,s.value.relativePath),o=ft(n),r=o.findIndex(w=>O(s.value.relativePath,w.link)),d=((_=e.value.docFooter)==null?void 0:_.prev)===!1&&!t.value.prev||t.value.prev===!1,p=((g=e.value.docFooter)==null?void 0:g.next)===!1&&!t.value.next||t.value.next===!1;return{prev:d?void 0:{text:(typeof t.value.prev=="string"?t.value.prev:typeof t.value.prev=="object"?t.value.prev.text:void 0)??((V=o[r-1])==null?void 0:V.docFooterText)??((y=o[r-1])==null?void 0:y.text),link:(typeof t.value.prev=="object"?t.value.prev.link:void 0)??((I=o[r-1])==null?void 0:I.link)},next:p?void 0:{text:(typeof t.value.next=="string"?t.value.next:typeof t.value.next=="object"?t.value.next.text:void 0)??((S=o[r+1])==null?void 0:S.docFooterText)??((C=o[r+1])==null?void 0:C.text),link:(typeof t.value.next=="object"?t.value.next.link:void 0)??((B=o[r+1])==null?void 0:B.link)}}})}const Ut={},jt={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},Kt=c("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"},null,-1),Rt=c("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"},null,-1),qt=[Kt,Rt];function Wt(s,e){return a(),i("svg",jt,qt)}const Yt=m(Ut,[["render",Wt]]),E=b({__name:"VPLink",props:{tag:{},href:{},noIcon:{type:Boolean},target:{},rel:{}},setup(s){const e=s,t=k(()=>e.tag??(e.href?"a":"span")),n=k(()=>e.href&&we.test(e.href));return(o,r)=>(a(),$(F(t.value),{class:T(["VPLink",{link:o.href,"vp-external-link-icon":n.value,"no-icon":o.noIcon}]),href:o.href?l(J)(o.href):void 0,target:o.target??(n.value?"_blank":void 0),rel:o.rel??(n.value?"noreferrer":void 0)},{default:v(()=>[u(o.$slots,"default")]),_:3},8,["class","href","target","rel"]))}}),Jt={class:"VPLastUpdated"},Xt=["datetime"],Zt=b({__name:"VPDocFooterLastUpdated",setup(s){const{theme:e,page:t,frontmatter:n,lang:o}=P(),r=k(()=>new Date(n.value.lastUpdated??t.value.lastUpdated)),d=k(()=>r.value.toISOString()),p=M("");return G(()=>{te(()=>{var _,g,V;p.value=new Intl.DateTimeFormat((g=(_=e.value.lastUpdated)==null?void 0:_.formatOptions)!=null&&g.forceLocale?o.value:void 0,((V=e.value.lastUpdated)==null?void 0:V.formatOptions)??{dateStyle:"short",timeStyle:"short"}).format(r.value)})}),(_,g)=>{var V;return a(),i("p",Jt,[x(L(((V=l(e).lastUpdated)==null?void 0:V.text)||l(e).lastUpdatedText||"Last updated")+": ",1),c("time",{datetime:d.value},L(p.value),9,Xt)])}}});const Qt=m(Zt,[["__scopeId","data-v-7e05ebdb"]]),es={key:0,class:"VPDocFooter"},ts={key:0,class:"edit-info"},ss={key:0,class:"edit-link"},ns={key:1,class:"last-updated"},os={key:1,class:"prev-next"},as={class:"pager"},rs=["href"],ls=["innerHTML"],is=["innerHTML"],cs={class:"pager"},us=["href"],ds=["innerHTML"],_s=["innerHTML"],vs=b({__name:"VPDocFooter",setup(s){const{theme:e,page:t,frontmatter:n}=P(),o=Ot(),r=Gt(),d=k(()=>e.value.editLink&&n.value.editLink!==!1),p=k(()=>t.value.lastUpdated&&n.value.lastUpdated!==!1),_=k(()=>d.value||p.value||r.value.prev||r.value.next);return(g,V)=>{var y,I,S,C,B,w;return _.value?(a(),i("footer",es,[u(g.$slots,"doc-footer-before",{},void 0,!0),d.value||p.value?(a(),i("div",ts,[d.value?(a(),i("div",ss,[h(E,{class:"edit-link-button",href:l(o).url,"no-icon":!0},{default:v(()=>[h(Yt,{class:"edit-link-icon","aria-label":"edit icon"}),x(" "+L(l(o).text),1)]),_:1},8,["href"])])):f("",!0),p.value?(a(),i("div",ns,[h(Qt)])):f("",!0)])):f("",!0),(y=l(r).prev)!=null&&y.link||(I=l(r).next)!=null&&I.link?(a(),i("nav",os,[c("div",as,[(S=l(r).prev)!=null&&S.link?(a(),i("a",{key:0,class:"pager-link prev",href:l(J)(l(r).prev.link)},[c("span",{class:"desc",innerHTML:((C=l(e).docFooter)==null?void 0:C.prev)||"Previous page"},null,8,ls),c("span",{class:"title",innerHTML:l(r).prev.text},null,8,is)],8,rs)):f("",!0)]),c("div",cs,[(B=l(r).next)!=null&&B.link?(a(),i("a",{key:0,class:"pager-link next",href:l(J)(l(r).next.link)},[c("span",{class:"desc",innerHTML:((w=l(e).docFooter)==null?void 0:w.next)||"Next page"},null,8,ds),c("span",{class:"title",innerHTML:l(r).next.text},null,8,_s)],8,us)):f("",!0)])])):f("",!0)])):f("",!0)}}});const ps=m(vs,[["__scopeId","data-v-ef5dee53"]]),hs={},fs={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},ms=c("path",{d:"M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"},null,-1),gs=[ms];function bs(s,e){return a(),i("svg",fs,gs)}const fe=m(hs,[["render",bs]]),$s={key:0,class:"VPDocOutlineDropdown"},ks={key:0,class:"items"},ys=b({__name:"VPDocOutlineDropdown",setup(s){const{frontmatter:e,theme:t}=P(),n=M(!1);Y(()=>{n.value=!1});const o=_e([]);return Y(()=>{o.value=pe(e.value.outline??t.value.outline)}),(r,d)=>o.value.length>0?(a(),i("div",$s,[c("button",{onClick:d[0]||(d[0]=p=>n.value=!n.value),class:T({open:n.value})},[x(L(l(ve)(l(t)))+" ",1),h(fe,{class:"icon"})],2),n.value?(a(),i("div",ks,[h(he,{headers:o.value},null,8,["headers"])])):f("",!0)])):f("",!0)}});const Ps=m(ys,[["__scopeId","data-v-eadfb36b"]]),Vs=s=>(H("data-v-6b87e69f"),s=s(),z(),s),ws={class:"container"},Ls=Vs(()=>c("div",{class:"aside-curtain"},null,-1)),Ss={class:"aside-container"},Ms={class:"aside-content"},Ns={class:"content"},Is={class:"content-container"},Ts={class:"main"},Cs=b({__name:"VPDoc",setup(s){const{theme:e}=P(),t=se(),{hasSidebar:n,hasAside:o,leftAside:r}=D(),d=k(()=>t.path.replace(/[./]+/g,"_").replace(/_html$/,""));return(p,_)=>{const g=j("Content");return a(),i("div",{class:T(["VPDoc",{"has-sidebar":l(n),"has-aside":l(o)}])},[u(p.$slots,"doc-top",{},void 0,!0),c("div",ws,[l(o)?(a(),i("div",{key:0,class:T(["aside",{"left-aside":l(r)}])},[Ls,c("div",Ss,[c("div",Ms,[h(Ft,null,{"aside-top":v(()=>[u(p.$slots,"aside-top",{},void 0,!0)]),"aside-bottom":v(()=>[u(p.$slots,"aside-bottom",{},void 0,!0)]),"aside-outline-before":v(()=>[u(p.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":v(()=>[u(p.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":v(()=>[u(p.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":v(()=>[u(p.$slots,"aside-ads-after",{},void 0,!0)]),_:3})])])],2)):f("",!0),c("div",Ns,[c("div",Is,[u(p.$slots,"doc-before",{},void 0,!0),h(Ps),c("main",Ts,[h(g,{class:T(["vp-doc",[d.value,l(e).externalLinkIcon&&"external-link-icon-enabled"]])},null,8,["class"])]),h(ps,null,{"doc-footer-before":v(()=>[u(p.$slots,"doc-footer-before",{},void 0,!0)]),_:3}),u(p.$slots,"doc-after",{},void 0,!0)])])]),u(p.$slots,"doc-bottom",{},void 0,!0)],2)}}});const Bs=m(Cs,[["__scopeId","data-v-6b87e69f"]]),As=b({__name:"VPButton",props:{tag:{},size:{default:"medium"},theme:{default:"brand"},text:{},href:{}},setup(s){const e=s,t=k(()=>e.href&&we.test(e.href)),n=k(()=>e.tag||e.href?"a":"button");return(o,r)=>(a(),$(F(n.value),{class:T(["VPButton",[o.size,o.theme]]),href:o.href?l(J)(o.href):void 0,target:t.value?"_blank":void 0,rel:t.value?"noreferrer":void 0},{default:v(()=>[x(L(o.text),1)]),_:1},8,["class","href","target","rel"]))}});const xs=m(As,[["__scopeId","data-v-c1c5efc1"]]),Hs=["src","alt"],zs=b({inheritAttrs:!1,__name:"VPImage",props:{image:{},alt:{}},setup(s){return(e,t)=>{const n=j("VPImage",!0);return e.image?(a(),i(N,{key:0},[typeof e.image=="string"||"src"in e.image?(a(),i("img",Z({key:0,class:"VPImage"},typeof e.image=="string"?e.$attrs:{...e.image,...e.$attrs},{src:l(ue)(typeof e.image=="string"?e.image:e.image.src),alt:e.alt??(typeof e.image=="string"?"":e.image.alt||"")}),null,16,Hs)):(a(),i(N,{key:1},[h(n,Z({class:"dark",image:e.image.dark,alt:e.image.alt},e.$attrs),null,16,["image","alt"]),h(n,Z({class:"light",image:e.image.light,alt:e.image.alt},e.$attrs),null,16,["image","alt"])],64))],64)):f("",!0)}}});const ee=m(zs,[["__scopeId","data-v-8426fc1a"]]),Ds=s=>(H("data-v-da5d1713"),s=s(),z(),s),Es={class:"container"},Fs={class:"main"},Os={key:0,class:"name"},Gs=["innerHTML"],Us=["innerHTML"],js=["innerHTML"],Ks={key:0,class:"actions"},Rs={key:0,class:"image"},qs={class:"image-container"},Ws=Ds(()=>c("div",{class:"image-bg"},null,-1)),Ys=b({__name:"VPHero",props:{name:{},text:{},tagline:{},image:{},actions:{}},setup(s){const e=ne("hero-image-slot-exists");return(t,n)=>(a(),i("div",{class:T(["VPHero",{"has-image":t.image||l(e)}])},[c("div",Es,[c("div",Fs,[u(t.$slots,"home-hero-info",{},()=>[t.name?(a(),i("h1",Os,[c("span",{innerHTML:t.name,class:"clip"},null,8,Gs)])):f("",!0),t.text?(a(),i("p",{key:1,innerHTML:t.text,class:"text"},null,8,Us)):f("",!0),t.tagline?(a(),i("p",{key:2,innerHTML:t.tagline,class:"tagline"},null,8,js)):f("",!0)],!0),t.actions?(a(),i("div",Ks,[(a(!0),i(N,null,A(t.actions,o=>(a(),i("div",{key:o.link,class:"action"},[h(xs,{tag:"a",size:"medium",theme:o.theme,text:o.text,href:o.link},null,8,["theme","text","href"])]))),128))])):f("",!0)]),t.image||l(e)?(a(),i("div",Rs,[c("div",qs,[Ws,u(t.$slots,"home-hero-image",{},()=>[t.image?(a(),$(ee,{key:0,class:"image-src",image:t.image},null,8,["image"])):f("",!0)],!0)])])):f("",!0)])],2))}});const Js=m(Ys,[["__scopeId","data-v-da5d1713"]]),Xs=b({__name:"VPHomeHero",setup(s){const{frontmatter:e}=P();return(t,n)=>l(e).hero?(a(),$(Js,{key:0,class:"VPHomeHero",name:l(e).hero.name,text:l(e).hero.text,tagline:l(e).hero.tagline,image:l(e).hero.image,actions:l(e).hero.actions},{"home-hero-info":v(()=>[u(t.$slots,"home-hero-info")]),"home-hero-image":v(()=>[u(t.$slots,"home-hero-image")]),_:3},8,["name","text","tagline","image","actions"])):f("",!0)}}),Zs={},Qs={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24"},en=c("path",{d:"M19.9,12.4c0.1-0.2,0.1-0.5,0-0.8c-0.1-0.1-0.1-0.2-0.2-0.3l-7-7c-0.4-0.4-1-0.4-1.4,0s-0.4,1,0,1.4l5.3,5.3H5c-0.6,0-1,0.4-1,1s0.4,1,1,1h11.6l-5.3,5.3c-0.4,0.4-0.4,1,0,1.4c0.2,0.2,0.5,0.3,0.7,0.3s0.5-0.1,0.7-0.3l7-7C19.8,12.6,19.9,12.5,19.9,12.4z"},null,-1),tn=[en];function sn(s,e){return a(),i("svg",Qs,tn)}const nn=m(Zs,[["render",sn]]),on={class:"box"},an={key:0,class:"icon"},rn=["innerHTML"],ln=["innerHTML"],cn=["innerHTML"],un={key:4,class:"link-text"},dn={class:"link-text-value"},_n=b({__name:"VPFeature",props:{icon:{},title:{},details:{},link:{},linkText:{},rel:{},target:{}},setup(s){return(e,t)=>(a(),$(E,{class:"VPFeature",href:e.link,rel:e.rel,target:e.target,"no-icon":!0,tag:e.link?"a":"div"},{default:v(()=>[c("article",on,[typeof e.icon=="object"&&e.icon.wrap?(a(),i("div",an,[h(ee,{image:e.icon,alt:e.icon.alt,height:e.icon.height||48,width:e.icon.width||48},null,8,["image","alt","height","width"])])):typeof e.icon=="object"?(a(),$(ee,{key:1,image:e.icon,alt:e.icon.alt,height:e.icon.height||48,width:e.icon.width||48},null,8,["image","alt","height","width"])):e.icon?(a(),i("div",{key:2,class:"icon",innerHTML:e.icon},null,8,rn)):f("",!0),c("h2",{class:"title",innerHTML:e.title},null,8,ln),e.details?(a(),i("p",{key:3,class:"details",innerHTML:e.details},null,8,cn)):f("",!0),e.linkText?(a(),i("div",un,[c("p",dn,[x(L(e.linkText)+" ",1),h(nn,{class:"link-text-icon"})])])):f("",!0)])]),_:1},8,["href","rel","target","tag"]))}});const vn=m(_n,[["__scopeId","data-v-33204567"]]),pn={key:0,class:"VPFeatures"},hn={class:"container"},fn={class:"items"},mn=b({__name:"VPFeatures",props:{features:{}},setup(s){const e=s,t=k(()=>{const n=e.features.length;if(n){if(n===2)return"grid-2";if(n===3)return"grid-3";if(n%3===0)return"grid-6";if(n>3)return"grid-4"}else return});return(n,o)=>n.features?(a(),i("div",pn,[c("div",hn,[c("div",fn,[(a(!0),i(N,null,A(n.features,r=>(a(),i("div",{key:r.title,class:T(["item",[t.value]])},[h(vn,{icon:r.icon,title:r.title,details:r.details,link:r.link,"link-text":r.linkText,rel:r.rel,target:r.target},null,8,["icon","title","details","link","link-text","rel","target"])],2))),128))])])])):f("",!0)}});const gn=m(mn,[["__scopeId","data-v-a6181336"]]),bn=b({__name:"VPHomeFeatures",setup(s){const{frontmatter:e}=P();return(t,n)=>l(e).features?(a(),$(gn,{key:0,class:"VPHomeFeatures",features:l(e).features},null,8,["features"])):f("",!0)}}),$n={class:"VPHome"},kn=b({__name:"VPHome",setup(s){return(e,t)=>{const n=j("Content");return a(),i("div",$n,[u(e.$slots,"home-hero-before",{},void 0,!0),h(Xs,null,{"home-hero-info":v(()=>[u(e.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-image":v(()=>[u(e.$slots,"home-hero-image",{},void 0,!0)]),_:3}),u(e.$slots,"home-hero-after",{},void 0,!0),u(e.$slots,"home-features-before",{},void 0,!0),h(bn),u(e.$slots,"home-features-after",{},void 0,!0),h(n)])}}});const yn=m(kn,[["__scopeId","data-v-d82743a8"]]),Pn={},Vn={class:"VPPage"};function wn(s,e){const t=j("Content");return a(),i("div",Vn,[u(s.$slots,"page-top"),h(t),u(s.$slots,"page-bottom")])}const Ln=m(Pn,[["render",wn]]),Sn=b({__name:"VPContent",setup(s){const{page:e,frontmatter:t}=P(),{hasSidebar:n}=D();return(o,r)=>(a(),i("div",{class:T(["VPContent",{"has-sidebar":l(n),"is-home":l(t).layout==="home"}]),id:"VPContent"},[l(e).isNotFound?u(o.$slots,"not-found",{key:0},()=>[h(pt)],!0):l(t).layout==="page"?(a(),$(Ln,{key:1},{"page-top":v(()=>[u(o.$slots,"page-top",{},void 0,!0)]),"page-bottom":v(()=>[u(o.$slots,"page-bottom",{},void 0,!0)]),_:3})):l(t).layout==="home"?(a(),$(yn,{key:2},{"home-hero-before":v(()=>[u(o.$slots,"home-hero-before",{},void 0,!0)]),"home-hero-info":v(()=>[u(o.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-image":v(()=>[u(o.$slots,"home-hero-image",{},void 0,!0)]),"home-hero-after":v(()=>[u(o.$slots,"home-hero-after",{},void 0,!0)]),"home-features-before":v(()=>[u(o.$slots,"home-features-before",{},void 0,!0)]),"home-features-after":v(()=>[u(o.$slots,"home-features-after",{},void 0,!0)]),_:3})):l(t).layout&&l(t).layout!=="doc"?(a(),$(F(l(t).layout),{key:3})):(a(),$(Bs,{key:4},{"doc-top":v(()=>[u(o.$slots,"doc-top",{},void 0,!0)]),"doc-bottom":v(()=>[u(o.$slots,"doc-bottom",{},void 0,!0)]),"doc-footer-before":v(()=>[u(o.$slots,"doc-footer-before",{},void 0,!0)]),"doc-before":v(()=>[u(o.$slots,"doc-before",{},void 0,!0)]),"doc-after":v(()=>[u(o.$slots,"doc-after",{},void 0,!0)]),"aside-top":v(()=>[u(o.$slots,"aside-top",{},void 0,!0)]),"aside-outline-before":v(()=>[u(o.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":v(()=>[u(o.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":v(()=>[u(o.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":v(()=>[u(o.$slots,"aside-ads-after",{},void 0,!0)]),"aside-bottom":v(()=>[u(o.$slots,"aside-bottom",{},void 0,!0)]),_:3}))],2))}});const Mn=m(Sn,[["__scopeId","data-v-669faec9"]]),Nn={class:"container"},In=["innerHTML"],Tn=["innerHTML"],Cn=b({__name:"VPFooter",setup(s){const{theme:e,frontmatter:t}=P(),{hasSidebar:n}=D();return(o,r)=>l(e).footer&&l(t).footer!==!1?(a(),i("footer",{key:0,class:T(["VPFooter",{"has-sidebar":l(n)}])},[c("div",Nn,[l(e).footer.message?(a(),i("p",{key:0,class:"message",innerHTML:l(e).footer.message},null,8,In)):f("",!0),l(e).footer.copyright?(a(),i("p",{key:1,class:"copyright",innerHTML:l(e).footer.copyright},null,8,Tn)):f("",!0)])],2)):f("",!0)}});const Bn=m(Cn,[["__scopeId","data-v-e03eb2e1"]]),An={class:"header"},xn={class:"outline"},Hn=b({__name:"VPLocalNavOutlineDropdown",props:{headers:{},navHeight:{}},setup(s){const e=s,{theme:t}=P(),n=M(!1),o=M(0),r=M();Y(()=>{n.value=!1});function d(){n.value=!n.value,o.value=window.innerHeight+Math.min(window.scrollY-e.navHeight,0)}function p(g){g.target.classList.contains("outline-link")&&(r.value&&(r.value.style.transition="none"),Oe(()=>{n.value=!1}))}function _(){n.value=!1,window.scrollTo({top:0,left:0,behavior:"smooth"})}return(g,V)=>(a(),i("div",{class:"VPLocalNavOutlineDropdown",style:Fe({"--vp-vh":o.value+"px"})},[g.headers.length>0?(a(),i("button",{key:0,onClick:d,class:T({open:n.value})},[x(L(l(ve)(l(t)))+" ",1),h(fe,{class:"icon"})],2)):(a(),i("button",{key:1,onClick:_},L(l(t).returnToTopLabel||"Return to top"),1)),h(ce,{name:"flyout"},{default:v(()=>[n.value?(a(),i("div",{key:0,ref_key:"items",ref:r,class:"items",onClick:p},[c("div",An,[c("a",{class:"top-link",href:"#",onClick:_},L(l(t).returnToTopLabel||"Return to top"),1)]),c("div",xn,[h(he,{headers:g.headers},null,8,["headers"])])],512)):f("",!0)]),_:1})],4))}});const zn=m(Hn,[["__scopeId","data-v-1c15a60a"]]),Dn={},En={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},Fn=c("path",{d:"M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"},null,-1),On=c("path",{d:"M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"},null,-1),Gn=c("path",{d:"M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"},null,-1),Un=c("path",{d:"M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"},null,-1),jn=[Fn,On,Gn,Un];function Kn(s,e){return a(),i("svg",En,jn)}const Rn=m(Dn,[["render",Kn]]),qn=["aria-expanded"],Wn={class:"menu-text"},Yn=b({__name:"VPLocalNav",props:{open:{type:Boolean}},emits:["open-menu"],setup(s){const{theme:e,frontmatter:t}=P(),{hasSidebar:n}=D(),{y:o}=Le(),r=_e([]),d=M(0);G(()=>{d.value=parseInt(getComputedStyle(document.documentElement).getPropertyValue("--vp-nav-height"))}),Y(()=>{r.value=pe(t.value.outline??e.value.outline)});const p=k(()=>r.value.length===0&&!n.value),_=k(()=>({VPLocalNav:!0,fixed:p.value,"reached-top":o.value>=d.value}));return(g,V)=>l(t).layout!=="home"&&(!p.value||l(o)>=d.value)?(a(),i("div",{key:0,class:T(_.value)},[l(n)?(a(),i("button",{key:0,class:"menu","aria-expanded":g.open,"aria-controls":"VPSidebarNav",onClick:V[0]||(V[0]=y=>g.$emit("open-menu"))},[h(Rn,{class:"menu-icon"}),c("span",Wn,L(l(e).sidebarMenuLabel||"Menu"),1)],8,qn)):f("",!0),h(zn,{headers:r.value,navHeight:d.value},null,8,["headers","navHeight"])],2)):f("",!0)}});const Jn=m(Yn,[["__scopeId","data-v-79c8c1df"]]);function Xn(){const s=M(!1);function e(){s.value=!0,window.addEventListener("resize",o)}function t(){s.value=!1,window.removeEventListener("resize",o)}function n(){s.value?t():e()}function o(){window.outerWidth>=768&&t()}const r=se();return U(()=>r.path,t),{isScreenOpen:s,openScreen:e,closeScreen:t,toggleScreen:n}}const Zn={},Qn={class:"VPSwitch",type:"button",role:"switch"},eo={class:"check"},to={key:0,class:"icon"};function so(s,e){return a(),i("button",Qn,[c("span",eo,[s.$slots.default?(a(),i("span",to,[u(s.$slots,"default",{},void 0,!0)])):f("",!0)])])}const no=m(Zn,[["render",so],["__scopeId","data-v-b1685198"]]),oo={},ao={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},ro=c("path",{d:"M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"},null,-1),lo=[ro];function io(s,e){return a(),i("svg",ao,lo)}const co=m(oo,[["render",io]]),uo={},_o={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},vo=Ge('<path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path>',9),po=[vo];function ho(s,e){return a(),i("svg",_o,po)}const fo=m(uo,[["render",ho]]),mo=b({__name:"VPSwitchAppearance",setup(s){const{isDark:e}=P(),t=ne("toggle-appearance",()=>{e.value=!e.value});return(n,o)=>(a(),$(no,{title:"toggle dark mode",class:"VPSwitchAppearance","aria-checked":l(e),onClick:l(t)},{default:v(()=>[h(fo,{class:"sun"}),h(co,{class:"moon"})]),_:1},8,["aria-checked","onClick"]))}});const me=m(mo,[["__scopeId","data-v-ce54a7d1"]]),go={key:0,class:"VPNavBarAppearance"},bo=b({__name:"VPNavBarAppearance",setup(s){const{site:e}=P();return(t,n)=>l(e).appearance&&l(e).appearance!=="force-dark"?(a(),i("div",go,[h(me)])):f("",!0)}});const $o=m(bo,[["__scopeId","data-v-e6aabb21"]]),ge=M();let Te=!1,ae=0;function ko(s){const e=M(!1);if(q){!Te&&yo(),ae++;const t=U(ge,n=>{var o,r,d;n===s.el.value||(o=s.el.value)!=null&&o.contains(n)?(e.value=!0,(r=s.onFocus)==null||r.call(s)):(e.value=!1,(d=s.onBlur)==null||d.call(s))});de(()=>{t(),ae--,ae||Po()})}return Ue(e)}function yo(){document.addEventListener("focusin",Ce),Te=!0,ge.value=document.activeElement}function Po(){document.removeEventListener("focusin",Ce)}function Ce(){ge.value=document.activeElement}const Vo={},wo={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},Lo=c("path",{d:"M12,16c-0.3,0-0.5-0.1-0.7-0.3l-6-6c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l5.3,5.3l5.3-5.3c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-6,6C12.5,15.9,12.3,16,12,16z"},null,-1),So=[Lo];function Mo(s,e){return a(),i("svg",wo,So)}const Be=m(Vo,[["render",Mo]]),No={},Io={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},To=c("circle",{cx:"12",cy:"12",r:"2"},null,-1),Co=c("circle",{cx:"19",cy:"12",r:"2"},null,-1),Bo=c("circle",{cx:"5",cy:"12",r:"2"},null,-1),Ao=[To,Co,Bo];function xo(s,e){return a(),i("svg",Io,Ao)}const Ho=m(No,[["render",xo]]),zo={class:"VPMenuLink"},Do=b({__name:"VPMenuLink",props:{item:{}},setup(s){const{page:e}=P();return(t,n)=>(a(),i("div",zo,[h(E,{class:T({active:l(O)(l(e).relativePath,t.item.activeMatch||t.item.link,!!t.item.activeMatch)}),href:t.item.link,target:t.item.target,rel:t.item.rel},{default:v(()=>[x(L(t.item.text),1)]),_:1},8,["class","href","target","rel"])]))}});const oe=m(Do,[["__scopeId","data-v-43f1e123"]]),Eo={class:"VPMenuGroup"},Fo={key:0,class:"title"},Oo=b({__name:"VPMenuGroup",props:{text:{},items:{}},setup(s){return(e,t)=>(a(),i("div",Eo,[e.text?(a(),i("p",Fo,L(e.text),1)):f("",!0),(a(!0),i(N,null,A(e.items,n=>(a(),i(N,null,["link"in n?(a(),$(oe,{key:0,item:n},null,8,["item"])):f("",!0)],64))),256))]))}});const Go=m(Oo,[["__scopeId","data-v-69e747b5"]]),Uo={class:"VPMenu"},jo={key:0,class:"items"},Ko=b({__name:"VPMenu",props:{items:{}},setup(s){return(e,t)=>(a(),i("div",Uo,[e.items?(a(),i("div",jo,[(a(!0),i(N,null,A(e.items,n=>(a(),i(N,{key:n.text},["link"in n?(a(),$(oe,{key:0,item:n},null,8,["item"])):(a(),$(Go,{key:1,text:n.text,items:n.items},null,8,["text","items"]))],64))),128))])):f("",!0),u(e.$slots,"default",{},void 0,!0)]))}});const Ro=m(Ko,[["__scopeId","data-v-e7ea1737"]]),qo=["aria-expanded","aria-label"],Wo={key:0,class:"text"},Yo=["innerHTML"],Jo={class:"menu"},Xo=b({__name:"VPFlyout",props:{icon:{},button:{},label:{},items:{}},setup(s){const e=M(!1),t=M();ko({el:t,onBlur:n});function n(){e.value=!1}return(o,r)=>(a(),i("div",{class:"VPFlyout",ref_key:"el",ref:t,onMouseenter:r[1]||(r[1]=d=>e.value=!0),onMouseleave:r[2]||(r[2]=d=>e.value=!1)},[c("button",{type:"button",class:"button","aria-haspopup":"true","aria-expanded":e.value,"aria-label":o.label,onClick:r[0]||(r[0]=d=>e.value=!e.value)},[o.button||o.icon?(a(),i("span",Wo,[o.icon?(a(),$(F(o.icon),{key:0,class:"option-icon"})):f("",!0),o.button?(a(),i("span",{key:1,innerHTML:o.button},null,8,Yo)):f("",!0),h(Be,{class:"text-icon"})])):(a(),$(Ho,{key:1,class:"icon"}))],8,qo),c("div",Jo,[h(Ro,{items:o.items},{default:v(()=>[u(o.$slots,"default",{},void 0,!0)]),_:3},8,["items"])])],544))}});const be=m(Xo,[["__scopeId","data-v-9c007e85"]]),Zo={discord:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Discord</title><path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z"/></svg>',facebook:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Facebook</title><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>',github:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>GitHub</title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>',instagram:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Instagram</title><path d="M12 0C8.74 0 8.333.015 7.053.072 5.775.132 4.905.333 4.14.63c-.789.306-1.459.717-2.126 1.384S.935 3.35.63 4.14C.333 4.905.131 5.775.072 7.053.012 8.333 0 8.74 0 12s.015 3.667.072 4.947c.06 1.277.261 2.148.558 2.913.306.788.717 1.459 1.384 2.126.667.666 1.336 1.079 2.126 1.384.766.296 1.636.499 2.913.558C8.333 23.988 8.74 24 12 24s3.667-.015 4.947-.072c1.277-.06 2.148-.262 2.913-.558.788-.306 1.459-.718 2.126-1.384.666-.667 1.079-1.335 1.384-2.126.296-.765.499-1.636.558-2.913.06-1.28.072-1.687.072-4.947s-.015-3.667-.072-4.947c-.06-1.277-.262-2.149-.558-2.913-.306-.789-.718-1.459-1.384-2.126C21.319 1.347 20.651.935 19.86.63c-.765-.297-1.636-.499-2.913-.558C15.667.012 15.26 0 12 0zm0 2.16c3.203 0 3.585.016 4.85.071 1.17.055 1.805.249 2.227.415.562.217.96.477 1.382.896.419.42.679.819.896 1.381.164.422.36 1.057.413 2.227.057 1.266.07 1.646.07 4.85s-.015 3.585-.074 4.85c-.061 1.17-.256 1.805-.421 2.227-.224.562-.479.96-.899 1.382-.419.419-.824.679-1.38.896-.42.164-1.065.36-2.235.413-1.274.057-1.649.07-4.859.07-3.211 0-3.586-.015-4.859-.074-1.171-.061-1.816-.256-2.236-.421-.569-.224-.96-.479-1.379-.899-.421-.419-.69-.824-.9-1.38-.165-.42-.359-1.065-.42-2.235-.045-1.26-.061-1.649-.061-4.844 0-3.196.016-3.586.061-4.861.061-1.17.255-1.814.42-2.234.21-.57.479-.96.9-1.381.419-.419.81-.689 1.379-.898.42-.166 1.051-.361 2.221-.421 1.275-.045 1.65-.06 4.859-.06l.045.03zm0 3.678c-3.405 0-6.162 2.76-6.162 6.162 0 3.405 2.76 6.162 6.162 6.162 3.405 0 6.162-2.76 6.162-6.162 0-3.405-2.76-6.162-6.162-6.162zM12 16c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4zm7.846-10.405c0 .795-.646 1.44-1.44 1.44-.795 0-1.44-.646-1.44-1.44 0-.794.646-1.439 1.44-1.439.793-.001 1.44.645 1.44 1.439z"/></svg>',linkedin:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>LinkedIn</title><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>',mastodon:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Mastodon</title><path d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z"/></svg>',slack:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Slack</title><path d="M5.042 15.165a2.528 2.528 0 0 1-2.52 2.523A2.528 2.528 0 0 1 0 15.165a2.527 2.527 0 0 1 2.522-2.52h2.52v2.52zM6.313 15.165a2.527 2.527 0 0 1 2.521-2.52 2.527 2.527 0 0 1 2.521 2.52v6.313A2.528 2.528 0 0 1 8.834 24a2.528 2.528 0 0 1-2.521-2.522v-6.313zM8.834 5.042a2.528 2.528 0 0 1-2.521-2.52A2.528 2.528 0 0 1 8.834 0a2.528 2.528 0 0 1 2.521 2.522v2.52H8.834zM8.834 6.313a2.528 2.528 0 0 1 2.521 2.521 2.528 2.528 0 0 1-2.521 2.521H2.522A2.528 2.528 0 0 1 0 8.834a2.528 2.528 0 0 1 2.522-2.521h6.312zM18.956 8.834a2.528 2.528 0 0 1 2.522-2.521A2.528 2.528 0 0 1 24 8.834a2.528 2.528 0 0 1-2.522 2.521h-2.522V8.834zM17.688 8.834a2.528 2.528 0 0 1-2.523 2.521 2.527 2.527 0 0 1-2.52-2.521V2.522A2.527 2.527 0 0 1 15.165 0a2.528 2.528 0 0 1 2.523 2.522v6.312zM15.165 18.956a2.528 2.528 0 0 1 2.523 2.522A2.528 2.528 0 0 1 15.165 24a2.527 2.527 0 0 1-2.52-2.522v-2.522h2.52zM15.165 17.688a2.527 2.527 0 0 1-2.52-2.523 2.526 2.526 0 0 1 2.52-2.52h6.313A2.527 2.527 0 0 1 24 15.165a2.528 2.528 0 0 1-2.522 2.523h-6.313z"/></svg>',twitter:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Twitter</title><path d="M21.543 7.104c.015.211.015.423.015.636 0 6.507-4.954 14.01-14.01 14.01v-.003A13.94 13.94 0 0 1 0 19.539a9.88 9.88 0 0 0 7.287-2.041 4.93 4.93 0 0 1-4.6-3.42 4.916 4.916 0 0 0 2.223-.084A4.926 4.926 0 0 1 .96 9.167v-.062a4.887 4.887 0 0 0 2.235.616A4.928 4.928 0 0 1 1.67 3.148 13.98 13.98 0 0 0 11.82 8.292a4.929 4.929 0 0 1 8.39-4.49 9.868 9.868 0 0 0 3.128-1.196 4.941 4.941 0 0 1-2.165 2.724A9.828 9.828 0 0 0 24 4.555a10.019 10.019 0 0 1-2.457 2.549z"/></svg>',x:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>X</title><path d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932ZM17.61 20.644h2.039L6.486 3.24H4.298Z"/></svg>',youtube:'<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>YouTube</title><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>'},Qo=["href","aria-label","innerHTML"],ea=b({__name:"VPSocialLink",props:{icon:{},link:{},ariaLabel:{}},setup(s){const e=s,t=k(()=>typeof e.icon=="object"?e.icon.svg:Zo[e.icon]);return(n,o)=>(a(),i("a",{class:"VPSocialLink no-icon",href:n.link,"aria-label":n.ariaLabel??(typeof n.icon=="string"?n.icon:""),target:"_blank",rel:"noopener",innerHTML:t.value},null,8,Qo))}});const ta=m(ea,[["__scopeId","data-v-f80f8133"]]),sa={class:"VPSocialLinks"},na=b({__name:"VPSocialLinks",props:{links:{}},setup(s){return(e,t)=>(a(),i("div",sa,[(a(!0),i(N,null,A(e.links,({link:n,icon:o,ariaLabel:r})=>(a(),$(ta,{key:n,icon:o,link:n,ariaLabel:r},null,8,["icon","link","ariaLabel"]))),128))]))}});const $e=m(na,[["__scopeId","data-v-7bc22406"]]),oa={key:0,class:"group translations"},aa={class:"trans-title"},ra={key:1,class:"group"},la={class:"item appearance"},ia={class:"label"},ca={class:"appearance-action"},ua={key:2,class:"group"},da={class:"item social-links"},_a=b({__name:"VPNavBarExtra",setup(s){const{site:e,theme:t}=P(),{localeLinks:n,currentLang:o}=X({correspondingLink:!0}),r=k(()=>n.value.length&&o.value.label||e.value.appearance||t.value.socialLinks);return(d,p)=>r.value?(a(),$(be,{key:0,class:"VPNavBarExtra",label:"extra navigation"},{default:v(()=>[l(n).length&&l(o).label?(a(),i("div",oa,[c("p",aa,L(l(o).label),1),(a(!0),i(N,null,A(l(n),_=>(a(),$(oe,{key:_.link,item:_},null,8,["item"]))),128))])):f("",!0),l(e).appearance?(a(),i("div",ra,[c("div",la,[c("p",ia,L(l(t).darkModeSwitchLabel||"Appearance"),1),c("div",ca,[h(me)])])])):f("",!0),l(t).socialLinks?(a(),i("div",ua,[c("div",da,[h($e,{class:"social-links-list",links:l(t).socialLinks},null,8,["links"])])])):f("",!0)]),_:1})):f("",!0)}});const va=m(_a,[["__scopeId","data-v-40855f84"]]),pa=s=>(H("data-v-e5dd9c1c"),s=s(),z(),s),ha=["aria-expanded"],fa=pa(()=>c("span",{class:"container"},[c("span",{class:"top"}),c("span",{class:"middle"}),c("span",{class:"bottom"})],-1)),ma=[fa],ga=b({__name:"VPNavBarHamburger",props:{active:{type:Boolean}},emits:["click"],setup(s){return(e,t)=>(a(),i("button",{type:"button",class:T(["VPNavBarHamburger",{active:e.active}]),"aria-label":"mobile navigation","aria-expanded":e.active,"aria-controls":"VPNavScreen",onClick:t[0]||(t[0]=n=>e.$emit("click"))},ma,10,ha))}});const ba=m(ga,[["__scopeId","data-v-e5dd9c1c"]]),$a=["innerHTML"],ka=b({__name:"VPNavBarMenuLink",props:{item:{}},setup(s){const{page:e}=P();return(t,n)=>(a(),$(E,{class:T({VPNavBarMenuLink:!0,active:l(O)(l(e).relativePath,t.item.activeMatch||t.item.link,!!t.item.activeMatch)}),href:t.item.link,target:t.item.target,rel:t.item.rel,tabindex:"0"},{default:v(()=>[c("span",{innerHTML:t.item.text},null,8,$a)]),_:1},8,["class","href","target","rel"]))}});const ya=m(ka,[["__scopeId","data-v-42ef59de"]]),Pa=b({__name:"VPNavBarMenuGroup",props:{item:{}},setup(s){const e=s,{page:t}=P(),n=r=>"link"in r?O(t.value.relativePath,r.link,!!e.item.activeMatch):r.items.some(n),o=k(()=>n(e.item));return(r,d)=>(a(),$(be,{class:T({VPNavBarMenuGroup:!0,active:l(O)(l(t).relativePath,r.item.activeMatch,!!r.item.activeMatch)||o.value}),button:r.item.text,items:r.item.items},null,8,["class","button","items"]))}}),Va=s=>(H("data-v-7f418b0f"),s=s(),z(),s),wa={key:0,"aria-labelledby":"main-nav-aria-label",class:"VPNavBarMenu"},La=Va(()=>c("span",{id:"main-nav-aria-label",class:"visually-hidden"},"Main Navigation",-1)),Sa=b({__name:"VPNavBarMenu",setup(s){const{theme:e}=P();return(t,n)=>l(e).nav?(a(),i("nav",wa,[La,(a(!0),i(N,null,A(l(e).nav,o=>(a(),i(N,{key:o.text},["link"in o?(a(),$(ya,{key:0,item:o},null,8,["item"])):(a(),$(Pa,{key:1,item:o},null,8,["item"]))],64))),128))])):f("",!0)}});const Ma=m(Sa,[["__scopeId","data-v-7f418b0f"]]);function Na(s,e){const{localeIndex:t}=P();function n(o){var S,C;const r=o.split("."),d=s&&typeof s=="object",p=d&&((C=(S=s.locales)==null?void 0:S[t.value])==null?void 0:C.translations)||null,_=d&&s.translations||null;let g=p,V=_,y=e;const I=r.pop();for(const B of r){let w=null;const K=y==null?void 0:y[B];K&&(w=y=K);const W=V==null?void 0:V[B];W&&(w=V=W);const R=g==null?void 0:g[B];R&&(w=g=R),K||(y=w),W||(V=w),R||(g=w)}return(g==null?void 0:g[I])??(V==null?void 0:V[I])??(y==null?void 0:y[I])??""}return n}const Ia=["aria-label"],Ta={class:"DocSearch-Button-Container"},Ca=c("svg",{class:"DocSearch-Search-Icon",width:"20",height:"20",viewBox:"0 0 20 20","aria-label":"search icon"},[c("path",{d:"M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z",stroke:"currentColor",fill:"none","fill-rule":"evenodd","stroke-linecap":"round","stroke-linejoin":"round"})],-1),Ba={class:"DocSearch-Button-Placeholder"},Aa=c("span",{class:"DocSearch-Button-Keys"},[c("kbd",{class:"DocSearch-Button-Key"}),c("kbd",{class:"DocSearch-Button-Key"},"K")],-1),Pe=b({__name:"VPNavBarSearchButton",setup(s){const{theme:e}=P(),t={button:{buttonText:"Search",buttonAriaLabel:"Search"}},n=je(Na)(Ke(()=>{var o;return(o=e.value.search)==null?void 0:o.options}),t);return(o,r)=>(a(),i("button",{type:"button",class:"DocSearch DocSearch-Button","aria-label":l(n)("button.buttonAriaLabel")},[c("span",Ta,[Ca,c("span",Ba,L(l(n)("button.buttonText")),1)]),Aa],8,Ia))}});const xa={class:"VPNavBarSearch"},Ha={id:"local-search"},za={key:1,id:"docsearch"},Da=b({__name:"VPNavBarSearch",setup(s){const e=Re(()=>qe(()=>import("./VPLocalSearchBox.edacac2c.js"),["assets/chunks/VPLocalSearchBox.edacac2c.js","assets/chunks/framework.0e8ae64e.js"])),t=()=>null,{theme:n}=P(),o=M(!1),r=M(!1);G(()=>{});function d(){o.value||(o.value=!0,setTimeout(p,16))}function p(){const y=new Event("keydown");y.key="k",y.metaKey=!0,window.dispatchEvent(y),setTimeout(()=>{document.querySelector(".DocSearch-Modal")||p()},16)}function _(y){const I=y.target,S=I.tagName;return I.isContentEditable||S==="INPUT"||S==="SELECT"||S==="TEXTAREA"}const g=M(!1);ke("k",y=>{(y.ctrlKey||y.metaKey)&&(y.preventDefault(),g.value=!0)}),ke("/",y=>{_(y)||(y.preventDefault(),g.value=!0)});const V="local";return(y,I)=>{var S;return a(),i("div",xa,[l(V)==="local"?(a(),i(N,{key:0},[g.value?(a(),$(l(e),{key:0,onClose:I[0]||(I[0]=C=>g.value=!1)})):f("",!0),c("div",Ha,[h(Pe,{onClick:I[1]||(I[1]=C=>g.value=!0)})])],64)):l(V)==="algolia"?(a(),i(N,{key:1},[o.value?(a(),$(l(t),{key:0,algolia:((S=l(n).search)==null?void 0:S.options)??l(n).algolia,onVnodeBeforeMount:I[2]||(I[2]=C=>r.value=!0)},null,8,["algolia"])):f("",!0),r.value?f("",!0):(a(),i("div",za,[h(Pe,{onClick:d})]))],64)):f("",!0)])}}});const Ea=b({__name:"VPNavBarSocialLinks",setup(s){const{theme:e}=P();return(t,n)=>l(e).socialLinks?(a(),$($e,{key:0,class:"VPNavBarSocialLinks",links:l(e).socialLinks},null,8,["links"])):f("",!0)}});const Fa=m(Ea,[["__scopeId","data-v-0394ad82"]]),Oa=["href"],Ga=b({__name:"VPNavBarTitle",setup(s){const{site:e,theme:t}=P(),{hasSidebar:n}=D(),{currentLang:o}=X();return(r,d)=>(a(),i("div",{class:T(["VPNavBarTitle",{"has-sidebar":l(n)}])},[c("a",{class:"title",href:l(t).logoLink??l(J)(l(o).link)},[u(r.$slots,"nav-bar-title-before",{},void 0,!0),l(t).logo?(a(),$(ee,{key:0,class:"logo",image:l(t).logo},null,8,["image"])):f("",!0),l(t).siteTitle?(a(),i(N,{key:1},[x(L(l(t).siteTitle),1)],64)):l(t).siteTitle===void 0?(a(),i(N,{key:2},[x(L(l(e).title),1)],64)):f("",!0),u(r.$slots,"nav-bar-title-after",{},void 0,!0)],8,Oa)],2))}});const Ua=m(Ga,[["__scopeId","data-v-86d1bed8"]]),ja={},Ka={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},Ra=c("path",{d:"M0 0h24v24H0z",fill:"none"},null,-1),qa=c("path",{d:" M12.87 15.07l-2.54-2.51.03-.03c1.74-1.94 2.98-4.17 3.71-6.53H17V4h-7V2H8v2H1v1.99h11.17C11.5 7.92 10.44 9.75 9 11.35 8.07 10.32 7.3 9.19 6.69 8h-2c.73 1.63 1.73 3.17 2.98 4.56l-5.09 5.02L4 19l5-5 3.11 3.11.76-2.04zM18.5 10h-2L12 22h2l1.12-3h4.75L21 22h2l-4.5-12zm-2.62 7l1.62-4.33L19.12 17h-3.24z ",class:"css-c4d79v"},null,-1),Wa=[Ra,qa];function Ya(s,e){return a(),i("svg",Ka,Wa)}const Ae=m(ja,[["render",Ya]]),Ja={class:"items"},Xa={class:"title"},Za=b({__name:"VPNavBarTranslations",setup(s){const{theme:e}=P(),{localeLinks:t,currentLang:n}=X({correspondingLink:!0});return(o,r)=>l(t).length&&l(n).label?(a(),$(be,{key:0,class:"VPNavBarTranslations",icon:Ae,label:l(e).langMenuLabel||"Change language"},{default:v(()=>[c("div",Ja,[c("p",Xa,L(l(n).label),1),(a(!0),i(N,null,A(l(t),d=>(a(),$(oe,{key:d.link,item:d},null,8,["item"]))),128))])]),_:1},8,["label"])):f("",!0)}});const Qa=m(Za,[["__scopeId","data-v-74abcbb9"]]),er=s=>(H("data-v-a0fd61f4"),s=s(),z(),s),tr={class:"container"},sr={class:"title"},nr={class:"content"},or=er(()=>c("div",{class:"curtain"},null,-1)),ar={class:"content-body"},rr=b({__name:"VPNavBar",props:{isScreenOpen:{type:Boolean}},emits:["toggle-screen"],setup(s){const{y:e}=Le(),{hasSidebar:t}=D(),{frontmatter:n}=P(),o=M({});return Ve(()=>{o.value={"has-sidebar":t.value,top:n.value.layout==="home"&&e.value===0}}),(r,d)=>(a(),i("div",{class:T(["VPNavBar",o.value])},[c("div",tr,[c("div",sr,[h(Ua,null,{"nav-bar-title-before":v(()=>[u(r.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":v(()=>[u(r.$slots,"nav-bar-title-after",{},void 0,!0)]),_:3})]),c("div",nr,[or,c("div",ar,[u(r.$slots,"nav-bar-content-before",{},void 0,!0),h(Da,{class:"search"}),h(Ma,{class:"menu"}),h(Qa,{class:"translations"}),h($o,{class:"appearance"}),h(Fa,{class:"social-links"}),h(va,{class:"extra"}),u(r.$slots,"nav-bar-content-after",{},void 0,!0),h(ba,{class:"hamburger",active:r.isScreenOpen,onClick:d[0]||(d[0]=p=>r.$emit("toggle-screen"))},null,8,["active"])])])])],2))}});const lr=m(rr,[["__scopeId","data-v-a0fd61f4"]]),ir={key:0,class:"VPNavScreenAppearance"},cr={class:"text"},ur=b({__name:"VPNavScreenAppearance",setup(s){const{site:e,theme:t}=P();return(n,o)=>l(e).appearance?(a(),i("div",ir,[c("p",cr,L(l(t).darkModeSwitchLabel||"Appearance"),1),h(me)])):f("",!0)}});const dr=m(ur,[["__scopeId","data-v-add8f686"]]),_r=b({__name:"VPNavScreenMenuLink",props:{item:{}},setup(s){const e=ne("close-screen");return(t,n)=>(a(),$(E,{class:"VPNavScreenMenuLink",href:t.item.link,target:t.item.target,rel:t.item.rel,onClick:l(e)},{default:v(()=>[x(L(t.item.text),1)]),_:1},8,["href","target","rel","onClick"]))}});const vr=m(_r,[["__scopeId","data-v-05f27b2a"]]),pr={},hr={xmlns:"http://www.w3.org/2000/svg","aria-hidden":"true",focusable:"false",viewBox:"0 0 24 24"},fr=c("path",{d:"M18.9,10.9h-6v-6c0-0.6-0.4-1-1-1s-1,0.4-1,1v6h-6c-0.6,0-1,0.4-1,1s0.4,1,1,1h6v6c0,0.6,0.4,1,1,1s1-0.4,1-1v-6h6c0.6,0,1-0.4,1-1S19.5,10.9,18.9,10.9z"},null,-1),mr=[fr];function gr(s,e){return a(),i("svg",hr,mr)}const br=m(pr,[["render",gr]]),$r=b({__name:"VPNavScreenMenuGroupLink",props:{item:{}},setup(s){const e=ne("close-screen");return(t,n)=>(a(),$(E,{class:"VPNavScreenMenuGroupLink",href:t.item.link,target:t.item.target,rel:t.item.rel,onClick:l(e)},{default:v(()=>[x(L(t.item.text),1)]),_:1},8,["href","target","rel","onClick"]))}});const xe=m($r,[["__scopeId","data-v-19976ae1"]]),kr={class:"VPNavScreenMenuGroupSection"},yr={key:0,class:"title"},Pr=b({__name:"VPNavScreenMenuGroupSection",props:{text:{},items:{}},setup(s){return(e,t)=>(a(),i("div",kr,[e.text?(a(),i("p",yr,L(e.text),1)):f("",!0),(a(!0),i(N,null,A(e.items,n=>(a(),$(xe,{key:n.text,item:n},null,8,["item"]))),128))]))}});const Vr=m(Pr,[["__scopeId","data-v-8133b170"]]),wr=["aria-controls","aria-expanded"],Lr={class:"button-text"},Sr=["id"],Mr={key:1,class:"group"},Nr=b({__name:"VPNavScreenMenuGroup",props:{text:{},items:{}},setup(s){const e=s,t=M(!1),n=k(()=>`NavScreenGroup-${e.text.replace(" ","-").toLowerCase()}`);function o(){t.value=!t.value}return(r,d)=>(a(),i("div",{class:T(["VPNavScreenMenuGroup",{open:t.value}])},[c("button",{class:"button","aria-controls":n.value,"aria-expanded":t.value,onClick:o},[c("span",Lr,L(r.text),1),h(br,{class:"button-icon"})],8,wr),c("div",{id:n.value,class:"items"},[(a(!0),i(N,null,A(r.items,p=>(a(),i(N,{key:p.text},["link"in p?(a(),i("div",{key:p.text,class:"item"},[h(xe,{item:p},null,8,["item"])])):(a(),i("div",Mr,[h(Vr,{text:p.text,items:p.items},null,8,["text","items"])]))],64))),128))],8,Sr)],2))}});const Ir=m(Nr,[["__scopeId","data-v-1ecb84e7"]]),Tr={key:0,class:"VPNavScreenMenu"},Cr=b({__name:"VPNavScreenMenu",setup(s){const{theme:e}=P();return(t,n)=>l(e).nav?(a(),i("nav",Tr,[(a(!0),i(N,null,A(l(e).nav,o=>(a(),i(N,{key:o.text},["link"in o?(a(),$(vr,{key:0,item:o},null,8,["item"])):(a(),$(Ir,{key:1,text:o.text||"",items:o.items},null,8,["text","items"]))],64))),128))])):f("",!0)}}),Br=b({__name:"VPNavScreenSocialLinks",setup(s){const{theme:e}=P();return(t,n)=>l(e).socialLinks?(a(),$($e,{key:0,class:"VPNavScreenSocialLinks",links:l(e).socialLinks},null,8,["links"])):f("",!0)}}),Ar={class:"list"},xr=b({__name:"VPNavScreenTranslations",setup(s){const{localeLinks:e,currentLang:t}=X({correspondingLink:!0}),n=M(!1);function o(){n.value=!n.value}return(r,d)=>l(e).length&&l(t).label?(a(),i("div",{key:0,class:T(["VPNavScreenTranslations",{open:n.value}])},[c("button",{class:"title",onClick:o},[h(Ae,{class:"icon lang"}),x(" "+L(l(t).label)+" ",1),h(Be,{class:"icon chevron"})]),c("ul",Ar,[(a(!0),i(N,null,A(l(e),p=>(a(),i("li",{key:p.link,class:"item"},[h(E,{class:"link",href:p.link},{default:v(()=>[x(L(p.text),1)]),_:2},1032,["href"])]))),128))])],2)):f("",!0)}});const Hr=m(xr,[["__scopeId","data-v-d72aa483"]]),zr={class:"container"},Dr=b({__name:"VPNavScreen",props:{open:{type:Boolean}},setup(s){const e=M(null),t=Se(q?document.body:null);return(n,o)=>(a(),$(ce,{name:"fade",onEnter:o[0]||(o[0]=r=>t.value=!0),onAfterLeave:o[1]||(o[1]=r=>t.value=!1)},{default:v(()=>[n.open?(a(),i("div",{key:0,class:"VPNavScreen",ref_key:"screen",ref:e,id:"VPNavScreen"},[c("div",zr,[u(n.$slots,"nav-screen-content-before",{},void 0,!0),h(Cr,{class:"menu"}),h(Hr,{class:"translations"}),h(dr,{class:"appearance"}),h(Br,{class:"social-links"}),u(n.$slots,"nav-screen-content-after",{},void 0,!0)])],512)):f("",!0)]),_:3}))}});const Er=m(Dr,[["__scopeId","data-v-cc5739dd"]]),Fr={key:0,class:"VPNav"},Or=b({__name:"VPNav",setup(s){const{isScreenOpen:e,closeScreen:t,toggleScreen:n}=Xn(),{frontmatter:o}=P(),r=k(()=>o.value.navbar!==!1);return Me("close-screen",t),te(()=>{q&&document.documentElement.classList.toggle("hide-nav",!r.value)}),(d,p)=>r.value?(a(),i("header",Fr,[h(lr,{"is-screen-open":l(e),onToggleScreen:l(n)},{"nav-bar-title-before":v(()=>[u(d.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":v(()=>[u(d.$slots,"nav-bar-title-after",{},void 0,!0)]),"nav-bar-content-before":v(()=>[u(d.$slots,"nav-bar-content-before",{},void 0,!0)]),"nav-bar-content-after":v(()=>[u(d.$slots,"nav-bar-content-after",{},void 0,!0)]),_:3},8,["is-screen-open","onToggleScreen"]),h(Er,{open:l(e)},{"nav-screen-content-before":v(()=>[u(d.$slots,"nav-screen-content-before",{},void 0,!0)]),"nav-screen-content-after":v(()=>[u(d.$slots,"nav-screen-content-after",{},void 0,!0)]),_:3},8,["open"])])):f("",!0)}});const Gr=m(Or,[["__scopeId","data-v-ae24b3ad"]]),Ur=s=>(H("data-v-e31bd47b"),s=s(),z(),s),jr=["role","tabindex"],Kr=Ur(()=>c("div",{class:"indicator"},null,-1)),Rr=["onKeydown"],qr={key:1,class:"items"},Wr=b({__name:"VPSidebarItem",props:{item:{},depth:{}},setup(s){const e=s,{collapsed:t,collapsible:n,isLink:o,isActiveLink:r,hasActiveLink:d,hasChildren:p,toggle:_}=gt(k(()=>e.item)),g=k(()=>p.value?"section":"div"),V=k(()=>o.value?"a":"div"),y=k(()=>p.value?e.depth+2===7?"p":`h${e.depth+2}`:"p"),I=k(()=>o.value?void 0:"button"),S=k(()=>[[`level-${e.depth}`],{collapsible:n.value},{collapsed:t.value},{"is-link":o.value},{"is-active":r.value},{"has-active":d.value}]);function C(w){"key"in w&&w.key!=="Enter"||!e.item.link&&_()}function B(){e.item.link&&_()}return(w,K)=>{const W=j("VPSidebarItem",!0);return a(),$(F(g.value),{class:T(["VPSidebarItem",S.value])},{default:v(()=>[w.item.text?(a(),i("div",Z({key:0,class:"item",role:I.value},Ye(w.item.items?{click:C,keydown:C}:{},!0),{tabindex:w.item.items&&0}),[Kr,w.item.link?(a(),$(E,{key:0,tag:V.value,class:"link",href:w.item.link,rel:w.item.rel,target:w.item.target},{default:v(()=>[(a(),$(F(y.value),{class:"text",innerHTML:w.item.text},null,8,["innerHTML"]))]),_:1},8,["tag","href","rel","target"])):(a(),$(F(y.value),{key:1,class:"text",innerHTML:w.item.text},null,8,["innerHTML"])),w.item.collapsed!=null?(a(),i("div",{key:2,class:"caret",role:"button","aria-label":"toggle section",onClick:B,onKeydown:We(B,["enter"]),tabindex:"0"},[h(fe,{class:"caret-icon"})],40,Rr)):f("",!0)],16,jr)):f("",!0),w.item.items&&w.item.items.length?(a(),i("div",qr,[w.depth<5?(a(!0),i(N,{key:0},A(w.item.items,R=>(a(),$(W,{key:R.text,item:R,depth:w.depth+1},null,8,["item","depth"]))),128)):f("",!0)])):f("",!0)]),_:1},8,["class"])}}});const Yr=m(Wr,[["__scopeId","data-v-e31bd47b"]]),He=s=>(H("data-v-b00e2fdd"),s=s(),z(),s),Jr=He(()=>c("div",{class:"curtain"},null,-1)),Xr={class:"nav",id:"VPSidebarNav","aria-labelledby":"sidebar-aria-label",tabindex:"-1"},Zr=He(()=>c("span",{class:"visually-hidden",id:"sidebar-aria-label"}," Sidebar Navigation ",-1)),Qr=b({__name:"VPSidebar",props:{open:{type:Boolean}},setup(s){const{sidebarGroups:e,hasSidebar:t}=D(),n=s,o=M(null),r=Se(q?document.body:null);return U([n,o],()=>{var d;n.open?(r.value=!0,(d=o.value)==null||d.focus()):r.value=!1},{immediate:!0,flush:"post"}),(d,p)=>l(t)?(a(),i("aside",{key:0,class:T(["VPSidebar",{open:d.open}]),ref_key:"navEl",ref:o,onClick:p[0]||(p[0]=Je(()=>{},["stop"]))},[Jr,c("nav",Xr,[Zr,u(d.$slots,"sidebar-nav-before",{},void 0,!0),(a(!0),i(N,null,A(l(e),_=>(a(),i("div",{key:_.text,class:"group"},[h(Yr,{item:_,depth:0},null,8,["item"])]))),128)),u(d.$slots,"sidebar-nav-after",{},void 0,!0)])],2)):f("",!0)}});const el=m(Qr,[["__scopeId","data-v-b00e2fdd"]]),tl=b({__name:"VPSkipLink",setup(s){const e=se(),t=M();U(()=>e.path,()=>t.value.focus());function n({target:o}){const r=document.getElementById(decodeURIComponent(o.hash).slice(1));if(r){const d=()=>{r.removeAttribute("tabindex"),r.removeEventListener("blur",d)};r.setAttribute("tabindex","-1"),r.addEventListener("blur",d),r.focus(),window.scrollTo(0,0)}}return(o,r)=>(a(),i(N,null,[c("span",{ref_key:"backToTop",ref:t,tabindex:"-1"},null,512),c("a",{href:"#VPContent",class:"VPSkipLink visually-hidden",onClick:n}," Skip to content ")],64))}});const sl=m(tl,[["__scopeId","data-v-0f60ec36"]]),nl=b({__name:"Layout",setup(s){const{isOpen:e,open:t,close:n}=D(),o=se();U(()=>o.path,n),mt(e,n);const{frontmatter:r}=P(),d=Xe(),p=k(()=>!!d["home-hero-image"]);return Me("hero-image-slot-exists",p),(_,g)=>{const V=j("Content");return l(r).layout!==!1?(a(),i("div",{key:0,class:T(["Layout",l(r).pageClass])},[u(_.$slots,"layout-top",{},void 0,!0),h(sl),h(st,{class:"backdrop",show:l(e),onClick:l(n)},null,8,["show","onClick"]),h(Gr,null,{"nav-bar-title-before":v(()=>[u(_.$slots,"nav-bar-title-before",{},void 0,!0)]),"nav-bar-title-after":v(()=>[u(_.$slots,"nav-bar-title-after",{},void 0,!0)]),"nav-bar-content-before":v(()=>[u(_.$slots,"nav-bar-content-before",{},void 0,!0)]),"nav-bar-content-after":v(()=>[u(_.$slots,"nav-bar-content-after",{},void 0,!0)]),"nav-screen-content-before":v(()=>[u(_.$slots,"nav-screen-content-before",{},void 0,!0)]),"nav-screen-content-after":v(()=>[u(_.$slots,"nav-screen-content-after",{},void 0,!0)]),_:3}),h(Jn,{open:l(e),onOpenMenu:l(t)},null,8,["open","onOpenMenu"]),h(el,{open:l(e)},{"sidebar-nav-before":v(()=>[u(_.$slots,"sidebar-nav-before",{},void 0,!0)]),"sidebar-nav-after":v(()=>[u(_.$slots,"sidebar-nav-after",{},void 0,!0)]),_:3},8,["open"]),h(Mn,null,{"page-top":v(()=>[u(_.$slots,"page-top",{},void 0,!0)]),"page-bottom":v(()=>[u(_.$slots,"page-bottom",{},void 0,!0)]),"not-found":v(()=>[u(_.$slots,"not-found",{},void 0,!0)]),"home-hero-before":v(()=>[u(_.$slots,"home-hero-before",{},void 0,!0)]),"home-hero-info":v(()=>[u(_.$slots,"home-hero-info",{},void 0,!0)]),"home-hero-image":v(()=>[u(_.$slots,"home-hero-image",{},void 0,!0)]),"home-hero-after":v(()=>[u(_.$slots,"home-hero-after",{},void 0,!0)]),"home-features-before":v(()=>[u(_.$slots,"home-features-before",{},void 0,!0)]),"home-features-after":v(()=>[u(_.$slots,"home-features-after",{},void 0,!0)]),"doc-footer-before":v(()=>[u(_.$slots,"doc-footer-before",{},void 0,!0)]),"doc-before":v(()=>[u(_.$slots,"doc-before",{},void 0,!0)]),"doc-after":v(()=>[u(_.$slots,"doc-after",{},void 0,!0)]),"doc-top":v(()=>[u(_.$slots,"doc-top",{},void 0,!0)]),"doc-bottom":v(()=>[u(_.$slots,"doc-bottom",{},void 0,!0)]),"aside-top":v(()=>[u(_.$slots,"aside-top",{},void 0,!0)]),"aside-bottom":v(()=>[u(_.$slots,"aside-bottom",{},void 0,!0)]),"aside-outline-before":v(()=>[u(_.$slots,"aside-outline-before",{},void 0,!0)]),"aside-outline-after":v(()=>[u(_.$slots,"aside-outline-after",{},void 0,!0)]),"aside-ads-before":v(()=>[u(_.$slots,"aside-ads-before",{},void 0,!0)]),"aside-ads-after":v(()=>[u(_.$slots,"aside-ads-after",{},void 0,!0)]),_:3}),h(Bn),u(_.$slots,"layout-bottom",{},void 0,!0)],2)):(a(),$(V,{key:1}))}}});const ol=m(nl,[["__scopeId","data-v-5a346dfe"]]);const rl={Layout:ol,enhanceApp:({app:s})=>{s.component("Badge",Qe)}};export{Na as c,rl as t,P as u};
diff --git a/assets/editor_index.md.b924593a.js b/assets/editor_index.md.f69469c7.js
similarity index 90%
rename from assets/editor_index.md.b924593a.js
rename to assets/editor_index.md.f69469c7.js
index 4654cc6..701e785 100644
--- a/assets/editor_index.md.b924593a.js
+++ b/assets/editor_index.md.f69469c7.js
@@ -1 +1 @@
-import{_ as t,o as a,c as o,k as e,a as n}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"文档编辑","description":"","frontmatter":{},"headers":[],"relativePath":"editor/index.md","filePath":"editor/index.md","lastUpdated":1670330848000}'),r={name:"editor/index.md"},s=e("h1",{id:"文档编辑",tabindex:"-1"},[n("文档编辑 "),e("a",{class:"header-anchor",href:"#文档编辑","aria-label":'Permalink to "文档编辑"'},"​")],-1),d=e("blockquote",null,[e("p",null,"一些常见的文档编辑格式以及前端文档编辑器")],-1),i=[s,d];function c(l,_,p,h,m,f){return a(),o("div",null,i)}const k=t(r,[["render",c]]);export{u as __pageData,k as default};
+import{_ as t,o as a,c as o,k as e,a as n}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"文档编辑","description":"","frontmatter":{},"headers":[],"relativePath":"editor/index.md","filePath":"editor/index.md","lastUpdated":1670330848000}'),r={name:"editor/index.md"},s=e("h1",{id:"文档编辑",tabindex:"-1"},[n("文档编辑 "),e("a",{class:"header-anchor",href:"#文档编辑","aria-label":'Permalink to "文档编辑"'},"​")],-1),d=e("blockquote",null,[e("p",null,"一些常见的文档编辑格式以及前端文档编辑器")],-1),i=[s,d];function c(l,_,p,h,m,f){return a(),o("div",null,i)}const k=t(r,[["render",c]]);export{u as __pageData,k as default};
diff --git a/assets/editor_index.md.b924593a.lean.js b/assets/editor_index.md.f69469c7.lean.js
similarity index 90%
rename from assets/editor_index.md.b924593a.lean.js
rename to assets/editor_index.md.f69469c7.lean.js
index 4654cc6..701e785 100644
--- a/assets/editor_index.md.b924593a.lean.js
+++ b/assets/editor_index.md.f69469c7.lean.js
@@ -1 +1 @@
-import{_ as t,o as a,c as o,k as e,a as n}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"文档编辑","description":"","frontmatter":{},"headers":[],"relativePath":"editor/index.md","filePath":"editor/index.md","lastUpdated":1670330848000}'),r={name:"editor/index.md"},s=e("h1",{id:"文档编辑",tabindex:"-1"},[n("文档编辑 "),e("a",{class:"header-anchor",href:"#文档编辑","aria-label":'Permalink to "文档编辑"'},"​")],-1),d=e("blockquote",null,[e("p",null,"一些常见的文档编辑格式以及前端文档编辑器")],-1),i=[s,d];function c(l,_,p,h,m,f){return a(),o("div",null,i)}const k=t(r,[["render",c]]);export{u as __pageData,k as default};
+import{_ as t,o as a,c as o,k as e,a as n}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"文档编辑","description":"","frontmatter":{},"headers":[],"relativePath":"editor/index.md","filePath":"editor/index.md","lastUpdated":1670330848000}'),r={name:"editor/index.md"},s=e("h1",{id:"文档编辑",tabindex:"-1"},[n("文档编辑 "),e("a",{class:"header-anchor",href:"#文档编辑","aria-label":'Permalink to "文档编辑"'},"​")],-1),d=e("blockquote",null,[e("p",null,"一些常见的文档编辑格式以及前端文档编辑器")],-1),i=[s,d];function c(l,_,p,h,m,f){return a(),o("div",null,i)}const k=t(r,[["render",c]]);export{u as __pageData,k as default};
diff --git a/assets/editor_markdown_vuepress.md.95e9a581.js b/assets/editor_markdown_vuepress.md.8bf6ae13.js
similarity index 99%
rename from assets/editor_markdown_vuepress.md.95e9a581.js
rename to assets/editor_markdown_vuepress.md.8bf6ae13.js
index 48c8357..58fb637 100644
--- a/assets/editor_markdown_vuepress.md.95e9a581.js
+++ b/assets/editor_markdown_vuepress.md.8bf6ae13.js
@@ -1,4 +1,4 @@
-import{_ as s,o as e,c as a,Q as n}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"VuePress & VitePress","description":"","frontmatter":{},"headers":[],"relativePath":"editor/markdown/vuepress.md","filePath":"editor/markdown/vuepress.md","lastUpdated":1670330848000}'),t={name:"editor/markdown/vuepress.md"},l=n(`<h1 id="vuepress-vitepress" tabindex="-1">VuePress &amp; VitePress <a class="header-anchor" href="#vuepress-vitepress" aria-label="Permalink to &quot;VuePress &amp; VitePress&quot;">​</a></h1><p><code>部分 Markdown 文件编写格式</code></p><p><a href="https://vitepress.vuejs.org/guide/markdown" target="_blank" rel="noreferrer">Vitepress 编辑</a></p><h2 id="标题类" tabindex="-1">标题类 <a class="header-anchor" href="#标题类" aria-label="Permalink to &quot;标题类&quot;">​</a></h2><div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">一级标题</span></span>
+import{_ as s,o as e,c as a,Q as n}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"VuePress & VitePress","description":"","frontmatter":{},"headers":[],"relativePath":"editor/markdown/vuepress.md","filePath":"editor/markdown/vuepress.md","lastUpdated":1670330848000}'),t={name:"editor/markdown/vuepress.md"},l=n(`<h1 id="vuepress-vitepress" tabindex="-1">VuePress &amp; VitePress <a class="header-anchor" href="#vuepress-vitepress" aria-label="Permalink to &quot;VuePress &amp; VitePress&quot;">​</a></h1><p><code>部分 Markdown 文件编写格式</code></p><p><a href="https://vitepress.vuejs.org/guide/markdown" target="_blank" rel="noreferrer">Vitepress 编辑</a></p><h2 id="标题类" tabindex="-1">标题类 <a class="header-anchor" href="#标题类" aria-label="Permalink to &quot;标题类&quot;">​</a></h2><div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">一级标题</span></span>
 <span class="line"><span style="color:#e1e4e8;"># 一级标题名称</span></span>
 <span class="line"><span style="color:#e1e4e8;"></span></span>
 <span class="line"><span style="color:#e1e4e8;">二级标题</span></span>
diff --git a/assets/editor_markdown_vuepress.md.95e9a581.lean.js b/assets/editor_markdown_vuepress.md.8bf6ae13.lean.js
similarity index 72%
rename from assets/editor_markdown_vuepress.md.95e9a581.lean.js
rename to assets/editor_markdown_vuepress.md.8bf6ae13.lean.js
index 13625bc..4f579fc 100644
--- a/assets/editor_markdown_vuepress.md.95e9a581.lean.js
+++ b/assets/editor_markdown_vuepress.md.8bf6ae13.lean.js
@@ -1 +1 @@
-import{_ as s,o as e,c as a,Q as n}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"VuePress & VitePress","description":"","frontmatter":{},"headers":[],"relativePath":"editor/markdown/vuepress.md","filePath":"editor/markdown/vuepress.md","lastUpdated":1670330848000}'),t={name:"editor/markdown/vuepress.md"},l=n("",41),p=[l];function o(c,d,i,r,h,g){return e(),a("div",null,p)}const v=s(t,[["render",o]]);export{u as __pageData,v as default};
+import{_ as s,o as e,c as a,Q as n}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"VuePress & VitePress","description":"","frontmatter":{},"headers":[],"relativePath":"editor/markdown/vuepress.md","filePath":"editor/markdown/vuepress.md","lastUpdated":1670330848000}'),t={name:"editor/markdown/vuepress.md"},l=n("",41),p=[l];function o(c,d,i,r,h,g){return e(),a("div",null,p)}const v=s(t,[["render",o]]);export{u as __pageData,v as default};
diff --git a/assets/index.md.d75d9507.js b/assets/index.md.43ab226b.js
similarity index 94%
rename from assets/index.md.d75d9507.js
rename to assets/index.md.43ab226b.js
index d1833c5..d28c752 100644
--- a/assets/index.md.d75d9507.js
+++ b/assets/index.md.43ab226b.js
@@ -1 +1 @@
-import{_ as e,o as t,c as a}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"","description":"","frontmatter":{"layout":"home","hero":{"name":"Learning Docs","text":"Learning is like rowing upstream","tagline":"记录所学，分享知识，共同进步","actions":[{"theme":"brand","text":"知识旅行 ->","link":"/notes/"},{"theme":"alt","text":"View My GitHub","link":"https://github.com/LIUeng"}]},"features":[{"title":"团队能力","details":"个人的成长离不开一个团队的成长，融入团队，共同促进团队成长，相信团队的力量"},{"title":"语言能力","details":"提高语言能力，增强对不同语言文档的驾驭能力，使编码简单轻松，编程质量与体验大幅提升"},{"title":"学习能力","details":"每天进步一点点，回头已是一万里，记录学习的点点滴滴"},{"title":"实践能力","details":"每一个项目才是真正实践的有价值的地方，擅于总结，擅于积累经验"}]},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1670330848000}'),i={name:"index.md"};function n(s,o,r,l,d,c){return t(),a("div")}const _=e(i,[["render",n]]);export{p as __pageData,_ as default};
+import{_ as e,o as t,c as a}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"","description":"","frontmatter":{"layout":"home","hero":{"name":"Learning Docs","text":"Learning is like rowing upstream","tagline":"记录所学，分享知识，共同进步","actions":[{"theme":"brand","text":"知识旅行 ->","link":"/notes/"},{"theme":"alt","text":"View My GitHub","link":"https://github.com/LIUeng"}]},"features":[{"title":"团队能力","details":"个人的成长离不开一个团队的成长，融入团队，共同促进团队成长，相信团队的力量"},{"title":"语言能力","details":"提高语言能力，增强对不同语言文档的驾驭能力，使编码简单轻松，编程质量与体验大幅提升"},{"title":"学习能力","details":"每天进步一点点，回头已是一万里，记录学习的点点滴滴"},{"title":"实践能力","details":"每一个项目才是真正实践的有价值的地方，擅于总结，擅于积累经验"}]},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1670330848000}'),i={name:"index.md"};function n(s,o,r,l,d,c){return t(),a("div")}const _=e(i,[["render",n]]);export{p as __pageData,_ as default};
diff --git a/assets/index.md.d75d9507.lean.js b/assets/index.md.43ab226b.lean.js
similarity index 94%
rename from assets/index.md.d75d9507.lean.js
rename to assets/index.md.43ab226b.lean.js
index d1833c5..d28c752 100644
--- a/assets/index.md.d75d9507.lean.js
+++ b/assets/index.md.43ab226b.lean.js
@@ -1 +1 @@
-import{_ as e,o as t,c as a}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"","description":"","frontmatter":{"layout":"home","hero":{"name":"Learning Docs","text":"Learning is like rowing upstream","tagline":"记录所学，分享知识，共同进步","actions":[{"theme":"brand","text":"知识旅行 ->","link":"/notes/"},{"theme":"alt","text":"View My GitHub","link":"https://github.com/LIUeng"}]},"features":[{"title":"团队能力","details":"个人的成长离不开一个团队的成长，融入团队，共同促进团队成长，相信团队的力量"},{"title":"语言能力","details":"提高语言能力，增强对不同语言文档的驾驭能力，使编码简单轻松，编程质量与体验大幅提升"},{"title":"学习能力","details":"每天进步一点点，回头已是一万里，记录学习的点点滴滴"},{"title":"实践能力","details":"每一个项目才是真正实践的有价值的地方，擅于总结，擅于积累经验"}]},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1670330848000}'),i={name:"index.md"};function n(s,o,r,l,d,c){return t(),a("div")}const _=e(i,[["render",n]]);export{p as __pageData,_ as default};
+import{_ as e,o as t,c as a}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"","description":"","frontmatter":{"layout":"home","hero":{"name":"Learning Docs","text":"Learning is like rowing upstream","tagline":"记录所学，分享知识，共同进步","actions":[{"theme":"brand","text":"知识旅行 ->","link":"/notes/"},{"theme":"alt","text":"View My GitHub","link":"https://github.com/LIUeng"}]},"features":[{"title":"团队能力","details":"个人的成长离不开一个团队的成长，融入团队，共同促进团队成长，相信团队的力量"},{"title":"语言能力","details":"提高语言能力，增强对不同语言文档的驾驭能力，使编码简单轻松，编程质量与体验大幅提升"},{"title":"学习能力","details":"每天进步一点点，回头已是一万里，记录学习的点点滴滴"},{"title":"实践能力","details":"每一个项目才是真正实践的有价值的地方，擅于总结，擅于积累经验"}]},"headers":[],"relativePath":"index.md","filePath":"index.md","lastUpdated":1670330848000}'),i={name:"index.md"};function n(s,o,r,l,d,c){return t(),a("div")}const _=e(i,[["render",n]]);export{p as __pageData,_ as default};
diff --git a/assets/interview_browser.md.007efedd.js b/assets/interview_browser.md.007efedd.js
deleted file mode 100644
index 6ca3905..0000000
--- a/assets/interview_browser.md.007efedd.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as i,o as a,c as e,Q as l}from"./chunks/framework.7c0fadea.js";const t="/learning-docs2/assets/images/rendering-pipeline.webp",q=JSON.parse('{"title":"Chromium 渲染流水线","description":"","frontmatter":{},"headers":[],"relativePath":"interview/browser.md","filePath":"interview/browser.md","lastUpdated":1671437626000}'),r={name:"interview/browser.md"},o=l('<h1 id="chromium-渲染流水线" tabindex="-1">Chromium 渲染流水线 <a class="header-anchor" href="#chromium-渲染流水线" aria-label="Permalink to &quot;Chromium 渲染流水线&quot;">​</a></h1><p><a href="https://zhuanlan.zhihu.com/p/574069391" target="_blank" rel="noreferrer">本文引用地址</a></p><h2 id="浏览器架构" tabindex="-1">浏览器架构 <a class="header-anchor" href="#浏览器架构" aria-label="Permalink to &quot;浏览器架构&quot;">​</a></h2><blockquote><p>浏览器 = 浏览器内核 + 服务</p></blockquote><ul><li>Safari = WebKit + 其他组件、库、服务</li><li>Chrome = Chromium + Google 服务集成</li><li>Microsoft Edge (Chromium) = Chromium + Microsoft 服务集成</li><li>Yandex Browser = Chromium + Yandex 服务集成</li><li>360 安全浏览器 = Trident + Chromium + 360 服务集成</li><li>Chromium = Blink + V8 + 其他组件、库、服务</li></ul><blockquote><p>浏览器 = 渲染引擎 + JavaScript 引擎 + 其他</p></blockquote><table><thead><tr><th>Browser</th><th>Rendering Engine</th><th>JavaScript Engine</th></tr></thead><tbody><tr><td>Internet</td><td>Explorer Trident (MSHTML)</td><td>JScript/Chakra</td></tr><tr><td>Microsoft Edge</td><td>EdgeHTML → Blink</td><td>Chakra → V8</td></tr><tr><td>Firefox</td><td>Gecko</td><td>SpiderMonkey</td></tr><tr><td>Safari</td><td>KHTML → WebKit</td><td>JavaScriptCore</td></tr><tr><td>Chrome</td><td>WebKit → Blink</td><td>V8</td></tr><tr><td>Opera</td><td>Presto → WebKit → Blink Carakan →</td><td>V8</td></tr></tbody></table><h2 id="chromium-进程" tabindex="-1">Chromium 进程 <a class="header-anchor" href="#chromium-进程" aria-label="Permalink to &quot;Chromium 进程&quot;">​</a></h2><ul><li>浏览器进程 1 个</li><li>Utility 进程 1 个</li><li>Viz 进程 1 个（Visuals Process）</li><li>插件进程 1 个</li><li>渲染进程 多个</li></ul><h3 id="浏览器进程" tabindex="-1">浏览器进程 <a class="header-anchor" href="#浏览器进程" aria-label="Permalink to &quot;浏览器进程&quot;">​</a></h3><blockquote><p>负责 Browser UI （不包含 WebContent 的 UI）的全部能力，包括渲染、动画、路由、Input 事件等</p></blockquote><ul><li>Render &amp; Compositing Thread</li><li>Render &amp; Compositing Thread Helpers</li></ul><h3 id="渲染进程" tabindex="-1">渲染进程 <a class="header-anchor" href="#渲染进程" aria-label="Permalink to &quot;渲染进程&quot;">​</a></h3><blockquote><p>负责单个 Tab 内单个站点（注意跨站点 iframe 的情况）的渲染、动画、滚动、Input 事件等</p></blockquote><ul><li>线程 <ul><li>主线程</li><li>合成线程（compositor）</li><li>光栅化线程</li><li>worker 线程</li></ul></li></ul><h4 id="主线程" tabindex="-1">主线程 <a class="header-anchor" href="#主线程" aria-label="Permalink to &quot;主线程&quot;">​</a></h4><ul><li>执行 JavaScript</li><li>Event Loop</li><li>Document 生命周期</li><li>Hit Testing</li><li>事件调度</li><li>HTML CSS 数据格式的解析</li></ul><h4 id="合成线程" tabindex="-1">合成线程 <a class="header-anchor" href="#合成线程" aria-label="Permalink to &quot;合成线程&quot;">​</a></h4><ul><li>Input Handler &amp; Hit Tester</li><li>Web Content 中的滚动与动画</li><li>计算 Web Content 的最优分层</li><li>协调图片解码、绘制、光栅化任务（helpers)</li></ul><h3 id="viz-进程" tabindex="-1">Viz 进程 <a class="header-anchor" href="#viz-进程" aria-label="Permalink to &quot;Viz 进程&quot;">​</a></h3><blockquote><p>接受 Render Process 和 Browser Process 产生的 viz::CompositorFrame，并将其合成 (Aggregate)，最后使用 GPU 将合成结果上屏 (Display)</p></blockquote><ul><li>GPU main thread</li><li>Display Compositor Thread</li></ul><h2 id="进程模式" tabindex="-1">进程模式 <a class="header-anchor" href="#进程模式" aria-label="Permalink to &quot;进程模式&quot;">​</a></h2><ul><li>Process-per-site-instance：老版本的默认策略，如果从一个页面打开了另一个新页面，而新页面和当前页面属于同一站点（根域名与协议相同）的话，那么这两个页面会共用一个 Render Process</li><li>Process-per-site</li><li>Process-per-tab：如今版本的默认策略，每个 Tab 起一个 Render Process。但注意站点内部的跨站 iframe 也会启动一个新的 Render Process</li><li>Single Process：单进程模式，启动参数可控，用于 Debug</li></ul><h2 id="渲染流水线" tabindex="-1">渲染流水线 <a class="header-anchor" href="#渲染流水线" aria-label="Permalink to &quot;渲染流水线&quot;">​</a></h2><img src="'+t+'"><h3 id="parsing" tabindex="-1">Parsing <a class="header-anchor" href="#parsing" aria-label="Permalink to &quot;Parsing&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：解析浏览器进程传送的字节，转成 DOM TREE</li><li>流程：bytes → characters → token → nodes → object model (DOM Tree)</li></ul><h3 id="style" tabindex="-1">Style <a class="header-anchor" href="#style" aria-label="Permalink to &quot;Style&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：遍历 DOM TREE，通过 CSSOM 进行样式分析（ComputeStyle 样式信息）和样式重算，生成 Render Tree</li></ul><h3 id="layout" tabindex="-1">Layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;Layout&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：处理元素的几何属性，即位置与尺寸</li></ul><h3 id="pre-paint" tabindex="-1">Pre-paint <a class="header-anchor" href="#pre-paint" aria-label="Permalink to &quot;Pre-paint&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：生成 Property trees（transform clip effect scroll），供 Compositor thrread 使用，避免某些资源重复 Raster</li></ul><h3 id="paint" tabindex="-1">Paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;Paint&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：开始绘制</li></ul><h3 id="commit" tabindex="-1">Commit <a class="header-anchor" href="#commit" aria-label="Permalink to &quot;Commit&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将绘制的产物数据提交给 Compositor 线程</li></ul><h3 id="compositing" tabindex="-1">Compositing <a class="header-anchor" href="#compositing" aria-label="Permalink to &quot;Compositing&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将整个页面按照一定规则，分成多个独立的图层，便于隔离更新</li></ul><h3 id="tiling" tabindex="-1">Tiling <a class="header-anchor" href="#tiling" aria-label="Permalink to &quot;Tiling&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：根据图层不同的范围级别，不同的大小拆分成多个图块给到 Raster 线程处理</li></ul><h3 id="raster" tabindex="-1">Raster <a class="header-anchor" href="#raster" aria-label="Permalink to &quot;Raster&quot;">​</a></h3><p>::: tips 光栅化 光栅化（Rasterization）是把顶点数据转换为片元的过程，具有将图转化为一个个栅格组成的图象的作用，特点是每个元素对应帧缓冲区中的一像素。 :::</p><ul><li>进程：渲染进程</li><li>线程：Raster 线程</li><li>职责：生成位图</li></ul><h3 id="activate" tabindex="-1">Activate <a class="header-anchor" href="#activate" aria-label="Permalink to &quot;Activate&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：实现一个缓冲机制，确保 Draw 阶段操作前 Raster 的数据已经准备好</li></ul><h3 id="draw" tabindex="-1">Draw <a class="header-anchor" href="#draw" aria-label="Permalink to &quot;Draw&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将光栅化之后的图块生成 draw quads 的过程</li></ul><h3 id="aggregate" tabindex="-1">Aggregate <a class="header-anchor" href="#aggregate" aria-label="Permalink to &quot;Aggregate&quot;">​</a></h3><ul><li>进程：Viz 进程</li><li>线程：Display Compositor thread</li><li>职责：接受多个进程传递过来的（CompositorFrame）并进行合成</li></ul><h3 id="display" tabindex="-1">Display <a class="header-anchor" href="#display" aria-label="Permalink to &quot;Display&quot;">​</a></h3><ul><li>进程：Viz 进程</li><li>线程：GUP 主线程</li><li>职责：生成 CompositorFrame 之后，调用 GL 指令把 draw quads 最终输出到屏幕上</li></ul>',53),n=[o];function s(h,d,u,c,m,p){return a(),e("div",null,n)}const P=i(r,[["render",s]]);export{q as __pageData,P as default};
diff --git a/assets/interview_browser.md.007efedd.lean.js b/assets/interview_browser.md.007efedd.lean.js
deleted file mode 100644
index 7325f1c..0000000
--- a/assets/interview_browser.md.007efedd.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as i,o as a,c as e,Q as l}from"./chunks/framework.7c0fadea.js";const t="/learning-docs2/assets/images/rendering-pipeline.webp",q=JSON.parse('{"title":"Chromium 渲染流水线","description":"","frontmatter":{},"headers":[],"relativePath":"interview/browser.md","filePath":"interview/browser.md","lastUpdated":1671437626000}'),r={name:"interview/browser.md"},o=l("",53),n=[o];function s(h,d,u,c,m,p){return a(),e("div",null,n)}const P=i(r,[["render",s]]);export{q as __pageData,P as default};
diff --git a/assets/interview_browser.md.a89a4d9b.js b/assets/interview_browser.md.a89a4d9b.js
new file mode 100644
index 0000000..7cb8887
--- /dev/null
+++ b/assets/interview_browser.md.a89a4d9b.js
@@ -0,0 +1 @@
+import{_ as i,o as a,c as e,Q as l}from"./chunks/framework.0e8ae64e.js";const t="/assets/images/rendering-pipeline.webp",q=JSON.parse('{"title":"Chromium 渲染流水线","description":"","frontmatter":{},"headers":[],"relativePath":"interview/browser.md","filePath":"interview/browser.md","lastUpdated":1671437626000}'),r={name:"interview/browser.md"},o=l('<h1 id="chromium-渲染流水线" tabindex="-1">Chromium 渲染流水线 <a class="header-anchor" href="#chromium-渲染流水线" aria-label="Permalink to &quot;Chromium 渲染流水线&quot;">​</a></h1><p><a href="https://zhuanlan.zhihu.com/p/574069391" target="_blank" rel="noreferrer">本文引用地址</a></p><h2 id="浏览器架构" tabindex="-1">浏览器架构 <a class="header-anchor" href="#浏览器架构" aria-label="Permalink to &quot;浏览器架构&quot;">​</a></h2><blockquote><p>浏览器 = 浏览器内核 + 服务</p></blockquote><ul><li>Safari = WebKit + 其他组件、库、服务</li><li>Chrome = Chromium + Google 服务集成</li><li>Microsoft Edge (Chromium) = Chromium + Microsoft 服务集成</li><li>Yandex Browser = Chromium + Yandex 服务集成</li><li>360 安全浏览器 = Trident + Chromium + 360 服务集成</li><li>Chromium = Blink + V8 + 其他组件、库、服务</li></ul><blockquote><p>浏览器 = 渲染引擎 + JavaScript 引擎 + 其他</p></blockquote><table><thead><tr><th>Browser</th><th>Rendering Engine</th><th>JavaScript Engine</th></tr></thead><tbody><tr><td>Internet</td><td>Explorer Trident (MSHTML)</td><td>JScript/Chakra</td></tr><tr><td>Microsoft Edge</td><td>EdgeHTML → Blink</td><td>Chakra → V8</td></tr><tr><td>Firefox</td><td>Gecko</td><td>SpiderMonkey</td></tr><tr><td>Safari</td><td>KHTML → WebKit</td><td>JavaScriptCore</td></tr><tr><td>Chrome</td><td>WebKit → Blink</td><td>V8</td></tr><tr><td>Opera</td><td>Presto → WebKit → Blink Carakan →</td><td>V8</td></tr></tbody></table><h2 id="chromium-进程" tabindex="-1">Chromium 进程 <a class="header-anchor" href="#chromium-进程" aria-label="Permalink to &quot;Chromium 进程&quot;">​</a></h2><ul><li>浏览器进程 1 个</li><li>Utility 进程 1 个</li><li>Viz 进程 1 个（Visuals Process）</li><li>插件进程 1 个</li><li>渲染进程 多个</li></ul><h3 id="浏览器进程" tabindex="-1">浏览器进程 <a class="header-anchor" href="#浏览器进程" aria-label="Permalink to &quot;浏览器进程&quot;">​</a></h3><blockquote><p>负责 Browser UI （不包含 WebContent 的 UI）的全部能力，包括渲染、动画、路由、Input 事件等</p></blockquote><ul><li>Render &amp; Compositing Thread</li><li>Render &amp; Compositing Thread Helpers</li></ul><h3 id="渲染进程" tabindex="-1">渲染进程 <a class="header-anchor" href="#渲染进程" aria-label="Permalink to &quot;渲染进程&quot;">​</a></h3><blockquote><p>负责单个 Tab 内单个站点（注意跨站点 iframe 的情况）的渲染、动画、滚动、Input 事件等</p></blockquote><ul><li>线程 <ul><li>主线程</li><li>合成线程（compositor）</li><li>光栅化线程</li><li>worker 线程</li></ul></li></ul><h4 id="主线程" tabindex="-1">主线程 <a class="header-anchor" href="#主线程" aria-label="Permalink to &quot;主线程&quot;">​</a></h4><ul><li>执行 JavaScript</li><li>Event Loop</li><li>Document 生命周期</li><li>Hit Testing</li><li>事件调度</li><li>HTML CSS 数据格式的解析</li></ul><h4 id="合成线程" tabindex="-1">合成线程 <a class="header-anchor" href="#合成线程" aria-label="Permalink to &quot;合成线程&quot;">​</a></h4><ul><li>Input Handler &amp; Hit Tester</li><li>Web Content 中的滚动与动画</li><li>计算 Web Content 的最优分层</li><li>协调图片解码、绘制、光栅化任务（helpers)</li></ul><h3 id="viz-进程" tabindex="-1">Viz 进程 <a class="header-anchor" href="#viz-进程" aria-label="Permalink to &quot;Viz 进程&quot;">​</a></h3><blockquote><p>接受 Render Process 和 Browser Process 产生的 viz::CompositorFrame，并将其合成 (Aggregate)，最后使用 GPU 将合成结果上屏 (Display)</p></blockquote><ul><li>GPU main thread</li><li>Display Compositor Thread</li></ul><h2 id="进程模式" tabindex="-1">进程模式 <a class="header-anchor" href="#进程模式" aria-label="Permalink to &quot;进程模式&quot;">​</a></h2><ul><li>Process-per-site-instance：老版本的默认策略，如果从一个页面打开了另一个新页面，而新页面和当前页面属于同一站点（根域名与协议相同）的话，那么这两个页面会共用一个 Render Process</li><li>Process-per-site</li><li>Process-per-tab：如今版本的默认策略，每个 Tab 起一个 Render Process。但注意站点内部的跨站 iframe 也会启动一个新的 Render Process</li><li>Single Process：单进程模式，启动参数可控，用于 Debug</li></ul><h2 id="渲染流水线" tabindex="-1">渲染流水线 <a class="header-anchor" href="#渲染流水线" aria-label="Permalink to &quot;渲染流水线&quot;">​</a></h2><img src="'+t+'"><h3 id="parsing" tabindex="-1">Parsing <a class="header-anchor" href="#parsing" aria-label="Permalink to &quot;Parsing&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：解析浏览器进程传送的字节，转成 DOM TREE</li><li>流程：bytes → characters → token → nodes → object model (DOM Tree)</li></ul><h3 id="style" tabindex="-1">Style <a class="header-anchor" href="#style" aria-label="Permalink to &quot;Style&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：遍历 DOM TREE，通过 CSSOM 进行样式分析（ComputeStyle 样式信息）和样式重算，生成 Render Tree</li></ul><h3 id="layout" tabindex="-1">Layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;Layout&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：处理元素的几何属性，即位置与尺寸</li></ul><h3 id="pre-paint" tabindex="-1">Pre-paint <a class="header-anchor" href="#pre-paint" aria-label="Permalink to &quot;Pre-paint&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：生成 Property trees（transform clip effect scroll），供 Compositor thrread 使用，避免某些资源重复 Raster</li></ul><h3 id="paint" tabindex="-1">Paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;Paint&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：开始绘制</li></ul><h3 id="commit" tabindex="-1">Commit <a class="header-anchor" href="#commit" aria-label="Permalink to &quot;Commit&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将绘制的产物数据提交给 Compositor 线程</li></ul><h3 id="compositing" tabindex="-1">Compositing <a class="header-anchor" href="#compositing" aria-label="Permalink to &quot;Compositing&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将整个页面按照一定规则，分成多个独立的图层，便于隔离更新</li></ul><h3 id="tiling" tabindex="-1">Tiling <a class="header-anchor" href="#tiling" aria-label="Permalink to &quot;Tiling&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：根据图层不同的范围级别，不同的大小拆分成多个图块给到 Raster 线程处理</li></ul><h3 id="raster" tabindex="-1">Raster <a class="header-anchor" href="#raster" aria-label="Permalink to &quot;Raster&quot;">​</a></h3><p>::: tips 光栅化 光栅化（Rasterization）是把顶点数据转换为片元的过程，具有将图转化为一个个栅格组成的图象的作用，特点是每个元素对应帧缓冲区中的一像素。 :::</p><ul><li>进程：渲染进程</li><li>线程：Raster 线程</li><li>职责：生成位图</li></ul><h3 id="activate" tabindex="-1">Activate <a class="header-anchor" href="#activate" aria-label="Permalink to &quot;Activate&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：实现一个缓冲机制，确保 Draw 阶段操作前 Raster 的数据已经准备好</li></ul><h3 id="draw" tabindex="-1">Draw <a class="header-anchor" href="#draw" aria-label="Permalink to &quot;Draw&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将光栅化之后的图块生成 draw quads 的过程</li></ul><h3 id="aggregate" tabindex="-1">Aggregate <a class="header-anchor" href="#aggregate" aria-label="Permalink to &quot;Aggregate&quot;">​</a></h3><ul><li>进程：Viz 进程</li><li>线程：Display Compositor thread</li><li>职责：接受多个进程传递过来的（CompositorFrame）并进行合成</li></ul><h3 id="display" tabindex="-1">Display <a class="header-anchor" href="#display" aria-label="Permalink to &quot;Display&quot;">​</a></h3><ul><li>进程：Viz 进程</li><li>线程：GUP 主线程</li><li>职责：生成 CompositorFrame 之后，调用 GL 指令把 draw quads 最终输出到屏幕上</li></ul>',53),s=[o];function n(h,d,u,c,m,p){return a(),e("div",null,s)}const P=i(r,[["render",n]]);export{q as __pageData,P as default};
diff --git a/assets/interview_browser.md.a89a4d9b.lean.js b/assets/interview_browser.md.a89a4d9b.lean.js
new file mode 100644
index 0000000..a0e6b8f
--- /dev/null
+++ b/assets/interview_browser.md.a89a4d9b.lean.js
@@ -0,0 +1 @@
+import{_ as i,o as a,c as e,Q as l}from"./chunks/framework.0e8ae64e.js";const t="/assets/images/rendering-pipeline.webp",q=JSON.parse('{"title":"Chromium 渲染流水线","description":"","frontmatter":{},"headers":[],"relativePath":"interview/browser.md","filePath":"interview/browser.md","lastUpdated":1671437626000}'),r={name:"interview/browser.md"},o=l("",53),s=[o];function n(h,d,u,c,m,p){return a(),e("div",null,s)}const P=i(r,[["render",n]]);export{q as __pageData,P as default};
diff --git a/assets/interview_crp.md.7942c988.js b/assets/interview_crp.md.20bcf17d.js
similarity index 93%
rename from assets/interview_crp.md.7942c988.js
rename to assets/interview_crp.md.20bcf17d.js
index 825627b..3756348 100644
--- a/assets/interview_crp.md.7942c988.js
+++ b/assets/interview_crp.md.20bcf17d.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"关键路径渲染","description":"","frontmatter":{},"headers":[],"relativePath":"interview/crp.md","filePath":"interview/crp.md","lastUpdated":1698222491000}'),i={name:"interview/crp.md"},o=r('<h1 id="关键路径渲染" tabindex="-1">关键路径渲染 <a class="header-anchor" href="#关键路径渲染" aria-label="Permalink to &quot;关键路径渲染&quot;">​</a></h1><p>Critial Rendering Path(CRP)</p><p>浏览器将 HTML、CSS 和 JavaScript 转换为屏幕上的像素所执行的一系列步骤</p><h2 id="浏览器渲染" tabindex="-1">浏览器渲染 <a class="header-anchor" href="#浏览器渲染" aria-label="Permalink to &quot;浏览器渲染&quot;">​</a></h2><p>从浏览器渲染的过程进行理解以及渲染的优化步骤</p><h3 id="dom" tabindex="-1">DOM <a class="header-anchor" href="#dom" aria-label="Permalink to &quot;DOM&quot;">​</a></h3><h3 id="cssom" tabindex="-1">CSSOM <a class="header-anchor" href="#cssom" aria-label="Permalink to &quot;CSSOM&quot;">​</a></h3><h3 id="render-tree" tabindex="-1">Render Tree <a class="header-anchor" href="#render-tree" aria-label="Permalink to &quot;Render Tree&quot;">​</a></h3><h3 id="layout" tabindex="-1">Layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;Layout&quot;">​</a></h3><h3 id="paint" tabindex="-1">Paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;Paint&quot;">​</a></h3><h2 id="优化" tabindex="-1">优化 <a class="header-anchor" href="#优化" aria-label="Permalink to &quot;优化&quot;">​</a></h2><ul><li>async defer 的使用</li><li>优化资源大小数量</li><li>减少关键资源的请求数量以及大小</li><li>设置关键资源的优先级</li></ul>',12),n=[o];function l(d,h,c,s,u,_){return e(),t("div",null,n)}const f=a(i,[["render",l]]);export{m as __pageData,f as default};
+import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"关键路径渲染","description":"","frontmatter":{},"headers":[],"relativePath":"interview/crp.md","filePath":"interview/crp.md","lastUpdated":1698222491000}'),i={name:"interview/crp.md"},o=r('<h1 id="关键路径渲染" tabindex="-1">关键路径渲染 <a class="header-anchor" href="#关键路径渲染" aria-label="Permalink to &quot;关键路径渲染&quot;">​</a></h1><p>Critial Rendering Path(CRP)</p><p>浏览器将 HTML、CSS 和 JavaScript 转换为屏幕上的像素所执行的一系列步骤</p><h2 id="浏览器渲染" tabindex="-1">浏览器渲染 <a class="header-anchor" href="#浏览器渲染" aria-label="Permalink to &quot;浏览器渲染&quot;">​</a></h2><p>从浏览器渲染的过程进行理解以及渲染的优化步骤</p><h3 id="dom" tabindex="-1">DOM <a class="header-anchor" href="#dom" aria-label="Permalink to &quot;DOM&quot;">​</a></h3><h3 id="cssom" tabindex="-1">CSSOM <a class="header-anchor" href="#cssom" aria-label="Permalink to &quot;CSSOM&quot;">​</a></h3><h3 id="render-tree" tabindex="-1">Render Tree <a class="header-anchor" href="#render-tree" aria-label="Permalink to &quot;Render Tree&quot;">​</a></h3><h3 id="layout" tabindex="-1">Layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;Layout&quot;">​</a></h3><h3 id="paint" tabindex="-1">Paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;Paint&quot;">​</a></h3><h2 id="优化" tabindex="-1">优化 <a class="header-anchor" href="#优化" aria-label="Permalink to &quot;优化&quot;">​</a></h2><ul><li>async defer 的使用</li><li>优化资源大小数量</li><li>减少关键资源的请求数量以及大小</li><li>设置关键资源的优先级</li></ul>',12),n=[o];function l(d,h,c,s,u,_){return e(),t("div",null,n)}const f=a(i,[["render",l]]);export{m as __pageData,f as default};
diff --git a/assets/interview_crp.md.7942c988.lean.js b/assets/interview_crp.md.20bcf17d.lean.js
similarity index 69%
rename from assets/interview_crp.md.7942c988.lean.js
rename to assets/interview_crp.md.20bcf17d.lean.js
index 71401a5..050c292 100644
--- a/assets/interview_crp.md.7942c988.lean.js
+++ b/assets/interview_crp.md.20bcf17d.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"关键路径渲染","description":"","frontmatter":{},"headers":[],"relativePath":"interview/crp.md","filePath":"interview/crp.md","lastUpdated":1698222491000}'),i={name:"interview/crp.md"},o=r("",12),n=[o];function l(d,h,c,s,u,_){return e(),t("div",null,n)}const f=a(i,[["render",l]]);export{m as __pageData,f as default};
+import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"关键路径渲染","description":"","frontmatter":{},"headers":[],"relativePath":"interview/crp.md","filePath":"interview/crp.md","lastUpdated":1698222491000}'),i={name:"interview/crp.md"},o=r("",12),n=[o];function l(d,h,c,s,u,_){return e(),t("div",null,n)}const f=a(i,[["render",l]]);export{m as __pageData,f as default};
diff --git a/assets/interview_index.md.e4e6acc5.js b/assets/interview_index.md.d69cf835.js
similarity index 90%
rename from assets/interview_index.md.e4e6acc5.js
rename to assets/interview_index.md.d69cf835.js
index 39d3a86..d363c50 100644
--- a/assets/interview_index.md.e4e6acc5.js
+++ b/assets/interview_index.md.d69cf835.js
@@ -1 +1 @@
-import{_ as t,o as a,c as n,k as e,a as o}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"面试","description":"","frontmatter":{},"headers":[],"relativePath":"interview/index.md","filePath":"interview/index.md","lastUpdated":1670330848000}'),r={name:"interview/index.md"},s=e("h1",{id:"面试",tabindex:"-1"},[o("面试 "),e("a",{class:"header-anchor",href:"#面试","aria-label":'Permalink to "面试"'},"​")],-1),i=e("blockquote",null,[e("p",null,"记录一些面试题以及面试经历")],-1),d=[s,i];function c(l,_,p,h,m,f){return a(),n("div",null,d)}const k=t(r,[["render",c]]);export{u as __pageData,k as default};
+import{_ as t,o as a,c as n,k as e,a as o}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"面试","description":"","frontmatter":{},"headers":[],"relativePath":"interview/index.md","filePath":"interview/index.md","lastUpdated":1670330848000}'),r={name:"interview/index.md"},s=e("h1",{id:"面试",tabindex:"-1"},[o("面试 "),e("a",{class:"header-anchor",href:"#面试","aria-label":'Permalink to "面试"'},"​")],-1),i=e("blockquote",null,[e("p",null,"记录一些面试题以及面试经历")],-1),d=[s,i];function c(l,_,p,h,m,f){return a(),n("div",null,d)}const k=t(r,[["render",c]]);export{u as __pageData,k as default};
diff --git a/assets/interview_index.md.e4e6acc5.lean.js b/assets/interview_index.md.d69cf835.lean.js
similarity index 90%
rename from assets/interview_index.md.e4e6acc5.lean.js
rename to assets/interview_index.md.d69cf835.lean.js
index 39d3a86..d363c50 100644
--- a/assets/interview_index.md.e4e6acc5.lean.js
+++ b/assets/interview_index.md.d69cf835.lean.js
@@ -1 +1 @@
-import{_ as t,o as a,c as n,k as e,a as o}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"面试","description":"","frontmatter":{},"headers":[],"relativePath":"interview/index.md","filePath":"interview/index.md","lastUpdated":1670330848000}'),r={name:"interview/index.md"},s=e("h1",{id:"面试",tabindex:"-1"},[o("面试 "),e("a",{class:"header-anchor",href:"#面试","aria-label":'Permalink to "面试"'},"​")],-1),i=e("blockquote",null,[e("p",null,"记录一些面试题以及面试经历")],-1),d=[s,i];function c(l,_,p,h,m,f){return a(),n("div",null,d)}const k=t(r,[["render",c]]);export{u as __pageData,k as default};
+import{_ as t,o as a,c as n,k as e,a as o}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"面试","description":"","frontmatter":{},"headers":[],"relativePath":"interview/index.md","filePath":"interview/index.md","lastUpdated":1670330848000}'),r={name:"interview/index.md"},s=e("h1",{id:"面试",tabindex:"-1"},[o("面试 "),e("a",{class:"header-anchor",href:"#面试","aria-label":'Permalink to "面试"'},"​")],-1),i=e("blockquote",null,[e("p",null,"记录一些面试题以及面试经历")],-1),d=[s,i];function c(l,_,p,h,m,f){return a(),n("div",null,d)}const k=t(r,[["render",c]]);export{u as __pageData,k as default};
diff --git a/assets/interview_metrics.md.e083096b.js b/assets/interview_metrics.md.6cc2fc75.js
similarity index 98%
rename from assets/interview_metrics.md.e083096b.js
rename to assets/interview_metrics.md.6cc2fc75.js
index b52f917..d58d19f 100644
--- a/assets/interview_metrics.md.e083096b.js
+++ b/assets/interview_metrics.md.6cc2fc75.js
@@ -1,4 +1,4 @@
-import{_ as a,o as s,c as l,Q as e}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"性能指标","description":"","frontmatter":{},"headers":[],"relativePath":"interview/metrics.md","filePath":"interview/metrics.md","lastUpdated":1675328164000}'),n={name:"interview/metrics.md"},t=e(`<h1 id="性能指标" tabindex="-1">性能指标 <a class="header-anchor" href="#性能指标" aria-label="Permalink to &quot;性能指标&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>PerformanceObserver &amp; PerformanceEntry</p></div><h2 id="lcp" tabindex="-1">LCP <a class="header-anchor" href="#lcp" aria-label="Permalink to &quot;LCP&quot;">​</a></h2><p>Largest Contentful Paint（最大内容绘制）</p><blockquote><p>最大内容绘制控制在 2.5s 之内</p></blockquote><h3 id="如何衡量" tabindex="-1">如何衡量 <a class="header-anchor" href="#如何衡量" aria-label="Permalink to &quot;如何衡量&quot;">​</a></h3><div class="warning custom-block"><p class="custom-block-title">WARNING</p><p>真正计算的指标存在差异</p></div><blockquote><p>Timing-Allow-Origin 资源指标是否允许跨域收集</p></blockquote><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">PerformanceObserver</span><span style="color:#E1E4E8;">((</span><span style="color:#FFAB70;">entryList</span><span style="color:#E1E4E8;">) </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
+import{_ as a,o as s,c as l,Q as e}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"性能指标","description":"","frontmatter":{},"headers":[],"relativePath":"interview/metrics.md","filePath":"interview/metrics.md","lastUpdated":1675328164000}'),n={name:"interview/metrics.md"},t=e(`<h1 id="性能指标" tabindex="-1">性能指标 <a class="header-anchor" href="#性能指标" aria-label="Permalink to &quot;性能指标&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>PerformanceObserver &amp; PerformanceEntry</p></div><h2 id="lcp" tabindex="-1">LCP <a class="header-anchor" href="#lcp" aria-label="Permalink to &quot;LCP&quot;">​</a></h2><p>Largest Contentful Paint（最大内容绘制）</p><blockquote><p>最大内容绘制控制在 2.5s 之内</p></blockquote><h3 id="如何衡量" tabindex="-1">如何衡量 <a class="header-anchor" href="#如何衡量" aria-label="Permalink to &quot;如何衡量&quot;">​</a></h3><div class="warning custom-block"><p class="custom-block-title">WARNING</p><p>真正计算的指标存在差异</p></div><blockquote><p>Timing-Allow-Origin 资源指标是否允许跨域收集</p></blockquote><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">PerformanceObserver</span><span style="color:#E1E4E8;">((</span><span style="color:#FFAB70;">entryList</span><span style="color:#E1E4E8;">) </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">for</span><span style="color:#E1E4E8;"> (</span><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">entry</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">of</span><span style="color:#E1E4E8;"> entryList.</span><span style="color:#B392F0;">getEntries</span><span style="color:#E1E4E8;">()) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">    console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;LCP candidate:&#39;</span><span style="color:#E1E4E8;">, entry.startTime, entry);</span></span>
 <span class="line"><span style="color:#E1E4E8;">  }</span></span>
diff --git a/assets/interview_metrics.md.e083096b.lean.js b/assets/interview_metrics.md.6cc2fc75.lean.js
similarity index 70%
rename from assets/interview_metrics.md.e083096b.lean.js
rename to assets/interview_metrics.md.6cc2fc75.lean.js
index 5730b64..454c938 100644
--- a/assets/interview_metrics.md.e083096b.lean.js
+++ b/assets/interview_metrics.md.6cc2fc75.lean.js
@@ -1 +1 @@
-import{_ as a,o as s,c as l,Q as e}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"性能指标","description":"","frontmatter":{},"headers":[],"relativePath":"interview/metrics.md","filePath":"interview/metrics.md","lastUpdated":1675328164000}'),n={name:"interview/metrics.md"},t=e("",40),o=[t];function p(r,i,c,h,d,u){return s(),l("div",null,o)}const b=a(n,[["render",p]]);export{E as __pageData,b as default};
+import{_ as a,o as s,c as l,Q as e}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"性能指标","description":"","frontmatter":{},"headers":[],"relativePath":"interview/metrics.md","filePath":"interview/metrics.md","lastUpdated":1675328164000}'),n={name:"interview/metrics.md"},t=e("",40),o=[t];function p(r,i,c,h,d,u){return s(),l("div",null,o)}const b=a(n,[["render",p]]);export{E as __pageData,b as default};
diff --git a/assets/network_cookie.md.14ec33fe.js b/assets/network_cookie.md.9860852e.js
similarity index 98%
rename from assets/network_cookie.md.14ec33fe.js
rename to assets/network_cookie.md.9860852e.js
index 0cf320a..54a75b7 100644
--- a/assets/network_cookie.md.14ec33fe.js
+++ b/assets/network_cookie.md.9860852e.js
@@ -1,4 +1,4 @@
-import{_ as a,o as s,c as e,Q as o}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"Cookies","description":"","frontmatter":{},"headers":[],"relativePath":"network/cookie.md","filePath":"network/cookie.md","lastUpdated":1670330848000}'),t={name:"network/cookie.md"},n=o(`<h1 id="cookies" tabindex="-1">Cookies <a class="header-anchor" href="#cookies" aria-label="Permalink to &quot;Cookies&quot;">​</a></h1><p>基于 HTTP 协议：由一系列字符串组成，存储在客户端（不能超过 4kb），客户端和服务端建立安全通信验证</p><h2 id="读取" tabindex="-1">读取 <a class="header-anchor" href="#读取" aria-label="Permalink to &quot;读取&quot;">​</a></h2><p>带有 http-only 属性的 cookie 不能被读取</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">alert</span><span style="color:#E1E4E8;">(document.cookie);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">alert</span><span style="color:#24292E;">(document.cookie);</span></span></code></pre></div><h2 id="写入" tabindex="-1">写入 <a class="header-anchor" href="#写入" aria-label="Permalink to &quot;写入&quot;">​</a></h2><p>已经存在的 cookie 不会被删除</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">document.cookie </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;user=name&#39;</span><span style="color:#E1E4E8;">;</span></span>
+import{_ as a,o as s,c as e,Q as o}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"Cookies","description":"","frontmatter":{},"headers":[],"relativePath":"network/cookie.md","filePath":"network/cookie.md","lastUpdated":1670330848000}'),t={name:"network/cookie.md"},n=o(`<h1 id="cookies" tabindex="-1">Cookies <a class="header-anchor" href="#cookies" aria-label="Permalink to &quot;Cookies&quot;">​</a></h1><p>基于 HTTP 协议：由一系列字符串组成，存储在客户端（不能超过 4kb），客户端和服务端建立安全通信验证</p><h2 id="读取" tabindex="-1">读取 <a class="header-anchor" href="#读取" aria-label="Permalink to &quot;读取&quot;">​</a></h2><p>带有 http-only 属性的 cookie 不能被读取</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">alert</span><span style="color:#E1E4E8;">(document.cookie);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">alert</span><span style="color:#24292E;">(document.cookie);</span></span></code></pre></div><h2 id="写入" tabindex="-1">写入 <a class="header-anchor" href="#写入" aria-label="Permalink to &quot;写入&quot;">​</a></h2><p>已经存在的 cookie 不会被删除</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">document.cookie </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;user=name&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// 设置多个 cookie 使用分号空格（: ）隔开</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">document.cookie </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;user=name&#39;</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// 设置多个 cookie 使用分号空格（: ）隔开</span></span></code></pre></div><h2 id="path" tabindex="-1">path <a class="header-anchor" href="#path" aria-label="Permalink to &quot;path&quot;">​</a></h2><p>当前设置的 cookie 在 path 的匹配下才可携带，默认为当前的 url</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// path=/admin 匹配 /admin/anything</span></span>
 <span class="line"><span style="color:#E1E4E8;">document.cookie </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;user=name;path=/admin&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// path=/admin 匹配 /admin/anything</span></span>
diff --git a/assets/network_cookie.md.14ec33fe.lean.js b/assets/network_cookie.md.9860852e.lean.js
similarity index 69%
rename from assets/network_cookie.md.14ec33fe.lean.js
rename to assets/network_cookie.md.9860852e.lean.js
index caef3f6..ef4985c 100644
--- a/assets/network_cookie.md.14ec33fe.lean.js
+++ b/assets/network_cookie.md.9860852e.lean.js
@@ -1 +1 @@
-import{_ as a,o as s,c as e,Q as o}from"./chunks/framework.7c0fadea.js";const E=JSON.parse('{"title":"Cookies","description":"","frontmatter":{},"headers":[],"relativePath":"network/cookie.md","filePath":"network/cookie.md","lastUpdated":1670330848000}'),t={name:"network/cookie.md"},n=o("",34),l=[n];function p(c,r,i,d,h,y){return s(),e("div",null,l)}const m=a(t,[["render",p]]);export{E as __pageData,m as default};
+import{_ as a,o as s,c as e,Q as o}from"./chunks/framework.0e8ae64e.js";const E=JSON.parse('{"title":"Cookies","description":"","frontmatter":{},"headers":[],"relativePath":"network/cookie.md","filePath":"network/cookie.md","lastUpdated":1670330848000}'),t={name:"network/cookie.md"},n=o("",34),l=[n];function p(c,r,i,d,h,y){return s(),e("div",null,l)}const m=a(t,[["render",p]]);export{E as __pageData,m as default};
diff --git a/assets/network_cors.md.974416e8.js b/assets/network_cors.md.597b0a96.js
similarity index 99%
rename from assets/network_cors.md.974416e8.js
rename to assets/network_cors.md.597b0a96.js
index d3b7589..9dd32f5 100644
--- a/assets/network_cors.md.974416e8.js
+++ b/assets/network_cors.md.597b0a96.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as e}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"CORS","description":"","frontmatter":{},"headers":[],"relativePath":"network/cors.md","filePath":"network/cors.md","lastUpdated":1670330848000}'),o={name:"network/cors.md"},l=e(`<h1 id="cors" tabindex="-1">CORS <a class="header-anchor" href="#cors" aria-label="Permalink to &quot;CORS&quot;">​</a></h1><p>Cross-Origin Resource Sharing 跨域资源共享</p><div class="tip custom-block"><p class="custom-block-title">定义</p><p>由一系列传输的 Http Headers 头组成，这些 Http 头决定浏览器是否阻止前端 JavaScript 代码获取跨域请求的响应。</p></div><h2 id="cors-headers" tabindex="-1">Cors Headers <a class="header-anchor" href="#cors-headers" aria-label="Permalink to &quot;Cors Headers&quot;">​</a></h2><p>cors headers 给 web 服务器权限，允许跨域请求访问到它们的资源</p><h3 id="access-control-allow-origin" tabindex="-1">Access-Control-Allow-Origin <a class="header-anchor" href="#access-control-allow-origin" aria-label="Permalink to &quot;Access-Control-Allow-Origin&quot;">​</a></h3><p>指示请求的资源能共享给哪些域</p><h3 id="access-control-allow-credentials" tabindex="-1">Access-Control-Allow-Credentials <a class="header-anchor" href="#access-control-allow-credentials" aria-label="Permalink to &quot;Access-Control-Allow-Credentials&quot;">​</a></h3><p>指示当请求的凭证标记为 true 时，是否响应该请求</p><h3 id="access-control-allow-headers" tabindex="-1">Access-Control-Allow-Headers <a class="header-anchor" href="#access-control-allow-headers" aria-label="Permalink to &quot;Access-Control-Allow-Headers&quot;">​</a></h3><p>用在对预请求的响应中，指示实际的请求中可以使用哪些 HTTP 头</p><h3 id="access-control-allow-methods" tabindex="-1">Access-Control-Allow-Methods <a class="header-anchor" href="#access-control-allow-methods" aria-label="Permalink to &quot;Access-Control-Allow-Methods&quot;">​</a></h3><p>指定对预请求的响应中，哪些 HTTP 方法允许访问请求的资源</p><h3 id="access-control-expose-headers" tabindex="-1">Access-Control-Expose-Headers <a class="header-anchor" href="#access-control-expose-headers" aria-label="Permalink to &quot;Access-Control-Expose-Headers&quot;">​</a></h3><p>指示哪些 HTTP 头的名称能在响应中列出</p><h3 id="access-control-max-age" tabindex="-1">Access-Control-Max-Age <a class="header-anchor" href="#access-control-max-age" aria-label="Permalink to &quot;Access-Control-Max-Age&quot;">​</a></h3><p>指示预请求的结果能被缓存多久</p><h3 id="access-control-request-headers" tabindex="-1">Access-Control-Request-Headers <a class="header-anchor" href="#access-control-request-headers" aria-label="Permalink to &quot;Access-Control-Request-Headers&quot;">​</a></h3><p>用于发起一个预请求，告知服务器正式请求会使用哪些 HTTP 头</p><h3 id="access-control-request-method" tabindex="-1">Access-Control-Request-Method <a class="header-anchor" href="#access-control-request-method" aria-label="Permalink to &quot;Access-Control-Request-Method&quot;">​</a></h3><p>用于发起一个预请求，告知服务器正式请求会使用哪一种 HTTP 请求方法</p><h3 id="origin" tabindex="-1">Origin <a class="header-anchor" href="#origin" aria-label="Permalink to &quot;Origin&quot;">​</a></h3><p>指示获取资源的请求是从什么域发起的</p><h2 id="同源策略" tabindex="-1">同源策略 <a class="header-anchor" href="#同源策略" aria-label="Permalink to &quot;同源策略&quot;">​</a></h2><p>same-origin 如果两个 URL 的 protocol、port 和 host 都相同的话，则这两个 URL 同源。</p><h3 id="document-domain" tabindex="-1">document.domain <a class="header-anchor" href="#document-domain" aria-label="Permalink to &quot;document.domain&quot;">​</a></h3><p>允许获取当前页面的域名以及设置域名下的子域名（同源）</p><h2 id="跨域访问的几种方式" tabindex="-1">跨域访问的几种方式 <a class="header-anchor" href="#跨域访问的几种方式" aria-label="Permalink to &quot;跨域访问的几种方式&quot;">​</a></h2><h3 id="window-postmessage" tabindex="-1">window.postMessage <a class="header-anchor" href="#window-postmessage" aria-label="Permalink to &quot;window.postMessage&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">otherWindow.</span><span style="color:#B392F0;">postMessage</span><span style="color:#E1E4E8;">(message, targetOrigin, [transfer]);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">otherWindow.</span><span style="color:#6F42C1;">postMessage</span><span style="color:#24292E;">(message, targetOrigin, [transfer]);</span></span></code></pre></div><ul><li>otherWindow 对象</li></ul><p>其他窗口的一个引用，如：iframe.contentWindow、window.open(...) 返回的窗口对象、或者是命名过或数值索引的 window.frames</p><ul><li>message</li></ul><p>将要发送到其他 window 的数据。</p><ul><li>targetOrigin</li></ul><p>哪些域名可以被允许发送消息</p><ul><li>transfer</li></ul><p>Transferable 对象</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// http://test.com</span></span>
+import{_ as s,o as a,c as n,Q as e}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"CORS","description":"","frontmatter":{},"headers":[],"relativePath":"network/cors.md","filePath":"network/cors.md","lastUpdated":1670330848000}'),o={name:"network/cors.md"},l=e(`<h1 id="cors" tabindex="-1">CORS <a class="header-anchor" href="#cors" aria-label="Permalink to &quot;CORS&quot;">​</a></h1><p>Cross-Origin Resource Sharing 跨域资源共享</p><div class="tip custom-block"><p class="custom-block-title">定义</p><p>由一系列传输的 Http Headers 头组成，这些 Http 头决定浏览器是否阻止前端 JavaScript 代码获取跨域请求的响应。</p></div><h2 id="cors-headers" tabindex="-1">Cors Headers <a class="header-anchor" href="#cors-headers" aria-label="Permalink to &quot;Cors Headers&quot;">​</a></h2><p>cors headers 给 web 服务器权限，允许跨域请求访问到它们的资源</p><h3 id="access-control-allow-origin" tabindex="-1">Access-Control-Allow-Origin <a class="header-anchor" href="#access-control-allow-origin" aria-label="Permalink to &quot;Access-Control-Allow-Origin&quot;">​</a></h3><p>指示请求的资源能共享给哪些域</p><h3 id="access-control-allow-credentials" tabindex="-1">Access-Control-Allow-Credentials <a class="header-anchor" href="#access-control-allow-credentials" aria-label="Permalink to &quot;Access-Control-Allow-Credentials&quot;">​</a></h3><p>指示当请求的凭证标记为 true 时，是否响应该请求</p><h3 id="access-control-allow-headers" tabindex="-1">Access-Control-Allow-Headers <a class="header-anchor" href="#access-control-allow-headers" aria-label="Permalink to &quot;Access-Control-Allow-Headers&quot;">​</a></h3><p>用在对预请求的响应中，指示实际的请求中可以使用哪些 HTTP 头</p><h3 id="access-control-allow-methods" tabindex="-1">Access-Control-Allow-Methods <a class="header-anchor" href="#access-control-allow-methods" aria-label="Permalink to &quot;Access-Control-Allow-Methods&quot;">​</a></h3><p>指定对预请求的响应中，哪些 HTTP 方法允许访问请求的资源</p><h3 id="access-control-expose-headers" tabindex="-1">Access-Control-Expose-Headers <a class="header-anchor" href="#access-control-expose-headers" aria-label="Permalink to &quot;Access-Control-Expose-Headers&quot;">​</a></h3><p>指示哪些 HTTP 头的名称能在响应中列出</p><h3 id="access-control-max-age" tabindex="-1">Access-Control-Max-Age <a class="header-anchor" href="#access-control-max-age" aria-label="Permalink to &quot;Access-Control-Max-Age&quot;">​</a></h3><p>指示预请求的结果能被缓存多久</p><h3 id="access-control-request-headers" tabindex="-1">Access-Control-Request-Headers <a class="header-anchor" href="#access-control-request-headers" aria-label="Permalink to &quot;Access-Control-Request-Headers&quot;">​</a></h3><p>用于发起一个预请求，告知服务器正式请求会使用哪些 HTTP 头</p><h3 id="access-control-request-method" tabindex="-1">Access-Control-Request-Method <a class="header-anchor" href="#access-control-request-method" aria-label="Permalink to &quot;Access-Control-Request-Method&quot;">​</a></h3><p>用于发起一个预请求，告知服务器正式请求会使用哪一种 HTTP 请求方法</p><h3 id="origin" tabindex="-1">Origin <a class="header-anchor" href="#origin" aria-label="Permalink to &quot;Origin&quot;">​</a></h3><p>指示获取资源的请求是从什么域发起的</p><h2 id="同源策略" tabindex="-1">同源策略 <a class="header-anchor" href="#同源策略" aria-label="Permalink to &quot;同源策略&quot;">​</a></h2><p>same-origin 如果两个 URL 的 protocol、port 和 host 都相同的话，则这两个 URL 同源。</p><h3 id="document-domain" tabindex="-1">document.domain <a class="header-anchor" href="#document-domain" aria-label="Permalink to &quot;document.domain&quot;">​</a></h3><p>允许获取当前页面的域名以及设置域名下的子域名（同源）</p><h2 id="跨域访问的几种方式" tabindex="-1">跨域访问的几种方式 <a class="header-anchor" href="#跨域访问的几种方式" aria-label="Permalink to &quot;跨域访问的几种方式&quot;">​</a></h2><h3 id="window-postmessage" tabindex="-1">window.postMessage <a class="header-anchor" href="#window-postmessage" aria-label="Permalink to &quot;window.postMessage&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">otherWindow.</span><span style="color:#B392F0;">postMessage</span><span style="color:#E1E4E8;">(message, targetOrigin, [transfer]);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">otherWindow.</span><span style="color:#6F42C1;">postMessage</span><span style="color:#24292E;">(message, targetOrigin, [transfer]);</span></span></code></pre></div><ul><li>otherWindow 对象</li></ul><p>其他窗口的一个引用，如：iframe.contentWindow、window.open(...) 返回的窗口对象、或者是命名过或数值索引的 window.frames</p><ul><li>message</li></ul><p>将要发送到其他 window 的数据。</p><ul><li>targetOrigin</li></ul><p>哪些域名可以被允许发送消息</p><ul><li>transfer</li></ul><p>Transferable 对象</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// http://test.com</span></span>
 <span class="line"><span style="color:#6A737D;">// 发送方</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> popup </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> window.</span><span style="color:#B392F0;">open</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;http://test.com:8080&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">popup.</span><span style="color:#B392F0;">postMessage</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;hello&#39;</span><span style="color:#E1E4E8;">, </span><span style="color:#9ECBFF;">&#39;http://test.com&#39;</span><span style="color:#E1E4E8;">);</span></span>
diff --git a/assets/network_cors.md.974416e8.lean.js b/assets/network_cors.md.597b0a96.lean.js
similarity index 68%
rename from assets/network_cors.md.974416e8.lean.js
rename to assets/network_cors.md.597b0a96.lean.js
index 060faf1..d58c344 100644
--- a/assets/network_cors.md.974416e8.lean.js
+++ b/assets/network_cors.md.597b0a96.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as e}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"CORS","description":"","frontmatter":{},"headers":[],"relativePath":"network/cors.md","filePath":"network/cors.md","lastUpdated":1670330848000}'),o={name:"network/cors.md"},l=e("",39),p=[l];function t(c,r,i,E,y,d){return a(),n("div",null,p)}const g=s(o,[["render",t]]);export{u as __pageData,g as default};
+import{_ as s,o as a,c as n,Q as e}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"CORS","description":"","frontmatter":{},"headers":[],"relativePath":"network/cors.md","filePath":"network/cors.md","lastUpdated":1670330848000}'),o={name:"network/cors.md"},l=e("",39),p=[l];function t(c,r,i,E,y,d){return a(),n("div",null,p)}const g=s(o,[["render",t]]);export{u as __pageData,g as default};
diff --git a/assets/network_dhcp.md.2beb2a5b.js b/assets/network_dhcp.md.36ba0d0c.js
similarity index 99%
rename from assets/network_dhcp.md.2beb2a5b.js
rename to assets/network_dhcp.md.36ba0d0c.js
index c04a05e..bb6d314 100644
--- a/assets/network_dhcp.md.2beb2a5b.js
+++ b/assets/network_dhcp.md.36ba0d0c.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const C=JSON.parse('{"title":"DHCP","description":"","frontmatter":{},"headers":[],"relativePath":"network/dhcp.md","filePath":"network/dhcp.md","lastUpdated":1670330848000}'),p={name:"network/dhcp.md"},o=l(`<h1 id="dhcp" tabindex="-1">DHCP <a class="header-anchor" href="#dhcp" aria-label="Permalink to &quot;DHCP&quot;">​</a></h1><p>动态主机配置协议（DHCP) - dynamic host configuration protocol</p><h2 id="如何配置-ip-地址" tabindex="-1">如何配置 IP 地址 <a class="header-anchor" href="#如何配置-ip-地址" aria-label="Permalink to &quot;如何配置 IP 地址&quot;">​</a></h2><blockquote><p>手动配置</p></blockquote><ul><li>net-tools</li></ul><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ifconfig</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">eth1</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">10.0</span><span style="color:#9ECBFF;">.0.1/24</span></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const C=JSON.parse('{"title":"DHCP","description":"","frontmatter":{},"headers":[],"relativePath":"network/dhcp.md","filePath":"network/dhcp.md","lastUpdated":1670330848000}'),p={name:"network/dhcp.md"},o=l(`<h1 id="dhcp" tabindex="-1">DHCP <a class="header-anchor" href="#dhcp" aria-label="Permalink to &quot;DHCP&quot;">​</a></h1><p>动态主机配置协议（DHCP) - dynamic host configuration protocol</p><h2 id="如何配置-ip-地址" tabindex="-1">如何配置 IP 地址 <a class="header-anchor" href="#如何配置-ip-地址" aria-label="Permalink to &quot;如何配置 IP 地址&quot;">​</a></h2><blockquote><p>手动配置</p></blockquote><ul><li>net-tools</li></ul><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ifconfig</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">eth1</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">10.0</span><span style="color:#9ECBFF;">.0.1/24</span></span>
 <span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ifconfig</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">eth1</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">up</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">sudo</span><span style="color:#24292E;"> </span><span style="color:#032F62;">ifconfig</span><span style="color:#24292E;"> </span><span style="color:#032F62;">eth1</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">10.0</span><span style="color:#032F62;">.0.1/24</span></span>
 <span class="line"><span style="color:#6F42C1;">sudo</span><span style="color:#24292E;"> </span><span style="color:#032F62;">ifconfig</span><span style="color:#24292E;"> </span><span style="color:#032F62;">eth1</span><span style="color:#24292E;"> </span><span style="color:#032F62;">up</span></span></code></pre></div><ul><li>iproute2</li></ul><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ip</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">addr</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">add</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">10.0</span><span style="color:#9ECBFF;">.0.1/24</span></span>
 <span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ip</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">link</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">set</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">up</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">eth1</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">sudo</span><span style="color:#24292E;"> </span><span style="color:#032F62;">ip</span><span style="color:#24292E;"> </span><span style="color:#032F62;">addr</span><span style="color:#24292E;"> </span><span style="color:#032F62;">add</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">10.0</span><span style="color:#032F62;">.0.1/24</span></span>
diff --git a/assets/network_dhcp.md.2beb2a5b.lean.js b/assets/network_dhcp.md.36ba0d0c.lean.js
similarity index 68%
rename from assets/network_dhcp.md.2beb2a5b.lean.js
rename to assets/network_dhcp.md.36ba0d0c.lean.js
index b4a5932..36f731a 100644
--- a/assets/network_dhcp.md.2beb2a5b.lean.js
+++ b/assets/network_dhcp.md.36ba0d0c.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const C=JSON.parse('{"title":"DHCP","description":"","frontmatter":{},"headers":[],"relativePath":"network/dhcp.md","filePath":"network/dhcp.md","lastUpdated":1670330848000}'),p={name:"network/dhcp.md"},o=l("",36),t=[o];function e(c,r,E,y,i,d){return a(),n("div",null,t)}const u=s(p,[["render",e]]);export{C as __pageData,u as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const C=JSON.parse('{"title":"DHCP","description":"","frontmatter":{},"headers":[],"relativePath":"network/dhcp.md","filePath":"network/dhcp.md","lastUpdated":1670330848000}'),p={name:"network/dhcp.md"},o=l("",36),t=[o];function e(c,r,E,y,i,d){return a(),n("div",null,t)}const u=s(p,[["render",e]]);export{C as __pageData,u as default};
diff --git a/assets/network_index.md.ac3e7452.js b/assets/network_index.md.a4ce8b20.js
similarity index 99%
rename from assets/network_index.md.ac3e7452.js
rename to assets/network_index.md.a4ce8b20.js
index 7a8e35f..9458ceb 100644
--- a/assets/network_index.md.ac3e7452.js
+++ b/assets/network_index.md.a4ce8b20.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const B=JSON.parse('{"title":"网络协议","description":"","frontmatter":{},"headers":[],"relativePath":"network/index.md","filePath":"network/index.md","lastUpdated":1670330848000}'),p={name:"network/index.md"},o=l(`<h1 id="网络协议" tabindex="-1">网络协议 <a class="header-anchor" href="#网络协议" aria-label="Permalink to &quot;网络协议&quot;">​</a></h1><h2 id="常见网络协议" tabindex="-1">常见网络协议 <a class="header-anchor" href="#常见网络协议" aria-label="Permalink to &quot;常见网络协议&quot;">​</a></h2><table><thead><tr><th>架构</th><th>网络协议例子</th></tr></thead><tbody><tr><td>应用层</td><td>DHCP HTTP HTTPS RTMP P2P DNS GTP RPC</td></tr><tr><td>传输层</td><td>UDP TCP</td></tr><tr><td>网络层</td><td>ICMP IP OSPF BGP IPSec GRE</td></tr><tr><td>链路层</td><td>ARP VLAN STP</td></tr><tr><td>物理层</td><td>网络跳线</td></tr></tbody></table><h2 id="ip-地址" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h2><blockquote><p>ifconfig/ipconfig</p></blockquote><p>mac ifconfig</p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">lo0:</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">flags=</span><span style="color:#79B8FF;">8049</span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">UP,LOOPBACK,RUNNING,MULTICAS</span><span style="color:#E1E4E8;">T</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">mtu</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">16384</span></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const B=JSON.parse('{"title":"网络协议","description":"","frontmatter":{},"headers":[],"relativePath":"network/index.md","filePath":"network/index.md","lastUpdated":1670330848000}'),p={name:"network/index.md"},o=l(`<h1 id="网络协议" tabindex="-1">网络协议 <a class="header-anchor" href="#网络协议" aria-label="Permalink to &quot;网络协议&quot;">​</a></h1><h2 id="常见网络协议" tabindex="-1">常见网络协议 <a class="header-anchor" href="#常见网络协议" aria-label="Permalink to &quot;常见网络协议&quot;">​</a></h2><table><thead><tr><th>架构</th><th>网络协议例子</th></tr></thead><tbody><tr><td>应用层</td><td>DHCP HTTP HTTPS RTMP P2P DNS GTP RPC</td></tr><tr><td>传输层</td><td>UDP TCP</td></tr><tr><td>网络层</td><td>ICMP IP OSPF BGP IPSec GRE</td></tr><tr><td>链路层</td><td>ARP VLAN STP</td></tr><tr><td>物理层</td><td>网络跳线</td></tr></tbody></table><h2 id="ip-地址" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h2><blockquote><p>ifconfig/ipconfig</p></blockquote><p>mac ifconfig</p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">lo0:</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">flags=</span><span style="color:#79B8FF;">8049</span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">UP,LOOPBACK,RUNNING,MULTICAS</span><span style="color:#E1E4E8;">T</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">mtu</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">16384</span></span>
 <span class="line"><span style="color:#E1E4E8;">	options</span><span style="color:#F97583;">=</span><span style="color:#79B8FF;">1203</span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">RXCSUM,TXCSUM,TXSTATUS,SW_TIMESTAM</span><span style="color:#E1E4E8;">P</span><span style="color:#F97583;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">	</span><span style="color:#B392F0;">inet</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">127.0</span><span style="color:#9ECBFF;">.0.1</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">netmask</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">0xff000000</span></span>
 <span class="line"><span style="color:#E1E4E8;">	</span><span style="color:#B392F0;">inet6</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">::1</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">prefixlen</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">128</span></span>
diff --git a/assets/network_index.md.ac3e7452.lean.js b/assets/network_index.md.a4ce8b20.lean.js
similarity index 69%
rename from assets/network_index.md.ac3e7452.lean.js
rename to assets/network_index.md.a4ce8b20.lean.js
index 04b4ed2..6f3fa6e 100644
--- a/assets/network_index.md.ac3e7452.lean.js
+++ b/assets/network_index.md.a4ce8b20.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const B=JSON.parse('{"title":"网络协议","description":"","frontmatter":{},"headers":[],"relativePath":"network/index.md","filePath":"network/index.md","lastUpdated":1670330848000}'),p={name:"network/index.md"},o=l("",32),t=[o];function e(c,r,y,E,F,C){return a(),n("div",null,t)}const d=s(p,[["render",e]]);export{B as __pageData,d as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const B=JSON.parse('{"title":"网络协议","description":"","frontmatter":{},"headers":[],"relativePath":"network/index.md","filePath":"network/index.md","lastUpdated":1670330848000}'),p={name:"network/index.md"},o=l("",32),t=[o];function e(c,r,y,E,F,C){return a(),n("div",null,t)}const d=s(p,[["render",e]]);export{B as __pageData,d as default};
diff --git a/assets/network_ip_addr.md.c87e2877.js b/assets/network_ip_addr.md.7e144e39.js
similarity index 97%
rename from assets/network_ip_addr.md.c87e2877.js
rename to assets/network_ip_addr.md.7e144e39.js
index 660c64b..fd78d68 100644
--- a/assets/network_ip_addr.md.c87e2877.js
+++ b/assets/network_ip_addr.md.7e144e39.js
@@ -1 +1 @@
-import{_ as a,o as t,c as e,Q as d}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"IP 地址","description":"","frontmatter":{},"headers":[],"relativePath":"network/ip_addr.md","filePath":"network/ip_addr.md","lastUpdated":1670330848000}'),r={name:"network/ip_addr.md"},o=d('<h1 id="ip-地址" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h1><p>(Internet Protocol Address)互联网协议地址，网际协议地址</p><h2 id="ip-协议" tabindex="-1">IP 协议 <a class="header-anchor" href="#ip-协议" aria-label="Permalink to &quot;IP 协议&quot;">​</a></h2><p>计算机网络相互连接进行通信而设计的协议</p><h2 id="ip-地址-1" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址-1" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h2><p>唯一地址</p><h2 id="ip-地址类型" tabindex="-1">IP 地址类型 <a class="header-anchor" href="#ip-地址类型" aria-label="Permalink to &quot;IP 地址类型&quot;">​</a></h2><h3 id="公有地址" tabindex="-1">公有地址 <a class="header-anchor" href="#公有地址" aria-label="Permalink to &quot;公有地址&quot;">​</a></h3><p>权威机构</p><h3 id="私有地址" tabindex="-1">私有地址 <a class="header-anchor" href="#私有地址" aria-label="Permalink to &quot;私有地址&quot;">​</a></h3><p>A 类 10.0.0.0--10.255.255.255 B 类 172.16.0.0--172.31.255.255 C 类 192.168.0.0--192.168.255.255</p><p>D、E 类为特殊地址</p><h2 id="ip-地址编址方式" tabindex="-1">IP 地址编址方式 <a class="header-anchor" href="#ip-地址编址方式" aria-label="Permalink to &quot;IP 地址编址方式&quot;">​</a></h2><table><thead><tr><th>类别</th><th>最大网络数</th><th>IP 地址范围</th><th>单个网段最大主机数</th><th>私有 IP 地址范围</th></tr></thead><tbody><tr><td>A</td><td>126(2^7-2)</td><td>1.0.0.1-127.255.255.254</td><td>16777214</td><td>10.0.0.0-10.255.255.255</td></tr><tr><td>B</td><td>16384(2^14)</td><td>128.0.0.1-191.255.255.254</td><td>65534</td><td>172.16.0.0-172.31.255.255</td></tr><tr><td>C</td><td>2097152(2^21)</td><td>192.0.0.1-223.255.255.254</td><td>254</td><td>192.168.0.0-192.168.255.255</td></tr></tbody></table><h3 id="a-类地址" tabindex="-1">A 类地址 <a class="header-anchor" href="#a-类地址" aria-label="Permalink to &quot;A 类地址&quot;">​</a></h3><p>1 字节的网络地址 + 3 字节主机地址 <code>网络地址的最高位必须为 0</code></p><h3 id="b-类地址" tabindex="-1">B 类地址 <a class="header-anchor" href="#b-类地址" aria-label="Permalink to &quot;B 类地址&quot;">​</a></h3><p>2 字节的网络地址 + 2 字节主机地址 <code>网络地址的最高位必须为 10</code></p><h3 id="c-类地址" tabindex="-1">C 类地址 <a class="header-anchor" href="#c-类地址" aria-label="Permalink to &quot;C 类地址&quot;">​</a></h3><p>3 字节的网络地址 + 1 字节的主机地址 <code>网络地址的最高位必须为 110</code></p><h3 id="d-类地址" tabindex="-1">D 类地址 <a class="header-anchor" href="#d-类地址" aria-label="Permalink to &quot;D 类地址&quot;">​</a></h3><p>多播地址，也称组播地址（<code>多播地址的最高位必须为 1110</code> === 224.0.0.0 - 239.255.255.255）</p><h3 id="e-类地址" tabindex="-1">E 类地址 <a class="header-anchor" href="#e-类地址" aria-label="Permalink to &quot;E 类地址&quot;">​</a></h3><p>试验用处 <code>最高位必须为 1111</code></p><h3 id="特殊的网址" tabindex="-1">特殊的网址 <a class="header-anchor" href="#特殊的网址" aria-label="Permalink to &quot;特殊的网址&quot;">​</a></h3><ol><li>每一个字节都为 0 的地址（0.0.0.0）对应于当前主机</li><li>IP 地址中的每一个字节都为 1 的 IP 地址（255．255．255．255）是当前子网的广播地址</li><li>IP 地址中凡是以 11110 开头的 E 类 IP 地址都保留用于将来和实验使用</li><li>IP 地址中不能以十进制 127 作为开头，该类地址中数字 127．0．0．1 到 127．255．255．255 用于回路测试，如：127.0.0.1 可以代表本机 IP 地址，用 127.0.0.1 就可以测试本机中配置的 Web 服务器</li><li>网络 ID 的第一个 6 位组也不能全置为 0，全 0 表示本地网络</li></ol><h2 id="ip-地址的分配" tabindex="-1">IP 地址的分配 <a class="header-anchor" href="#ip-地址的分配" aria-label="Permalink to &quot;IP 地址的分配&quot;">​</a></h2><p>TCP/IP 协议需要针对不同的网络进行不同的设置，且每个节点一般需要一个 IP 地址、一个子网掩码、一个默认网关</p>',28),i=[o];function h(l,n,c,p,s,P){return t(),e("div",null,i)}const _=a(r,[["render",h]]);export{u as __pageData,_ as default};
+import{_ as a,o as t,c as e,Q as d}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"IP 地址","description":"","frontmatter":{},"headers":[],"relativePath":"network/ip_addr.md","filePath":"network/ip_addr.md","lastUpdated":1670330848000}'),r={name:"network/ip_addr.md"},o=d('<h1 id="ip-地址" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h1><p>(Internet Protocol Address)互联网协议地址，网际协议地址</p><h2 id="ip-协议" tabindex="-1">IP 协议 <a class="header-anchor" href="#ip-协议" aria-label="Permalink to &quot;IP 协议&quot;">​</a></h2><p>计算机网络相互连接进行通信而设计的协议</p><h2 id="ip-地址-1" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址-1" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h2><p>唯一地址</p><h2 id="ip-地址类型" tabindex="-1">IP 地址类型 <a class="header-anchor" href="#ip-地址类型" aria-label="Permalink to &quot;IP 地址类型&quot;">​</a></h2><h3 id="公有地址" tabindex="-1">公有地址 <a class="header-anchor" href="#公有地址" aria-label="Permalink to &quot;公有地址&quot;">​</a></h3><p>权威机构</p><h3 id="私有地址" tabindex="-1">私有地址 <a class="header-anchor" href="#私有地址" aria-label="Permalink to &quot;私有地址&quot;">​</a></h3><p>A 类 10.0.0.0--10.255.255.255 B 类 172.16.0.0--172.31.255.255 C 类 192.168.0.0--192.168.255.255</p><p>D、E 类为特殊地址</p><h2 id="ip-地址编址方式" tabindex="-1">IP 地址编址方式 <a class="header-anchor" href="#ip-地址编址方式" aria-label="Permalink to &quot;IP 地址编址方式&quot;">​</a></h2><table><thead><tr><th>类别</th><th>最大网络数</th><th>IP 地址范围</th><th>单个网段最大主机数</th><th>私有 IP 地址范围</th></tr></thead><tbody><tr><td>A</td><td>126(2^7-2)</td><td>1.0.0.1-127.255.255.254</td><td>16777214</td><td>10.0.0.0-10.255.255.255</td></tr><tr><td>B</td><td>16384(2^14)</td><td>128.0.0.1-191.255.255.254</td><td>65534</td><td>172.16.0.0-172.31.255.255</td></tr><tr><td>C</td><td>2097152(2^21)</td><td>192.0.0.1-223.255.255.254</td><td>254</td><td>192.168.0.0-192.168.255.255</td></tr></tbody></table><h3 id="a-类地址" tabindex="-1">A 类地址 <a class="header-anchor" href="#a-类地址" aria-label="Permalink to &quot;A 类地址&quot;">​</a></h3><p>1 字节的网络地址 + 3 字节主机地址 <code>网络地址的最高位必须为 0</code></p><h3 id="b-类地址" tabindex="-1">B 类地址 <a class="header-anchor" href="#b-类地址" aria-label="Permalink to &quot;B 类地址&quot;">​</a></h3><p>2 字节的网络地址 + 2 字节主机地址 <code>网络地址的最高位必须为 10</code></p><h3 id="c-类地址" tabindex="-1">C 类地址 <a class="header-anchor" href="#c-类地址" aria-label="Permalink to &quot;C 类地址&quot;">​</a></h3><p>3 字节的网络地址 + 1 字节的主机地址 <code>网络地址的最高位必须为 110</code></p><h3 id="d-类地址" tabindex="-1">D 类地址 <a class="header-anchor" href="#d-类地址" aria-label="Permalink to &quot;D 类地址&quot;">​</a></h3><p>多播地址，也称组播地址（<code>多播地址的最高位必须为 1110</code> === 224.0.0.0 - 239.255.255.255）</p><h3 id="e-类地址" tabindex="-1">E 类地址 <a class="header-anchor" href="#e-类地址" aria-label="Permalink to &quot;E 类地址&quot;">​</a></h3><p>试验用处 <code>最高位必须为 1111</code></p><h3 id="特殊的网址" tabindex="-1">特殊的网址 <a class="header-anchor" href="#特殊的网址" aria-label="Permalink to &quot;特殊的网址&quot;">​</a></h3><ol><li>每一个字节都为 0 的地址（0.0.0.0）对应于当前主机</li><li>IP 地址中的每一个字节都为 1 的 IP 地址（255．255．255．255）是当前子网的广播地址</li><li>IP 地址中凡是以 11110 开头的 E 类 IP 地址都保留用于将来和实验使用</li><li>IP 地址中不能以十进制 127 作为开头，该类地址中数字 127．0．0．1 到 127．255．255．255 用于回路测试，如：127.0.0.1 可以代表本机 IP 地址，用 127.0.0.1 就可以测试本机中配置的 Web 服务器</li><li>网络 ID 的第一个 6 位组也不能全置为 0，全 0 表示本地网络</li></ol><h2 id="ip-地址的分配" tabindex="-1">IP 地址的分配 <a class="header-anchor" href="#ip-地址的分配" aria-label="Permalink to &quot;IP 地址的分配&quot;">​</a></h2><p>TCP/IP 协议需要针对不同的网络进行不同的设置，且每个节点一般需要一个 IP 地址、一个子网掩码、一个默认网关</p>',28),i=[o];function h(l,n,c,p,s,P){return t(),e("div",null,i)}const _=a(r,[["render",h]]);export{u as __pageData,_ as default};
diff --git a/assets/network_ip_addr.md.c87e2877.lean.js b/assets/network_ip_addr.md.7e144e39.lean.js
similarity index 69%
rename from assets/network_ip_addr.md.c87e2877.lean.js
rename to assets/network_ip_addr.md.7e144e39.lean.js
index ddb4433..2aa92e3 100644
--- a/assets/network_ip_addr.md.c87e2877.lean.js
+++ b/assets/network_ip_addr.md.7e144e39.lean.js
@@ -1 +1 @@
-import{_ as a,o as t,c as e,Q as d}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"IP 地址","description":"","frontmatter":{},"headers":[],"relativePath":"network/ip_addr.md","filePath":"network/ip_addr.md","lastUpdated":1670330848000}'),r={name:"network/ip_addr.md"},o=d("",28),i=[o];function h(l,n,c,p,s,P){return t(),e("div",null,i)}const _=a(r,[["render",h]]);export{u as __pageData,_ as default};
+import{_ as a,o as t,c as e,Q as d}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"IP 地址","description":"","frontmatter":{},"headers":[],"relativePath":"network/ip_addr.md","filePath":"network/ip_addr.md","lastUpdated":1670330848000}'),r={name:"network/ip_addr.md"},o=d("",28),i=[o];function h(l,n,c,p,s,P){return t(),e("div",null,i)}const _=a(r,[["render",h]]);export{u as __pageData,_ as default};
diff --git a/assets/network_layer.md.75f275a2.js b/assets/network_layer.md.75f275a2.js
deleted file mode 100644
index 0a38767..0000000
--- a/assets/network_layer.md.75f275a2.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/layer.png",u=JSON.parse('{"title":"网络分层","description":"","frontmatter":{},"headers":[],"relativePath":"network/layer.md","filePath":"network/layer.md","lastUpdated":1670379203000}'),s={name:"network/layer.md"},n=r('<h1 id="网络分层" tabindex="-1">网络分层 <a class="header-anchor" href="#网络分层" aria-label="Permalink to &quot;网络分层&quot;">​</a></h1><h2 id="工作过程" tabindex="-1">工作过程 <a class="header-anchor" href="#工作过程" aria-label="Permalink to &quot;工作过程&quot;">​</a></h2><img src="'+o+'" alt="网络分层工作流程图">',3),_=[n];function c(i,l,d,h,m,p){return a(),t("div",null,_)}const k=e(s,[["render",c]]);export{u as __pageData,k as default};
diff --git a/assets/network_layer.md.75f275a2.lean.js b/assets/network_layer.md.75f275a2.lean.js
deleted file mode 100644
index 2dae0b6..0000000
--- a/assets/network_layer.md.75f275a2.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/layer.png",u=JSON.parse('{"title":"网络分层","description":"","frontmatter":{},"headers":[],"relativePath":"network/layer.md","filePath":"network/layer.md","lastUpdated":1670379203000}'),s={name:"network/layer.md"},n=r("",3),_=[n];function c(i,l,d,h,m,p){return a(),t("div",null,_)}const k=e(s,[["render",c]]);export{u as __pageData,k as default};
diff --git a/assets/network_layer.md.e12ef59e.js b/assets/network_layer.md.e12ef59e.js
new file mode 100644
index 0000000..444e855
--- /dev/null
+++ b/assets/network_layer.md.e12ef59e.js
@@ -0,0 +1 @@
+import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/layer.png",u=JSON.parse('{"title":"网络分层","description":"","frontmatter":{},"headers":[],"relativePath":"network/layer.md","filePath":"network/layer.md","lastUpdated":1670379203000}'),s={name:"network/layer.md"},n=r('<h1 id="网络分层" tabindex="-1">网络分层 <a class="header-anchor" href="#网络分层" aria-label="Permalink to &quot;网络分层&quot;">​</a></h1><h2 id="工作过程" tabindex="-1">工作过程 <a class="header-anchor" href="#工作过程" aria-label="Permalink to &quot;工作过程&quot;">​</a></h2><img src="'+o+'" alt="网络分层工作流程图">',3),_=[n];function c(i,l,d,h,m,p){return a(),t("div",null,_)}const k=e(s,[["render",c]]);export{u as __pageData,k as default};
diff --git a/assets/network_layer.md.e12ef59e.lean.js b/assets/network_layer.md.e12ef59e.lean.js
new file mode 100644
index 0000000..3e8d760
--- /dev/null
+++ b/assets/network_layer.md.e12ef59e.lean.js
@@ -0,0 +1 @@
+import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/layer.png",u=JSON.parse('{"title":"网络分层","description":"","frontmatter":{},"headers":[],"relativePath":"network/layer.md","filePath":"network/layer.md","lastUpdated":1670379203000}'),s={name:"network/layer.md"},n=r("",3),_=[n];function c(i,l,d,h,m,p){return a(),t("div",null,_)}const k=e(s,[["render",c]]);export{u as __pageData,k as default};
diff --git a/assets/network_methods.md.d5348171.js b/assets/network_methods.md.a8694107.js
similarity index 97%
rename from assets/network_methods.md.d5348171.js
rename to assets/network_methods.md.a8694107.js
index 18d7268..249b984 100644
--- a/assets/network_methods.md.d5348171.js
+++ b/assets/network_methods.md.a8694107.js
@@ -1 +1 @@
-import{_ as t,o as a,c as e,Q as d}from"./chunks/framework.7c0fadea.js";const P=JSON.parse('{"title":"HTTP 请求方法","description":"","frontmatter":{},"headers":[],"relativePath":"network/methods.md","filePath":"network/methods.md","lastUpdated":1670330848000}'),r={name:"network/methods.md"},o=d('<h1 id="http-请求方法" tabindex="-1">HTTP 请求方法 <a class="header-anchor" href="#http-请求方法" aria-label="Permalink to &quot;HTTP 请求方法&quot;">​</a></h1><p><a href="https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol#Request_methods" target="_blank" rel="noreferrer">Wiki - HyperText Transfer Protocol</a></p><p>9 种方法</p><h2 id="get" tabindex="-1">GET <a class="header-anchor" href="#get" aria-label="Permalink to &quot;GET&quot;">​</a></h2><p>向指定的资源发起请求</p><h2 id="head" tabindex="-1">HEAD <a class="header-anchor" href="#head" aria-label="Permalink to &quot;HEAD&quot;">​</a></h2><p>和 GET 一样，向服务器发出指定资源的请求，但是没有响应头</p><h2 id="post" tabindex="-1">POST <a class="header-anchor" href="#post" aria-label="Permalink to &quot;POST&quot;">​</a></h2><p>向指定资源提交数据，请求服务器进行处理（提交表单或者上传文件），可能会创建新的资源或者修改资源，或二者都可</p><h3 id="请求-body-格式" tabindex="-1">请求 body 格式 <a class="header-anchor" href="#请求-body-格式" aria-label="Permalink to &quot;请求 body 格式&quot;">​</a></h3><ul><li>application/x-www-form-urlencoded</li><li>application/json</li><li>multipart/form-data</li></ul><h2 id="put" tabindex="-1">PUT <a class="header-anchor" href="#put" aria-label="Permalink to &quot;PUT&quot;">​</a></h2><p>向指定资源位置上传其最新内容（资源已创建，直接修改）</p><h2 id="delete" tabindex="-1">DELETE <a class="header-anchor" href="#delete" aria-label="Permalink to &quot;DELETE&quot;">​</a></h2><p>请求服务删除 Request-URI 所标识的资源</p><h2 id="trace" tabindex="-1">TRACE <a class="header-anchor" href="#trace" aria-label="Permalink to &quot;TRACE&quot;">​</a></h2><p>回显服务器收到的请求，用于测试或诊断（请求目标资源在响应正文中传输收到的请求）</p><h2 id="options" tabindex="-1">OPTIONS <a class="header-anchor" href="#options" aria-label="Permalink to &quot;OPTIONS&quot;">​</a></h2><p>向服务器发出预请求，判断服务器是否支持该请求方法以及响应</p><h2 id="connect" tabindex="-1">CONNECT <a class="header-anchor" href="#connect" aria-label="Permalink to &quot;CONNECT&quot;">​</a></h2><ul><li>HTTP1.1 预留给能够将连接改为隧道方式的代理服务器（通常用于 SSL 加密服务器的链接）</li><li>请求中介建立到请求目标表示的源服务器的 TCP/IP 隧道（一个或多个带有 TLS 的 HTTP 代理来保护连接）</li></ul><h2 id="patch" tabindex="-1">PATCH <a class="header-anchor" href="#patch" aria-label="Permalink to &quot;PATCH&quot;">​</a></h2><p>请求目标资源根据请求中包含的表示中定义的部分更新来修改其状态（更新文件或文档的一部分来节省带宽，而不必完全传输）</p><h2 id="对比" tabindex="-1">对比 <a class="header-anchor" href="#对比" aria-label="Permalink to &quot;对比&quot;">​</a></h2><table><thead><tr><th>请求方法</th><th>request(请求体)</th><th>response(响应头)</th><th>safe(安全)</th><th>indempotent(幂等)</th><th>cachcable(缓存)</th></tr></thead><tbody><tr><td>GET</td><td>optional</td><td>yes</td><td>yes</td><td>yes</td><td>yes</td></tr><tr><td>POST</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td><td>yes</td></tr><tr><td>HEAD</td><td>optional</td><td><i class="warn">no</i></td><td>yes</td><td>yes</td><td>yes</td></tr><tr><td>PUT</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>DELETE</td><td>optional</td><td>yes</td><td><i class="warn">no</i></td><td>yes</td><td><i class="warn"></i></td></tr><tr><td>TRACE</td><td><i class="warn">no</i></td><td>yes</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>CONNECT</td><td>optional</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td></tr><tr><td>OPTIONS</td><td>optional</td><td>yes</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>PATCH</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td><td><i class="warn">no</i></td></tr></tbody></table><blockquote><p>总结</p></blockquote><ul><li>POST PUT PATCH 需要请求体(request)，其他请求方法可选</li><li>响应体(response)只有 HEAD 不返回，其他请求方法都可以有响应体</li><li>POST PUT PATCH 涉及到资源的修改和创建都是不安全的，其他请求方法相对安全</li><li>POST CONNCET PATCH 都不是幂等(idempotent)(请求多次，输出的结果都是一样的)，具有副作用</li><li>GET POST HEAD 三种方法可以缓存，其他方法不可缓存</li></ul>',27),i=[o];function s(l,n,h,c,p,T){return a(),e("div",null,i)}const _=t(r,[["render",s]]);export{P as __pageData,_ as default};
+import{_ as t,o as a,c as e,Q as d}from"./chunks/framework.0e8ae64e.js";const P=JSON.parse('{"title":"HTTP 请求方法","description":"","frontmatter":{},"headers":[],"relativePath":"network/methods.md","filePath":"network/methods.md","lastUpdated":1670330848000}'),r={name:"network/methods.md"},o=d('<h1 id="http-请求方法" tabindex="-1">HTTP 请求方法 <a class="header-anchor" href="#http-请求方法" aria-label="Permalink to &quot;HTTP 请求方法&quot;">​</a></h1><p><a href="https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol#Request_methods" target="_blank" rel="noreferrer">Wiki - HyperText Transfer Protocol</a></p><p>9 种方法</p><h2 id="get" tabindex="-1">GET <a class="header-anchor" href="#get" aria-label="Permalink to &quot;GET&quot;">​</a></h2><p>向指定的资源发起请求</p><h2 id="head" tabindex="-1">HEAD <a class="header-anchor" href="#head" aria-label="Permalink to &quot;HEAD&quot;">​</a></h2><p>和 GET 一样，向服务器发出指定资源的请求，但是没有响应头</p><h2 id="post" tabindex="-1">POST <a class="header-anchor" href="#post" aria-label="Permalink to &quot;POST&quot;">​</a></h2><p>向指定资源提交数据，请求服务器进行处理（提交表单或者上传文件），可能会创建新的资源或者修改资源，或二者都可</p><h3 id="请求-body-格式" tabindex="-1">请求 body 格式 <a class="header-anchor" href="#请求-body-格式" aria-label="Permalink to &quot;请求 body 格式&quot;">​</a></h3><ul><li>application/x-www-form-urlencoded</li><li>application/json</li><li>multipart/form-data</li></ul><h2 id="put" tabindex="-1">PUT <a class="header-anchor" href="#put" aria-label="Permalink to &quot;PUT&quot;">​</a></h2><p>向指定资源位置上传其最新内容（资源已创建，直接修改）</p><h2 id="delete" tabindex="-1">DELETE <a class="header-anchor" href="#delete" aria-label="Permalink to &quot;DELETE&quot;">​</a></h2><p>请求服务删除 Request-URI 所标识的资源</p><h2 id="trace" tabindex="-1">TRACE <a class="header-anchor" href="#trace" aria-label="Permalink to &quot;TRACE&quot;">​</a></h2><p>回显服务器收到的请求，用于测试或诊断（请求目标资源在响应正文中传输收到的请求）</p><h2 id="options" tabindex="-1">OPTIONS <a class="header-anchor" href="#options" aria-label="Permalink to &quot;OPTIONS&quot;">​</a></h2><p>向服务器发出预请求，判断服务器是否支持该请求方法以及响应</p><h2 id="connect" tabindex="-1">CONNECT <a class="header-anchor" href="#connect" aria-label="Permalink to &quot;CONNECT&quot;">​</a></h2><ul><li>HTTP1.1 预留给能够将连接改为隧道方式的代理服务器（通常用于 SSL 加密服务器的链接）</li><li>请求中介建立到请求目标表示的源服务器的 TCP/IP 隧道（一个或多个带有 TLS 的 HTTP 代理来保护连接）</li></ul><h2 id="patch" tabindex="-1">PATCH <a class="header-anchor" href="#patch" aria-label="Permalink to &quot;PATCH&quot;">​</a></h2><p>请求目标资源根据请求中包含的表示中定义的部分更新来修改其状态（更新文件或文档的一部分来节省带宽，而不必完全传输）</p><h2 id="对比" tabindex="-1">对比 <a class="header-anchor" href="#对比" aria-label="Permalink to &quot;对比&quot;">​</a></h2><table><thead><tr><th>请求方法</th><th>request(请求体)</th><th>response(响应头)</th><th>safe(安全)</th><th>indempotent(幂等)</th><th>cachcable(缓存)</th></tr></thead><tbody><tr><td>GET</td><td>optional</td><td>yes</td><td>yes</td><td>yes</td><td>yes</td></tr><tr><td>POST</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td><td>yes</td></tr><tr><td>HEAD</td><td>optional</td><td><i class="warn">no</i></td><td>yes</td><td>yes</td><td>yes</td></tr><tr><td>PUT</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>DELETE</td><td>optional</td><td>yes</td><td><i class="warn">no</i></td><td>yes</td><td><i class="warn"></i></td></tr><tr><td>TRACE</td><td><i class="warn">no</i></td><td>yes</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>CONNECT</td><td>optional</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td></tr><tr><td>OPTIONS</td><td>optional</td><td>yes</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>PATCH</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td><td><i class="warn">no</i></td></tr></tbody></table><blockquote><p>总结</p></blockquote><ul><li>POST PUT PATCH 需要请求体(request)，其他请求方法可选</li><li>响应体(response)只有 HEAD 不返回，其他请求方法都可以有响应体</li><li>POST PUT PATCH 涉及到资源的修改和创建都是不安全的，其他请求方法相对安全</li><li>POST CONNCET PATCH 都不是幂等(idempotent)(请求多次，输出的结果都是一样的)，具有副作用</li><li>GET POST HEAD 三种方法可以缓存，其他方法不可缓存</li></ul>',27),i=[o];function s(l,n,h,c,p,T){return a(),e("div",null,i)}const _=t(r,[["render",s]]);export{P as __pageData,_ as default};
diff --git a/assets/network_methods.md.d5348171.lean.js b/assets/network_methods.md.a8694107.lean.js
similarity index 70%
rename from assets/network_methods.md.d5348171.lean.js
rename to assets/network_methods.md.a8694107.lean.js
index 103fc50..d6b89d8 100644
--- a/assets/network_methods.md.d5348171.lean.js
+++ b/assets/network_methods.md.a8694107.lean.js
@@ -1 +1 @@
-import{_ as t,o as a,c as e,Q as d}from"./chunks/framework.7c0fadea.js";const P=JSON.parse('{"title":"HTTP 请求方法","description":"","frontmatter":{},"headers":[],"relativePath":"network/methods.md","filePath":"network/methods.md","lastUpdated":1670330848000}'),r={name:"network/methods.md"},o=d("",27),i=[o];function s(l,n,h,c,p,T){return a(),e("div",null,i)}const _=t(r,[["render",s]]);export{P as __pageData,_ as default};
+import{_ as t,o as a,c as e,Q as d}from"./chunks/framework.0e8ae64e.js";const P=JSON.parse('{"title":"HTTP 请求方法","description":"","frontmatter":{},"headers":[],"relativePath":"network/methods.md","filePath":"network/methods.md","lastUpdated":1670330848000}'),r={name:"network/methods.md"},o=d("",27),i=[o];function s(l,n,h,c,p,T){return a(),e("div",null,i)}const _=t(r,[["render",s]]);export{P as __pageData,_ as default};
diff --git a/assets/network_noun.md.e1eac5d1.js b/assets/network_noun.md.b1b4cd32.js
similarity index 95%
rename from assets/network_noun.md.e1eac5d1.js
rename to assets/network_noun.md.b1b4cd32.js
index 940ab8f..20bc83b 100644
--- a/assets/network_noun.md.e1eac5d1.js
+++ b/assets/network_noun.md.b1b4cd32.js
@@ -1 +1 @@
-import{_ as a,o as e,c as l,Q as o}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"计算机网络名词","description":"","frontmatter":{},"headers":[],"relativePath":"network/noun.md","filePath":"network/noun.md","lastUpdated":1670330848000}'),t={name:"network/noun.md"},i=o('<h1 id="计算机网络名词" tabindex="-1">计算机网络名词 <a class="header-anchor" href="#计算机网络名词" aria-label="Permalink to &quot;计算机网络名词&quot;">​</a></h1><h2 id="以太网" tabindex="-1">以太网 <a class="header-anchor" href="#以太网" aria-label="Permalink to &quot;以太网&quot;">​</a></h2><p><code>拓扑结构</code></p><p>计算机局域网技术（规定了包括物理层的连线、电子信号和介质访问层协议的内容）</p><ul><li>经典以太网（运行速度 3 - 10Mbps)</li><li>交换式以太网（使用交换机 100、1000 和 10000Mbps 高速率）</li></ul><h2 id="交换机" tabindex="-1">交换机 <a class="header-anchor" href="#交换机" aria-label="Permalink to &quot;交换机&quot;">​</a></h2><p><code>Switch 开关</code> 工作于 OSI 模型的第二层，数据链路层</p><p>用于电（光）信号转发的网络设备（为接入交换机的任意两个网络节点提供独享的电信号通路）</p><ul><li>基于 MAC 地址识别，能完成封装转发数据帧功能的网络设备</li><li>MAC 地址缓存</li></ul><h2 id="网关" tabindex="-1">网关 <a class="header-anchor" href="#网关" aria-label="Permalink to &quot;网关&quot;">​</a></h2><p><code>Gateway 网间连接器、协议转换器</code> 工作于应用层</p><p>网关在网络层以上实现网络互连，是复杂的网络互连设备，仅用于两个高层协议不同的网络互连</p><ul><li>广域网互连、局域网互连</li><li>充当转换重任的计算机系统或设备（翻译器）</li><li>一个网络通向其他网络的 IP 地址</li></ul><h2 id="路由器" tabindex="-1">路由器 <a class="header-anchor" href="#路由器" aria-label="Permalink to &quot;路由器&quot;">​</a></h2><p><code>Router</code> 网络层设备</p><p>连接两个或多个网络的硬件设备，起网关作用，是读取每一个数据包中的地址然后决定如何传送的专用智能性的网络设备</p><ul><li>实现 IP、TCP、UDP、ICMP 等网络的互连</li><li>对数据进行处理（收发数据包、具有对数据的分组过滤、复用、加密、压缩及防护墙等各项功能）</li><li>依据路由表的信息，对数据包下一传输目的地进行选择</li><li>进行外部网关协议和其他自治域之间拓扑信息的交换</li><li>实现网络管理和系统支持功能</li></ul><h2 id="mac-地址" tabindex="-1">MAC 地址 <a class="header-anchor" href="#mac-地址" aria-label="Permalink to &quot;MAC 地址&quot;">​</a></h2><p><code>Media Access Control Address</code> 媒体存取控制位址、局域网地址</p><p>用于确认网络设备位置的地址，位于数据链路层</p>',20),r=[i];function n(c,d,s,h,p,u){return e(),l("div",null,r)}const P=a(t,[["render",n]]);export{m as __pageData,P as default};
+import{_ as a,o as e,c as l,Q as o}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"计算机网络名词","description":"","frontmatter":{},"headers":[],"relativePath":"network/noun.md","filePath":"network/noun.md","lastUpdated":1670330848000}'),t={name:"network/noun.md"},i=o('<h1 id="计算机网络名词" tabindex="-1">计算机网络名词 <a class="header-anchor" href="#计算机网络名词" aria-label="Permalink to &quot;计算机网络名词&quot;">​</a></h1><h2 id="以太网" tabindex="-1">以太网 <a class="header-anchor" href="#以太网" aria-label="Permalink to &quot;以太网&quot;">​</a></h2><p><code>拓扑结构</code></p><p>计算机局域网技术（规定了包括物理层的连线、电子信号和介质访问层协议的内容）</p><ul><li>经典以太网（运行速度 3 - 10Mbps)</li><li>交换式以太网（使用交换机 100、1000 和 10000Mbps 高速率）</li></ul><h2 id="交换机" tabindex="-1">交换机 <a class="header-anchor" href="#交换机" aria-label="Permalink to &quot;交换机&quot;">​</a></h2><p><code>Switch 开关</code> 工作于 OSI 模型的第二层，数据链路层</p><p>用于电（光）信号转发的网络设备（为接入交换机的任意两个网络节点提供独享的电信号通路）</p><ul><li>基于 MAC 地址识别，能完成封装转发数据帧功能的网络设备</li><li>MAC 地址缓存</li></ul><h2 id="网关" tabindex="-1">网关 <a class="header-anchor" href="#网关" aria-label="Permalink to &quot;网关&quot;">​</a></h2><p><code>Gateway 网间连接器、协议转换器</code> 工作于应用层</p><p>网关在网络层以上实现网络互连，是复杂的网络互连设备，仅用于两个高层协议不同的网络互连</p><ul><li>广域网互连、局域网互连</li><li>充当转换重任的计算机系统或设备（翻译器）</li><li>一个网络通向其他网络的 IP 地址</li></ul><h2 id="路由器" tabindex="-1">路由器 <a class="header-anchor" href="#路由器" aria-label="Permalink to &quot;路由器&quot;">​</a></h2><p><code>Router</code> 网络层设备</p><p>连接两个或多个网络的硬件设备，起网关作用，是读取每一个数据包中的地址然后决定如何传送的专用智能性的网络设备</p><ul><li>实现 IP、TCP、UDP、ICMP 等网络的互连</li><li>对数据进行处理（收发数据包、具有对数据的分组过滤、复用、加密、压缩及防护墙等各项功能）</li><li>依据路由表的信息，对数据包下一传输目的地进行选择</li><li>进行外部网关协议和其他自治域之间拓扑信息的交换</li><li>实现网络管理和系统支持功能</li></ul><h2 id="mac-地址" tabindex="-1">MAC 地址 <a class="header-anchor" href="#mac-地址" aria-label="Permalink to &quot;MAC 地址&quot;">​</a></h2><p><code>Media Access Control Address</code> 媒体存取控制位址、局域网地址</p><p>用于确认网络设备位置的地址，位于数据链路层</p>',20),r=[i];function n(c,d,s,h,p,u){return e(),l("div",null,r)}const P=a(t,[["render",n]]);export{m as __pageData,P as default};
diff --git a/assets/network_noun.md.e1eac5d1.lean.js b/assets/network_noun.md.b1b4cd32.lean.js
similarity index 69%
rename from assets/network_noun.md.e1eac5d1.lean.js
rename to assets/network_noun.md.b1b4cd32.lean.js
index bd7a422..d418284 100644
--- a/assets/network_noun.md.e1eac5d1.lean.js
+++ b/assets/network_noun.md.b1b4cd32.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as l,Q as o}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"计算机网络名词","description":"","frontmatter":{},"headers":[],"relativePath":"network/noun.md","filePath":"network/noun.md","lastUpdated":1670330848000}'),t={name:"network/noun.md"},i=o("",20),r=[i];function n(c,d,s,h,p,u){return e(),l("div",null,r)}const P=a(t,[["render",n]]);export{m as __pageData,P as default};
+import{_ as a,o as e,c as l,Q as o}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"计算机网络名词","description":"","frontmatter":{},"headers":[],"relativePath":"network/noun.md","filePath":"network/noun.md","lastUpdated":1670330848000}'),t={name:"network/noun.md"},i=o("",20),r=[i];function n(c,d,s,h,p,u){return e(),l("div",null,r)}const P=a(t,[["render",n]]);export{m as __pageData,P as default};
diff --git a/assets/network_osi.md.3b1c2623.js b/assets/network_osi.md.021cfe3c.js
similarity index 98%
rename from assets/network_osi.md.3b1c2623.js
rename to assets/network_osi.md.021cfe3c.js
index 667429b..4a53c5a 100644
--- a/assets/network_osi.md.3b1c2623.js
+++ b/assets/network_osi.md.021cfe3c.js
@@ -1 +1 @@
-import{_ as a,o as e,c as o,Q as l}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"网络模型","description":"","frontmatter":{},"headers":[],"relativePath":"network/osi.md","filePath":"network/osi.md","lastUpdated":1670330848000}'),i={name:"network/osi.md"},t=l('<h1 id="网络模型" tabindex="-1">网络模型 <a class="header-anchor" href="#网络模型" aria-label="Permalink to &quot;网络模型&quot;">​</a></h1><h2 id="网络传输协议" tabindex="-1">网络传输协议 <a class="header-anchor" href="#网络传输协议" aria-label="Permalink to &quot;网络传输协议&quot;">​</a></h2><p><code>Communications Protocol</code></p><p>在任何物理介质中允许两个或多个在传输系统中的终端之间传播信息的系统标准，计算机通信或网上设备的共同语言</p><h2 id="osi-网络模型" tabindex="-1">OSI 网络模型 <a class="header-anchor" href="#osi-网络模型" aria-label="Permalink to &quot;OSI 网络模型&quot;">​</a></h2><p>OSI（open system interconnect）</p><h3 id="应用层" tabindex="-1">应用层 <a class="header-anchor" href="#应用层" aria-label="Permalink to &quot;应用层&quot;">​</a></h3><p><code>Application Layer</code></p><p>提供为应用软件而设的接口，以设置与另一应用软件之间的通信（HTTP, HTTPS, FTP, TELNET, SSH, SMTP, POP3）</p><h3 id="表达层" tabindex="-1">表达层 <a class="header-anchor" href="#表达层" aria-label="Permalink to &quot;表达层&quot;">​</a></h3><p><code>Presentation Layer</code></p><p>把数据转换为能与接收者的系统格式兼容并适合传输的格式</p><h3 id="会话层" tabindex="-1">会话层 <a class="header-anchor" href="#会话层" aria-label="Permalink to &quot;会话层&quot;">​</a></h3><p><code>Session Layer</code></p><p>在数据传输中设置和维护计算机网络中两台计算机之间的通信连接</p><h3 id="传输层" tabindex="-1">传输层 <a class="header-anchor" href="#传输层" aria-label="Permalink to &quot;传输层&quot;">​</a></h3><p><code>Transport Layer</code></p><p>把传输表头（TH）加至数据以形成数据包。传输表头包含了所使用的协议等发送信息（TCP）</p><h3 id="网络层" tabindex="-1">网络层 <a class="header-anchor" href="#网络层" aria-label="Permalink to &quot;网络层&quot;">​</a></h3><p><code>Network Layer</code></p><p>决定数据的路径选择和转寄，将网络表头（NH）加至数据包，以形成分组，网络表头包含了网络数据（IP 协议）</p><h3 id="数据链路层" tabindex="-1">数据链路层 <a class="header-anchor" href="#数据链路层" aria-label="Permalink to &quot;数据链路层&quot;">​</a></h3><p><code>Data Link Layer</code></p><p>负责网络寻址、错误侦测和改错。当表头和表尾被加至数据包时，会形成帧。数据链表头（DLH）是包含了物理地址和错误侦测及改错的方法。数据链表尾（DLT）是一串指示数据包末端的字符串（以太网、WiFi、GPRS）</p><ul><li>逻辑链路控制子层(login link control, LLC)</li><li>介质访问控制子层(mdia access control, MAC)</li></ul><h3 id="物理层" tabindex="-1">物理层 <a class="header-anchor" href="#物理层" aria-label="Permalink to &quot;物理层&quot;">​</a></h3><p><code>Physical Layer</code></p><p>在局部局域网上传输数据帧，负责管理计算机通信设备和网络媒体之间的互通（针脚、电压、线缆规范、集线器、中继器、网卡、主机适配器）</p><h2 id="tcp-ip-协议" tabindex="-1">TCP/IP 协议 <a class="header-anchor" href="#tcp-ip-协议" aria-label="Permalink to &quot;TCP/IP 协议&quot;">​</a></h2><p><code>Transmission Control Protocol/Internet Protocol</code> 传输控制协议/网际协议</p><p>能够在多个不同网络间实现信息传输的协议簇（TCP IP FTP SMTP UDP)</p><blockquote><p>TCP/IP 的四层架构模型</p></blockquote><h3 id="链路层" tabindex="-1">链路层 <a class="header-anchor" href="#链路层" aria-label="Permalink to &quot;链路层&quot;">​</a></h3><p>对电信号进行分组形成具有特定意义的数据帧，然后以广播的形式通过物理介质发送给接收方</p><ul><li>网卡 --- 数据包必须是一块网卡传送到另一块网卡</li><li>主机读取 MAC 地址，处理接收包</li></ul><h3 id="网络层-1" tabindex="-1">网络层 <a class="header-anchor" href="#网络层-1" aria-label="Permalink to &quot;网络层&quot;">​</a></h3><ul><li>IP 协议</li></ul><blockquote><p>引入 IP 协议，制定了一套新地址，区分两台主机是否属于同一网络（网络地址 IP 地址）</p></blockquote><ul><li>ARP 协议</li></ul><blockquote><p>根据 IP 地址获取 MAC 地址的一个网络层协议</p></blockquote><ol><li>发起请求数据包，IP 地址 + 请求数据包，生成以太网数据包，广播</li><li>主机收到数据包，取出 IP 地址，与自己的 IP 地址对比，相同则返回 MAC 地址</li><li>接收返回消息，确定 MAC 地址</li><li>缓存（ARP 缓存返回的 MAC 地址 + IP 地址对应保留一定时间，以防下次请求）</li></ol><ul><li>路由协议</li></ul><blockquote><p>ARP 获取 MAC 地址完成这个路由协议的物理设备就是路由器（交通枢纽）=== 定义网络地址、区分网段、子网内 MAC 寻址、对于不同子网的数据包进行路由</p></blockquote><ul><li>ICMP 协议</li></ul><blockquote><p>因特网控制报文协议，主机与路由器之间进行控制信息传递（检查网络是否通畅、主机是否可达、路由是否可用）出现错误，自动返回错误的信息</p></blockquote><h3 id="传输层-1" tabindex="-1">传输层 <a class="header-anchor" href="#传输层-1" aria-label="Permalink to &quot;传输层&quot;">​</a></h3><p>数据包被发送到主机上以后，是无法确定哪个应用程序要接收这个包（为应用程序标识身份，定义端口）</p><ul><li>UDP 协议</li></ul><blockquote><p>定义了端口，同一个主机上的每个应用程序都需要指定唯一的端口号，传输指定端口（传输性较差）</p></blockquote><ul><li>TCP 协议</li></ul><blockquote><p>传输控制协议，面向链接的，可靠的，基于字节流的通信协议（TCP 确认机制的 UDP 协议）</p></blockquote><ol><li>数据包丢失，无法收到确认，重新发送数据包</li><li>三次对话的确认机制</li><li>首部 + 数据（TCP 数据包没有长度限制，TCP 数据包的长度不会超过 IP 数据包的长度，不必分割）</li></ol><h3 id="应用层-1" tabindex="-1">应用层 <a class="header-anchor" href="#应用层-1" aria-label="Permalink to &quot;应用层&quot;">​</a></h3><p>HTTP FTP SMTP</p><blockquote><p>定义数据格式并按照对应的格式解读数据</p></blockquote><p>请求 Header 中，定义请求数据格式 Accept 和响应数据格式 Content-Type</p><h3 id="缺陷" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><ol><li>没有明显地区区分服务、接口和协议的概念</li><li>不通用，不适用与 TCP/IP 模型之外的任何协议栈</li><li>链路层不是通常意义的一层（一个接口处于网络层和数据链路层之间）</li><li>TCP/IP 模型不区分物理层和数据链路层</li></ol>',58),r=[t];function c(n,h,p,d,s,P){return e(),o("div",null,r)}const q=a(i,[["render",c]]);export{b as __pageData,q as default};
+import{_ as a,o as e,c as o,Q as l}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"网络模型","description":"","frontmatter":{},"headers":[],"relativePath":"network/osi.md","filePath":"network/osi.md","lastUpdated":1670330848000}'),i={name:"network/osi.md"},t=l('<h1 id="网络模型" tabindex="-1">网络模型 <a class="header-anchor" href="#网络模型" aria-label="Permalink to &quot;网络模型&quot;">​</a></h1><h2 id="网络传输协议" tabindex="-1">网络传输协议 <a class="header-anchor" href="#网络传输协议" aria-label="Permalink to &quot;网络传输协议&quot;">​</a></h2><p><code>Communications Protocol</code></p><p>在任何物理介质中允许两个或多个在传输系统中的终端之间传播信息的系统标准，计算机通信或网上设备的共同语言</p><h2 id="osi-网络模型" tabindex="-1">OSI 网络模型 <a class="header-anchor" href="#osi-网络模型" aria-label="Permalink to &quot;OSI 网络模型&quot;">​</a></h2><p>OSI（open system interconnect）</p><h3 id="应用层" tabindex="-1">应用层 <a class="header-anchor" href="#应用层" aria-label="Permalink to &quot;应用层&quot;">​</a></h3><p><code>Application Layer</code></p><p>提供为应用软件而设的接口，以设置与另一应用软件之间的通信（HTTP, HTTPS, FTP, TELNET, SSH, SMTP, POP3）</p><h3 id="表达层" tabindex="-1">表达层 <a class="header-anchor" href="#表达层" aria-label="Permalink to &quot;表达层&quot;">​</a></h3><p><code>Presentation Layer</code></p><p>把数据转换为能与接收者的系统格式兼容并适合传输的格式</p><h3 id="会话层" tabindex="-1">会话层 <a class="header-anchor" href="#会话层" aria-label="Permalink to &quot;会话层&quot;">​</a></h3><p><code>Session Layer</code></p><p>在数据传输中设置和维护计算机网络中两台计算机之间的通信连接</p><h3 id="传输层" tabindex="-1">传输层 <a class="header-anchor" href="#传输层" aria-label="Permalink to &quot;传输层&quot;">​</a></h3><p><code>Transport Layer</code></p><p>把传输表头（TH）加至数据以形成数据包。传输表头包含了所使用的协议等发送信息（TCP）</p><h3 id="网络层" tabindex="-1">网络层 <a class="header-anchor" href="#网络层" aria-label="Permalink to &quot;网络层&quot;">​</a></h3><p><code>Network Layer</code></p><p>决定数据的路径选择和转寄，将网络表头（NH）加至数据包，以形成分组，网络表头包含了网络数据（IP 协议）</p><h3 id="数据链路层" tabindex="-1">数据链路层 <a class="header-anchor" href="#数据链路层" aria-label="Permalink to &quot;数据链路层&quot;">​</a></h3><p><code>Data Link Layer</code></p><p>负责网络寻址、错误侦测和改错。当表头和表尾被加至数据包时，会形成帧。数据链表头（DLH）是包含了物理地址和错误侦测及改错的方法。数据链表尾（DLT）是一串指示数据包末端的字符串（以太网、WiFi、GPRS）</p><ul><li>逻辑链路控制子层(login link control, LLC)</li><li>介质访问控制子层(mdia access control, MAC)</li></ul><h3 id="物理层" tabindex="-1">物理层 <a class="header-anchor" href="#物理层" aria-label="Permalink to &quot;物理层&quot;">​</a></h3><p><code>Physical Layer</code></p><p>在局部局域网上传输数据帧，负责管理计算机通信设备和网络媒体之间的互通（针脚、电压、线缆规范、集线器、中继器、网卡、主机适配器）</p><h2 id="tcp-ip-协议" tabindex="-1">TCP/IP 协议 <a class="header-anchor" href="#tcp-ip-协议" aria-label="Permalink to &quot;TCP/IP 协议&quot;">​</a></h2><p><code>Transmission Control Protocol/Internet Protocol</code> 传输控制协议/网际协议</p><p>能够在多个不同网络间实现信息传输的协议簇（TCP IP FTP SMTP UDP)</p><blockquote><p>TCP/IP 的四层架构模型</p></blockquote><h3 id="链路层" tabindex="-1">链路层 <a class="header-anchor" href="#链路层" aria-label="Permalink to &quot;链路层&quot;">​</a></h3><p>对电信号进行分组形成具有特定意义的数据帧，然后以广播的形式通过物理介质发送给接收方</p><ul><li>网卡 --- 数据包必须是一块网卡传送到另一块网卡</li><li>主机读取 MAC 地址，处理接收包</li></ul><h3 id="网络层-1" tabindex="-1">网络层 <a class="header-anchor" href="#网络层-1" aria-label="Permalink to &quot;网络层&quot;">​</a></h3><ul><li>IP 协议</li></ul><blockquote><p>引入 IP 协议，制定了一套新地址，区分两台主机是否属于同一网络（网络地址 IP 地址）</p></blockquote><ul><li>ARP 协议</li></ul><blockquote><p>根据 IP 地址获取 MAC 地址的一个网络层协议</p></blockquote><ol><li>发起请求数据包，IP 地址 + 请求数据包，生成以太网数据包，广播</li><li>主机收到数据包，取出 IP 地址，与自己的 IP 地址对比，相同则返回 MAC 地址</li><li>接收返回消息，确定 MAC 地址</li><li>缓存（ARP 缓存返回的 MAC 地址 + IP 地址对应保留一定时间，以防下次请求）</li></ol><ul><li>路由协议</li></ul><blockquote><p>ARP 获取 MAC 地址完成这个路由协议的物理设备就是路由器（交通枢纽）=== 定义网络地址、区分网段、子网内 MAC 寻址、对于不同子网的数据包进行路由</p></blockquote><ul><li>ICMP 协议</li></ul><blockquote><p>因特网控制报文协议，主机与路由器之间进行控制信息传递（检查网络是否通畅、主机是否可达、路由是否可用）出现错误，自动返回错误的信息</p></blockquote><h3 id="传输层-1" tabindex="-1">传输层 <a class="header-anchor" href="#传输层-1" aria-label="Permalink to &quot;传输层&quot;">​</a></h3><p>数据包被发送到主机上以后，是无法确定哪个应用程序要接收这个包（为应用程序标识身份，定义端口）</p><ul><li>UDP 协议</li></ul><blockquote><p>定义了端口，同一个主机上的每个应用程序都需要指定唯一的端口号，传输指定端口（传输性较差）</p></blockquote><ul><li>TCP 协议</li></ul><blockquote><p>传输控制协议，面向链接的，可靠的，基于字节流的通信协议（TCP 确认机制的 UDP 协议）</p></blockquote><ol><li>数据包丢失，无法收到确认，重新发送数据包</li><li>三次对话的确认机制</li><li>首部 + 数据（TCP 数据包没有长度限制，TCP 数据包的长度不会超过 IP 数据包的长度，不必分割）</li></ol><h3 id="应用层-1" tabindex="-1">应用层 <a class="header-anchor" href="#应用层-1" aria-label="Permalink to &quot;应用层&quot;">​</a></h3><p>HTTP FTP SMTP</p><blockquote><p>定义数据格式并按照对应的格式解读数据</p></blockquote><p>请求 Header 中，定义请求数据格式 Accept 和响应数据格式 Content-Type</p><h3 id="缺陷" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><ol><li>没有明显地区区分服务、接口和协议的概念</li><li>不通用，不适用与 TCP/IP 模型之外的任何协议栈</li><li>链路层不是通常意义的一层（一个接口处于网络层和数据链路层之间）</li><li>TCP/IP 模型不区分物理层和数据链路层</li></ol>',58),r=[t];function c(n,h,p,d,s,P){return e(),o("div",null,r)}const q=a(i,[["render",c]]);export{b as __pageData,q as default};
diff --git a/assets/network_osi.md.3b1c2623.lean.js b/assets/network_osi.md.021cfe3c.lean.js
similarity index 69%
rename from assets/network_osi.md.3b1c2623.lean.js
rename to assets/network_osi.md.021cfe3c.lean.js
index 519d94f..0b2dfad 100644
--- a/assets/network_osi.md.3b1c2623.lean.js
+++ b/assets/network_osi.md.021cfe3c.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as o,Q as l}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"网络模型","description":"","frontmatter":{},"headers":[],"relativePath":"network/osi.md","filePath":"network/osi.md","lastUpdated":1670330848000}'),i={name:"network/osi.md"},t=l("",58),r=[t];function c(n,h,p,d,s,P){return e(),o("div",null,r)}const q=a(i,[["render",c]]);export{b as __pageData,q as default};
+import{_ as a,o as e,c as o,Q as l}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"网络模型","description":"","frontmatter":{},"headers":[],"relativePath":"network/osi.md","filePath":"network/osi.md","lastUpdated":1670330848000}'),i={name:"network/osi.md"},t=l("",58),r=[t];function c(n,h,p,d,s,P){return e(),o("div",null,r)}const q=a(i,[["render",c]]);export{b as __pageData,q as default};
diff --git a/assets/network_socket.md.5f45c373.js b/assets/network_socket.md.a2e885ec.js
similarity index 98%
rename from assets/network_socket.md.5f45c373.js
rename to assets/network_socket.md.a2e885ec.js
index 17b0055..cd9801c 100644
--- a/assets/network_socket.md.5f45c373.js
+++ b/assets/network_socket.md.a2e885ec.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as e,Q as n}from"./chunks/framework.7c0fadea.js";const k=JSON.parse('{"title":"Socket","description":"","frontmatter":{},"headers":[],"relativePath":"network/socket.md","filePath":"network/socket.md","lastUpdated":1670330848000}'),l={name:"network/socket.md"},o=n(`<h1 id="socket" tabindex="-1">Socket <a class="header-anchor" href="#socket" aria-label="Permalink to &quot;Socket&quot;">​</a></h1><h2 id="socket-1" tabindex="-1">Socket <a class="header-anchor" href="#socket-1" aria-label="Permalink to &quot;Socket&quot;">​</a></h2><p>套接字(Socket)，对网络中不同主机的应用进程之间进行双向通信的端点的抽象（应用程序访问通信协议的操作系统调用套接字）</p><ul><li>套接字上联应用进程，下联网络协议栈</li><li>应用程序通过网络协议进行通信的接口</li><li>应用程序与网络协议栈进行交互的接口</li></ul><h3 id="表示方法" tabindex="-1">表示方法 <a class="header-anchor" href="#表示方法" aria-label="Permalink to &quot;表示方法&quot;">​</a></h3><p>IP 地址:端口号</p><h3 id="连接" tabindex="-1">连接 <a class="header-anchor" href="#连接" aria-label="Permalink to &quot;连接&quot;">​</a></h3><p>一对套接字：Client Socket/Servre Socket</p><ul><li>服务器监听</li></ul><p>服务器端套接字并不定位具体的客户端套接字，处于等待连接的状态，试试监控网络状态</p><ul><li>客户端请求</li></ul><p>客户端的套接字提出连接请求，要连接的目标是服务器端的套接字</p><ul><li>连接确认</li></ul><p>服务端套接字接收到客户端套接字的连接请求，响应客户端套接字的请求，建立新的线程，并把服务器端套接字的描述发送给客户端。客户端确认了此描述，连接建立，服务器端套接字继续处于监听状态，接收其他客户端套接字的连接请求</p><h2 id="websocket" tabindex="-1">WebSocket <a class="header-anchor" href="#websocket" aria-label="Permalink to &quot;WebSocket&quot;">​</a></h2><p>浏览器中用于双向通信的一种 TCP 传输协议，并复用 HTTP 的握手通道</p><h3 id="优点" tabindex="-1">优点 <a class="header-anchor" href="#优点" aria-label="Permalink to &quot;优点&quot;">​</a></h3><ul><li>支持双向通信，实时性更强</li><li>更好的二进制支持</li><li>较少的控制开销（数据包+4 字节的掩码，而 HTTP 每次请求都要携带完整的头部）</li><li>支持扩展（WS 协议定义了扩展，自定义扩展协议、自协议）自定义压缩算法</li></ul><h3 id="建立连接" tabindex="-1">建立连接 <a class="header-anchor" href="#建立连接" aria-label="Permalink to &quot;建立连接&quot;">​</a></h3><blockquote><p>客户端：申请协议升级</p></blockquote><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">GET / HTTP/1.1</span></span>
+import{_ as s,o as a,c as e,Q as n}from"./chunks/framework.0e8ae64e.js";const k=JSON.parse('{"title":"Socket","description":"","frontmatter":{},"headers":[],"relativePath":"network/socket.md","filePath":"network/socket.md","lastUpdated":1670330848000}'),l={name:"network/socket.md"},o=n(`<h1 id="socket" tabindex="-1">Socket <a class="header-anchor" href="#socket" aria-label="Permalink to &quot;Socket&quot;">​</a></h1><h2 id="socket-1" tabindex="-1">Socket <a class="header-anchor" href="#socket-1" aria-label="Permalink to &quot;Socket&quot;">​</a></h2><p>套接字(Socket)，对网络中不同主机的应用进程之间进行双向通信的端点的抽象（应用程序访问通信协议的操作系统调用套接字）</p><ul><li>套接字上联应用进程，下联网络协议栈</li><li>应用程序通过网络协议进行通信的接口</li><li>应用程序与网络协议栈进行交互的接口</li></ul><h3 id="表示方法" tabindex="-1">表示方法 <a class="header-anchor" href="#表示方法" aria-label="Permalink to &quot;表示方法&quot;">​</a></h3><p>IP 地址:端口号</p><h3 id="连接" tabindex="-1">连接 <a class="header-anchor" href="#连接" aria-label="Permalink to &quot;连接&quot;">​</a></h3><p>一对套接字：Client Socket/Servre Socket</p><ul><li>服务器监听</li></ul><p>服务器端套接字并不定位具体的客户端套接字，处于等待连接的状态，试试监控网络状态</p><ul><li>客户端请求</li></ul><p>客户端的套接字提出连接请求，要连接的目标是服务器端的套接字</p><ul><li>连接确认</li></ul><p>服务端套接字接收到客户端套接字的连接请求，响应客户端套接字的请求，建立新的线程，并把服务器端套接字的描述发送给客户端。客户端确认了此描述，连接建立，服务器端套接字继续处于监听状态，接收其他客户端套接字的连接请求</p><h2 id="websocket" tabindex="-1">WebSocket <a class="header-anchor" href="#websocket" aria-label="Permalink to &quot;WebSocket&quot;">​</a></h2><p>浏览器中用于双向通信的一种 TCP 传输协议，并复用 HTTP 的握手通道</p><h3 id="优点" tabindex="-1">优点 <a class="header-anchor" href="#优点" aria-label="Permalink to &quot;优点&quot;">​</a></h3><ul><li>支持双向通信，实时性更强</li><li>更好的二进制支持</li><li>较少的控制开销（数据包+4 字节的掩码，而 HTTP 每次请求都要携带完整的头部）</li><li>支持扩展（WS 协议定义了扩展，自定义扩展协议、自协议）自定义压缩算法</li></ul><h3 id="建立连接" tabindex="-1">建立连接 <a class="header-anchor" href="#建立连接" aria-label="Permalink to &quot;建立连接&quot;">​</a></h3><blockquote><p>客户端：申请协议升级</p></blockquote><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">GET / HTTP/1.1</span></span>
 <span class="line"><span style="color:#e1e4e8;">Host: localhost:8080</span></span>
 <span class="line"><span style="color:#e1e4e8;">Origin: http://127.0.0.1:3000</span></span>
 <span class="line"><span style="color:#e1e4e8;">Connection: Upgrade</span></span>
diff --git a/assets/network_socket.md.5f45c373.lean.js b/assets/network_socket.md.a2e885ec.lean.js
similarity index 69%
rename from assets/network_socket.md.5f45c373.lean.js
rename to assets/network_socket.md.a2e885ec.lean.js
index 60808a0..5494318 100644
--- a/assets/network_socket.md.5f45c373.lean.js
+++ b/assets/network_socket.md.a2e885ec.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as e,Q as n}from"./chunks/framework.7c0fadea.js";const k=JSON.parse('{"title":"Socket","description":"","frontmatter":{},"headers":[],"relativePath":"network/socket.md","filePath":"network/socket.md","lastUpdated":1670330848000}'),l={name:"network/socket.md"},o=n("",34),p=[o];function c(t,r,i,y,d,h){return a(),e("div",null,p)}const b=s(l,[["render",c]]);export{k as __pageData,b as default};
+import{_ as s,o as a,c as e,Q as n}from"./chunks/framework.0e8ae64e.js";const k=JSON.parse('{"title":"Socket","description":"","frontmatter":{},"headers":[],"relativePath":"network/socket.md","filePath":"network/socket.md","lastUpdated":1670330848000}'),l={name:"network/socket.md"},o=n("",34),p=[o];function c(t,r,i,y,d,h){return a(),e("div",null,p)}const b=s(l,[["render",c]]);export{k as __pageData,b as default};
diff --git a/assets/network_special_addr.md.8b6962a9.js b/assets/network_special_addr.md.deb0827e.js
similarity index 92%
rename from assets/network_special_addr.md.8b6962a9.js
rename to assets/network_special_addr.md.deb0827e.js
index 5fcda06..0cef437 100644
--- a/assets/network_special_addr.md.8b6962a9.js
+++ b/assets/network_special_addr.md.deb0827e.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"http 特殊地址","description":"","frontmatter":{},"headers":[],"relativePath":"network/special_addr.md","filePath":"network/special_addr.md","lastUpdated":1670330848000}'),o={name:"network/special_addr.md"},d=r('<h1 id="http-特殊地址" tabindex="-1">http 特殊地址 <a class="header-anchor" href="#http-特殊地址" aria-label="Permalink to &quot;http 特殊地址&quot;">​</a></h1><h2 id="_0-0-0-0" tabindex="-1">0.0.0.0 <a class="header-anchor" href="#_0-0-0-0" aria-label="Permalink to &quot;0.0.0.0&quot;">​</a></h2><p><code>INADDR_ANY</code></p><p>不可路由的源地址，用于指定无效、未知或不适用的目标（”无特定地址“占位符）</p><h3 id="服务器" tabindex="-1">服务器 <a class="header-anchor" href="#服务器" aria-label="Permalink to &quot;服务器&quot;">​</a></h3><p>常用于多机测试，监视当前分配给该多宿主设备上的接口的所有 IP 地址</p><h3 id="客户端" tabindex="-1">客户端 <a class="header-anchor" href="#客户端" aria-label="Permalink to &quot;客户端&quot;">​</a></h3><p>本地机器上的所有 IPv4 地址</p><h2 id="_127-0-0-1" tabindex="-1">127.0.0.1 <a class="header-anchor" href="#_127-0-0-1" aria-label="Permalink to &quot;127.0.0.1&quot;">​</a></h2><p>环回地址（localhost）。用于与最终用户使用的同一台机器或计算机建立 IP 连接</p>',10),h=[d];function i(s,c,l,n,_,p){return e(),t("div",null,h)}const f=a(o,[["render",i]]);export{m as __pageData,f as default};
+import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"http 特殊地址","description":"","frontmatter":{},"headers":[],"relativePath":"network/special_addr.md","filePath":"network/special_addr.md","lastUpdated":1670330848000}'),o={name:"network/special_addr.md"},d=r('<h1 id="http-特殊地址" tabindex="-1">http 特殊地址 <a class="header-anchor" href="#http-特殊地址" aria-label="Permalink to &quot;http 特殊地址&quot;">​</a></h1><h2 id="_0-0-0-0" tabindex="-1">0.0.0.0 <a class="header-anchor" href="#_0-0-0-0" aria-label="Permalink to &quot;0.0.0.0&quot;">​</a></h2><p><code>INADDR_ANY</code></p><p>不可路由的源地址，用于指定无效、未知或不适用的目标（”无特定地址“占位符）</p><h3 id="服务器" tabindex="-1">服务器 <a class="header-anchor" href="#服务器" aria-label="Permalink to &quot;服务器&quot;">​</a></h3><p>常用于多机测试，监视当前分配给该多宿主设备上的接口的所有 IP 地址</p><h3 id="客户端" tabindex="-1">客户端 <a class="header-anchor" href="#客户端" aria-label="Permalink to &quot;客户端&quot;">​</a></h3><p>本地机器上的所有 IPv4 地址</p><h2 id="_127-0-0-1" tabindex="-1">127.0.0.1 <a class="header-anchor" href="#_127-0-0-1" aria-label="Permalink to &quot;127.0.0.1&quot;">​</a></h2><p>环回地址（localhost）。用于与最终用户使用的同一台机器或计算机建立 IP 连接</p>',10),h=[d];function i(s,c,l,n,_,p){return e(),t("div",null,h)}const f=a(o,[["render",i]]);export{m as __pageData,f as default};
diff --git a/assets/network_special_addr.md.8b6962a9.lean.js b/assets/network_special_addr.md.deb0827e.lean.js
similarity index 71%
rename from assets/network_special_addr.md.8b6962a9.lean.js
rename to assets/network_special_addr.md.deb0827e.lean.js
index 5fc9842..11a5344 100644
--- a/assets/network_special_addr.md.8b6962a9.lean.js
+++ b/assets/network_special_addr.md.deb0827e.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"http 特殊地址","description":"","frontmatter":{},"headers":[],"relativePath":"network/special_addr.md","filePath":"network/special_addr.md","lastUpdated":1670330848000}'),o={name:"network/special_addr.md"},d=r("",10),h=[d];function i(s,c,l,n,_,p){return e(),t("div",null,h)}const f=a(o,[["render",i]]);export{m as __pageData,f as default};
+import{_ as a,o as e,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"http 特殊地址","description":"","frontmatter":{},"headers":[],"relativePath":"network/special_addr.md","filePath":"network/special_addr.md","lastUpdated":1670330848000}'),o={name:"network/special_addr.md"},d=r("",10),h=[d];function i(s,c,l,n,_,p){return e(),t("div",null,h)}const f=a(o,[["render",i]]);export{m as __pageData,f as default};
diff --git a/assets/network_status_code.md.3f54f40a.js b/assets/network_status_code.md.b6f517ca.js
similarity index 99%
rename from assets/network_status_code.md.3f54f40a.js
rename to assets/network_status_code.md.b6f517ca.js
index 1677a83..23d9b72 100644
--- a/assets/network_status_code.md.3f54f40a.js
+++ b/assets/network_status_code.md.b6f517ca.js
@@ -1 +1 @@
-import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"HTTP 状态码","description":"","frontmatter":{},"headers":[],"relativePath":"network/status_code.md","filePath":"network/status_code.md","lastUpdated":1670330848000}'),o={name:"network/status_code.md"},i=r('<h1 id="http-状态码" tabindex="-1">HTTP 状态码 <a class="header-anchor" href="#http-状态码" aria-label="Permalink to &quot;HTTP 状态码&quot;">​</a></h1><p>五类状态码，状态码的第一个数字代表了响应的五种状态之一。</p><p><a href="https://en.wikipedia.org/wiki/List_of_HTTP_status_codes" target="_blank" rel="noreferrer">Wiki - http status code</a></p><h2 id="_1xx" tabindex="-1">1xx <a class="header-anchor" href="#_1xx" aria-label="Permalink to &quot;1xx&quot;">​</a></h2><p>消息类型，<code>请求已被接受，需要继续等待服务器处理</code>，临时响应，以空行结束，HTTP1.0 协议中没有定义任何 1xx 状态码。</p><h3 id="_100-continue" tabindex="-1">100 Continue <a class="header-anchor" href="#_100-continue" aria-label="Permalink to &quot;100 Continue&quot;">​</a></h3><p>服务器已经接收到请求头，并且客户端应继续发送请求体。</p><h3 id="_101-switching-protocols" tabindex="-1">101 Switching Protocols <a class="header-anchor" href="#_101-switching-protocols" aria-label="Permalink to &quot;101 Switching Protocols&quot;">​</a></h3><p>服务器已经理解客户端的请求，并将通过 Upgrade 消息头通知客户端采用不同的协议来完成这个请求。（Websocket）</p><h3 id="_102-processing-webdav-rfc" tabindex="-1">102 Processing （WebDav）- RFC <a class="header-anchor" href="#_102-processing-webdav-rfc" aria-label="Permalink to &quot;102 Processing （WebDav）- RFC&quot;">​</a></h3><p>WebDav 请求包含许多涉及文件操作的自请求，需要很长时间才能完成请求。服务器已经收到并正在处理请求，但无响应可用。</p><h3 id="_103-early-hints-rfc" tabindex="-1">103 Early Hints - RFC <a class="header-anchor" href="#_103-early-hints-rfc" aria-label="Permalink to &quot;103 Early Hints - RFC&quot;">​</a></h3><p>用来在最终的 HTTP 消息之前返回一些响应头。</p><h2 id="_2xx" tabindex="-1">2xx <a class="header-anchor" href="#_2xx" aria-label="Permalink to &quot;2xx&quot;">​</a></h2><p>成功类型，代表请求已成功被服务器接收、理解、并接受。</p><h3 id="_200-ok" tabindex="-1">200 OK <a class="header-anchor" href="#_200-ok" aria-label="Permalink to &quot;200 OK&quot;">​</a></h3><p>请求已成功，请求所希望的响应头或数据体将随此响应返回。</p><h3 id="_201-created" tabindex="-1">201 Created <a class="header-anchor" href="#_201-created" aria-label="Permalink to &quot;201 Created&quot;">​</a></h3><p>请求已经被实现，而且有一个新的资源已经依据请求的需要而创建，且其 URI 已经随 Location 头信息返回。</p><h3 id="_202-accepted" tabindex="-1">202 Accepted <a class="header-anchor" href="#_202-accepted" aria-label="Permalink to &quot;202 Accepted&quot;">​</a></h3><p>服务器已经接受请求，单尚未处理。最终可能不会被执行，并且可能在处理发生时被禁止。</p><h3 id="_203-non-authroritative-information-http-1-1" tabindex="-1">203 Non-Authroritative Information HTTP/1.1 <a class="header-anchor" href="#_203-non-authroritative-information-http-1-1" aria-label="Permalink to &quot;203 Non-Authroritative Information HTTP/1.1&quot;">​</a></h3><p>服务器是一个转换代理服务器（网络加速器）</p><h3 id="_204-no-content" tabindex="-1">204 No Content <a class="header-anchor" href="#_204-no-content" aria-label="Permalink to &quot;204 No Content&quot;">​</a></h3><p>服务器成功处理了请求，没有返回任何内容。（Wi-Fi 接入，无需验证返回 204，需验证弹出网页浏览器界面）</p><h3 id="_205-reset-content" tabindex="-1">205 Reset Content <a class="header-anchor" href="#_205-reset-content" aria-label="Permalink to &quot;205 Reset Content&quot;">​</a></h3><p>与 204 不同的是，205 要求请求者重置文档视图。</p><h3 id="_206-partial-content-rfc" tabindex="-1">206 Partial Content - RFC <a class="header-anchor" href="#_206-partial-content-rfc" aria-label="Permalink to &quot;206 Partial Content - RFC&quot;">​</a></h3><p>服务器已经成功处理了部分 GET 请求（断点续传）</p><h3 id="_207-multi-status-rfc" tabindex="-1">207 Multi-Status - RFC <a class="header-anchor" href="#_207-multi-status-rfc" aria-label="Permalink to &quot;207 Multi-Status - RFC&quot;">​</a></h3><p>XML 消息</p><h3 id="_208-already-reported-rfc" tabindex="-1">208 Already Reported - RFC <a class="header-anchor" href="#_208-already-reported-rfc" aria-label="Permalink to &quot;208 Already Reported - RFC&quot;">​</a></h3><p>多状态</p><h3 id="_226-im-used-rfc" tabindex="-1">226 IM Used - RFC <a class="header-anchor" href="#_226-im-used-rfc" aria-label="Permalink to &quot;226 IM Used - RFC&quot;">​</a></h3><p>对实体请求的一个或多个实体操作的结果表示。</p><h2 id="_3xx" tabindex="-1">3xx <a class="header-anchor" href="#_3xx" aria-label="Permalink to &quot;3xx&quot;">​</a></h2><p>重定向类型，<code>需要客户端进一步的操作才能完成请求</code>，重定向目标在本次响应的 Location 域中指明。</p><h3 id="_300-multiple-choices" tabindex="-1">300 Multiple Choices <a class="header-anchor" href="#_300-multiple-choices" aria-label="Permalink to &quot;300 Multiple Choices&quot;">​</a></h3><p>被请求的资源有一系列可供选择的回馈信息，用户或浏览器自行选择一个首选的地址进行重定向。</p><h3 id="_301-moved-permanently" tabindex="-1">301 Moved Permanently <a class="header-anchor" href="#_301-moved-permanently" aria-label="Permalink to &quot;301 Moved Permanently&quot;">​</a></h3><p>被请求的资源已永久移动到新位置，并且将来对此资源的引用都应该使用本响应应返回的若干个 URI 之一。</p><h3 id="_302-found-moved-temporarily" tabindex="-1">302 Found - Moved Temporarily <a class="header-anchor" href="#_302-found-moved-temporarily" aria-label="Permalink to &quot;302 Found - Moved Temporarily&quot;">​</a></h3><p>要求客户端执行临时重定向</p><h3 id="_303-see-other" tabindex="-1">303 See Other <a class="header-anchor" href="#_303-see-other" aria-label="Permalink to &quot;303 See Other&quot;">​</a></h3><p>对应当前请求的响应可以在另一个 URI 上被找到，当响应于 POST（或 PUT/DELETE）接收到响应时，客户端应该假定服务器已经收到数据，并且应该使用单独的 GET 消息发出重定向。</p><h3 id="_304-not-modified" tabindex="-1">304 Not Modified <a class="header-anchor" href="#_304-not-modified" aria-label="Permalink to &quot;304 Not Modified&quot;">​</a></h3><p>资源在有请求头的 If-Modified-Since 或 If-None-Match 参数指定的这一版之后，未曾被修改。（资源不需要重新传输资源）</p><h3 id="_305-use-proxy" tabindex="-1">305 Use Proxy <a class="header-anchor" href="#_305-use-proxy" aria-label="Permalink to &quot;305 Use Proxy&quot;">​</a></h3><p>被请求的资源必须通过指定的代理才能被访问。</p><h3 id="_306-switch-proxy" tabindex="-1">306 Switch Proxy <a class="header-anchor" href="#_306-switch-proxy" aria-label="Permalink to &quot;306 Switch Proxy&quot;">​</a></h3><p>后续请求应使用指定的代理。</p><h3 id="_307-temporary-redirect" tabindex="-1">307 Temporary Redirect <a class="header-anchor" href="#_307-temporary-redirect" aria-label="Permalink to &quot;307 Temporary Redirect&quot;">​</a></h3><p>请求应该与另一个 URI 重复，单后续的请求应仍使用原始的 URI。</p><h3 id="_308-permanent-redirect-rfc" tabindex="-1">308 Permanent Redirect - RFC <a class="header-anchor" href="#_308-permanent-redirect-rfc" aria-label="Permalink to &quot;308 Permanent Redirect - RFC&quot;">​</a></h3><p>请求和所有将来的请求应该使用另一个 URI 重复。</p><h2 id="_4xx" tabindex="-1">4xx <a class="header-anchor" href="#_4xx" aria-label="Permalink to &quot;4xx&quot;">​</a></h2><p>客户端错误</p><h3 id="_400-bad-request" tabindex="-1">400 Bad Request <a class="header-anchor" href="#_400-bad-request" aria-label="Permalink to &quot;400 Bad Request&quot;">​</a></h3><p>格式错误的请求语法，无效的请求消息或欺骗性路由请求，服务器不能或不会处理该请求</p><h3 id="_401-unauthorized-rfc" tabindex="-1">401 Unauthorized - RFC <a class="header-anchor" href="#_401-unauthorized-rfc" aria-label="Permalink to &quot;401 Unauthorized - RFC&quot;">​</a></h3><p>未认证，用户没有必要的凭据（特定地址被拒绝访问网站）</p><h3 id="_402-payment-required" tabindex="-1">402 Payment Required <a class="header-anchor" href="#_402-payment-required" aria-label="Permalink to &quot;402 Payment Required&quot;">​</a></h3><p>将来的可能的需求而预留（在线支付、请求限制）</p><h3 id="_403-forbidden" tabindex="-1">403 Forbidden <a class="header-anchor" href="#_403-forbidden" aria-label="Permalink to &quot;403 Forbidden&quot;">​</a></h3><p>服务器已经理解请求，但是拒绝执行。身份验证并不能提供任何帮助，请求不应该被重复提交。</p><h3 id="_404-not-found" tabindex="-1">404 Not Found <a class="header-anchor" href="#_404-not-found" aria-label="Permalink to &quot;404 Not Found&quot;">​</a></h3><p>请求失败，请求所希望得到的资源未被在服务器上发现，但允许用户的后续请求。</p><h3 id="_405-method-not-allowed" tabindex="-1">405 Method Not Allowed <a class="header-anchor" href="#_405-method-not-allowed" aria-label="Permalink to &quot;405 Method Not Allowed&quot;">​</a></h3><p>请求行中指定的请求方法不能被用于请求相应的资源。</p><h3 id="_406-not-acceptable" tabindex="-1">406 Not Acceptable <a class="header-anchor" href="#_406-not-acceptable" aria-label="Permalink to &quot;406 Not Acceptable&quot;">​</a></h3><p>请求的资源的内容特性无法满足请求头中的条件，因此无法生成相应实体，该请求不可接受。</p><h3 id="_407-proxy-authentication-required-rfc" tabindex="-1">407 Proxy Authentication Required - RFC <a class="header-anchor" href="#_407-proxy-authentication-required-rfc" aria-label="Permalink to &quot;407 Proxy Authentication Required - RFC&quot;">​</a></h3><p>客户端必须在代理服务器上进行身份验证</p><h3 id="_408-request-timeout" tabindex="-1">408 Request Timeout <a class="header-anchor" href="#_408-request-timeout" aria-label="Permalink to &quot;408 Request Timeout&quot;">​</a></h3><p>请求超时</p><h3 id="_415-unsupported-media-type" tabindex="-1">415 Unsupported Media Type <a class="header-anchor" href="#_415-unsupported-media-type" aria-label="Permalink to &quot;415 Unsupported Media Type&quot;">​</a></h3><p>对于当前请求的方法和所请求的资源（请求中提交的媒体类型不支持）</p><h2 id="_5xx" tabindex="-1">5xx <a class="header-anchor" href="#_5xx" aria-label="Permalink to &quot;5xx&quot;">​</a></h2><p><code>服务器错误</code>，表示服务器无法完成明显有效的请求</p><h3 id="_500-internal-server-error" tabindex="-1">500 Internal Server Error <a class="header-anchor" href="#_500-internal-server-error" aria-label="Permalink to &quot;500 Internal Server Error&quot;">​</a></h3><p>服务器出现问题，无法完成对请求的处理。</p><h3 id="_501-not-implemented" tabindex="-1">501 Not Implemented <a class="header-anchor" href="#_501-not-implemented" aria-label="Permalink to &quot;501 Not Implemented&quot;">​</a></h3><p>服务器不支持当前请求所需要的某个功能。当服务器无法识别请求的方法，并且无法支持其对任何资源的请求。</p><h3 id="_502-bad-gateway" tabindex="-1">502 Bad Gateway <a class="header-anchor" href="#_502-bad-gateway" aria-label="Permalink to &quot;502 Bad Gateway&quot;">​</a></h3><p>作为网关或者代理工作的服务器尝试执行请求时，从上游服务器接收到无效的响应。</p><h3 id="_503-service-unavailable" tabindex="-1">503 Service Unavailable <a class="header-anchor" href="#_503-service-unavailable" aria-label="Permalink to &quot;503 Service Unavailable&quot;">​</a></h3><p>暂时性的，服务器维护或者过载，服务器当前无法处理请求。</p><h3 id="_504-gateway-timeout" tabindex="-1">504 Gateway Timeout <a class="header-anchor" href="#_504-gateway-timeout" aria-label="Permalink to &quot;504 Gateway Timeout&quot;">​</a></h3><p>作为网关或者代理工作的服务器尝试执行请求时，未能及时从上游服务器收到响应。</p><h3 id="_511-network-authentication-required" tabindex="-1">511 Network Authentication Required <a class="header-anchor" href="#_511-network-authentication-required" aria-label="Permalink to &quot;511 Network Authentication Required&quot;">​</a></h3><p>客户端需要进行身份验证才能获得网络访问权限，旨在限制用户群访问特定网络（WiFi 热点）</p>',91),n=[i];function h(d,l,c,s,u,p){return a(),t("div",null,n)}const m=e(o,[["render",h]]);export{b as __pageData,m as default};
+import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"HTTP 状态码","description":"","frontmatter":{},"headers":[],"relativePath":"network/status_code.md","filePath":"network/status_code.md","lastUpdated":1670330848000}'),o={name:"network/status_code.md"},i=r('<h1 id="http-状态码" tabindex="-1">HTTP 状态码 <a class="header-anchor" href="#http-状态码" aria-label="Permalink to &quot;HTTP 状态码&quot;">​</a></h1><p>五类状态码，状态码的第一个数字代表了响应的五种状态之一。</p><p><a href="https://en.wikipedia.org/wiki/List_of_HTTP_status_codes" target="_blank" rel="noreferrer">Wiki - http status code</a></p><h2 id="_1xx" tabindex="-1">1xx <a class="header-anchor" href="#_1xx" aria-label="Permalink to &quot;1xx&quot;">​</a></h2><p>消息类型，<code>请求已被接受，需要继续等待服务器处理</code>，临时响应，以空行结束，HTTP1.0 协议中没有定义任何 1xx 状态码。</p><h3 id="_100-continue" tabindex="-1">100 Continue <a class="header-anchor" href="#_100-continue" aria-label="Permalink to &quot;100 Continue&quot;">​</a></h3><p>服务器已经接收到请求头，并且客户端应继续发送请求体。</p><h3 id="_101-switching-protocols" tabindex="-1">101 Switching Protocols <a class="header-anchor" href="#_101-switching-protocols" aria-label="Permalink to &quot;101 Switching Protocols&quot;">​</a></h3><p>服务器已经理解客户端的请求，并将通过 Upgrade 消息头通知客户端采用不同的协议来完成这个请求。（Websocket）</p><h3 id="_102-processing-webdav-rfc" tabindex="-1">102 Processing （WebDav）- RFC <a class="header-anchor" href="#_102-processing-webdav-rfc" aria-label="Permalink to &quot;102 Processing （WebDav）- RFC&quot;">​</a></h3><p>WebDav 请求包含许多涉及文件操作的自请求，需要很长时间才能完成请求。服务器已经收到并正在处理请求，但无响应可用。</p><h3 id="_103-early-hints-rfc" tabindex="-1">103 Early Hints - RFC <a class="header-anchor" href="#_103-early-hints-rfc" aria-label="Permalink to &quot;103 Early Hints - RFC&quot;">​</a></h3><p>用来在最终的 HTTP 消息之前返回一些响应头。</p><h2 id="_2xx" tabindex="-1">2xx <a class="header-anchor" href="#_2xx" aria-label="Permalink to &quot;2xx&quot;">​</a></h2><p>成功类型，代表请求已成功被服务器接收、理解、并接受。</p><h3 id="_200-ok" tabindex="-1">200 OK <a class="header-anchor" href="#_200-ok" aria-label="Permalink to &quot;200 OK&quot;">​</a></h3><p>请求已成功，请求所希望的响应头或数据体将随此响应返回。</p><h3 id="_201-created" tabindex="-1">201 Created <a class="header-anchor" href="#_201-created" aria-label="Permalink to &quot;201 Created&quot;">​</a></h3><p>请求已经被实现，而且有一个新的资源已经依据请求的需要而创建，且其 URI 已经随 Location 头信息返回。</p><h3 id="_202-accepted" tabindex="-1">202 Accepted <a class="header-anchor" href="#_202-accepted" aria-label="Permalink to &quot;202 Accepted&quot;">​</a></h3><p>服务器已经接受请求，单尚未处理。最终可能不会被执行，并且可能在处理发生时被禁止。</p><h3 id="_203-non-authroritative-information-http-1-1" tabindex="-1">203 Non-Authroritative Information HTTP/1.1 <a class="header-anchor" href="#_203-non-authroritative-information-http-1-1" aria-label="Permalink to &quot;203 Non-Authroritative Information HTTP/1.1&quot;">​</a></h3><p>服务器是一个转换代理服务器（网络加速器）</p><h3 id="_204-no-content" tabindex="-1">204 No Content <a class="header-anchor" href="#_204-no-content" aria-label="Permalink to &quot;204 No Content&quot;">​</a></h3><p>服务器成功处理了请求，没有返回任何内容。（Wi-Fi 接入，无需验证返回 204，需验证弹出网页浏览器界面）</p><h3 id="_205-reset-content" tabindex="-1">205 Reset Content <a class="header-anchor" href="#_205-reset-content" aria-label="Permalink to &quot;205 Reset Content&quot;">​</a></h3><p>与 204 不同的是，205 要求请求者重置文档视图。</p><h3 id="_206-partial-content-rfc" tabindex="-1">206 Partial Content - RFC <a class="header-anchor" href="#_206-partial-content-rfc" aria-label="Permalink to &quot;206 Partial Content - RFC&quot;">​</a></h3><p>服务器已经成功处理了部分 GET 请求（断点续传）</p><h3 id="_207-multi-status-rfc" tabindex="-1">207 Multi-Status - RFC <a class="header-anchor" href="#_207-multi-status-rfc" aria-label="Permalink to &quot;207 Multi-Status - RFC&quot;">​</a></h3><p>XML 消息</p><h3 id="_208-already-reported-rfc" tabindex="-1">208 Already Reported - RFC <a class="header-anchor" href="#_208-already-reported-rfc" aria-label="Permalink to &quot;208 Already Reported - RFC&quot;">​</a></h3><p>多状态</p><h3 id="_226-im-used-rfc" tabindex="-1">226 IM Used - RFC <a class="header-anchor" href="#_226-im-used-rfc" aria-label="Permalink to &quot;226 IM Used - RFC&quot;">​</a></h3><p>对实体请求的一个或多个实体操作的结果表示。</p><h2 id="_3xx" tabindex="-1">3xx <a class="header-anchor" href="#_3xx" aria-label="Permalink to &quot;3xx&quot;">​</a></h2><p>重定向类型，<code>需要客户端进一步的操作才能完成请求</code>，重定向目标在本次响应的 Location 域中指明。</p><h3 id="_300-multiple-choices" tabindex="-1">300 Multiple Choices <a class="header-anchor" href="#_300-multiple-choices" aria-label="Permalink to &quot;300 Multiple Choices&quot;">​</a></h3><p>被请求的资源有一系列可供选择的回馈信息，用户或浏览器自行选择一个首选的地址进行重定向。</p><h3 id="_301-moved-permanently" tabindex="-1">301 Moved Permanently <a class="header-anchor" href="#_301-moved-permanently" aria-label="Permalink to &quot;301 Moved Permanently&quot;">​</a></h3><p>被请求的资源已永久移动到新位置，并且将来对此资源的引用都应该使用本响应应返回的若干个 URI 之一。</p><h3 id="_302-found-moved-temporarily" tabindex="-1">302 Found - Moved Temporarily <a class="header-anchor" href="#_302-found-moved-temporarily" aria-label="Permalink to &quot;302 Found - Moved Temporarily&quot;">​</a></h3><p>要求客户端执行临时重定向</p><h3 id="_303-see-other" tabindex="-1">303 See Other <a class="header-anchor" href="#_303-see-other" aria-label="Permalink to &quot;303 See Other&quot;">​</a></h3><p>对应当前请求的响应可以在另一个 URI 上被找到，当响应于 POST（或 PUT/DELETE）接收到响应时，客户端应该假定服务器已经收到数据，并且应该使用单独的 GET 消息发出重定向。</p><h3 id="_304-not-modified" tabindex="-1">304 Not Modified <a class="header-anchor" href="#_304-not-modified" aria-label="Permalink to &quot;304 Not Modified&quot;">​</a></h3><p>资源在有请求头的 If-Modified-Since 或 If-None-Match 参数指定的这一版之后，未曾被修改。（资源不需要重新传输资源）</p><h3 id="_305-use-proxy" tabindex="-1">305 Use Proxy <a class="header-anchor" href="#_305-use-proxy" aria-label="Permalink to &quot;305 Use Proxy&quot;">​</a></h3><p>被请求的资源必须通过指定的代理才能被访问。</p><h3 id="_306-switch-proxy" tabindex="-1">306 Switch Proxy <a class="header-anchor" href="#_306-switch-proxy" aria-label="Permalink to &quot;306 Switch Proxy&quot;">​</a></h3><p>后续请求应使用指定的代理。</p><h3 id="_307-temporary-redirect" tabindex="-1">307 Temporary Redirect <a class="header-anchor" href="#_307-temporary-redirect" aria-label="Permalink to &quot;307 Temporary Redirect&quot;">​</a></h3><p>请求应该与另一个 URI 重复，单后续的请求应仍使用原始的 URI。</p><h3 id="_308-permanent-redirect-rfc" tabindex="-1">308 Permanent Redirect - RFC <a class="header-anchor" href="#_308-permanent-redirect-rfc" aria-label="Permalink to &quot;308 Permanent Redirect - RFC&quot;">​</a></h3><p>请求和所有将来的请求应该使用另一个 URI 重复。</p><h2 id="_4xx" tabindex="-1">4xx <a class="header-anchor" href="#_4xx" aria-label="Permalink to &quot;4xx&quot;">​</a></h2><p>客户端错误</p><h3 id="_400-bad-request" tabindex="-1">400 Bad Request <a class="header-anchor" href="#_400-bad-request" aria-label="Permalink to &quot;400 Bad Request&quot;">​</a></h3><p>格式错误的请求语法，无效的请求消息或欺骗性路由请求，服务器不能或不会处理该请求</p><h3 id="_401-unauthorized-rfc" tabindex="-1">401 Unauthorized - RFC <a class="header-anchor" href="#_401-unauthorized-rfc" aria-label="Permalink to &quot;401 Unauthorized - RFC&quot;">​</a></h3><p>未认证，用户没有必要的凭据（特定地址被拒绝访问网站）</p><h3 id="_402-payment-required" tabindex="-1">402 Payment Required <a class="header-anchor" href="#_402-payment-required" aria-label="Permalink to &quot;402 Payment Required&quot;">​</a></h3><p>将来的可能的需求而预留（在线支付、请求限制）</p><h3 id="_403-forbidden" tabindex="-1">403 Forbidden <a class="header-anchor" href="#_403-forbidden" aria-label="Permalink to &quot;403 Forbidden&quot;">​</a></h3><p>服务器已经理解请求，但是拒绝执行。身份验证并不能提供任何帮助，请求不应该被重复提交。</p><h3 id="_404-not-found" tabindex="-1">404 Not Found <a class="header-anchor" href="#_404-not-found" aria-label="Permalink to &quot;404 Not Found&quot;">​</a></h3><p>请求失败，请求所希望得到的资源未被在服务器上发现，但允许用户的后续请求。</p><h3 id="_405-method-not-allowed" tabindex="-1">405 Method Not Allowed <a class="header-anchor" href="#_405-method-not-allowed" aria-label="Permalink to &quot;405 Method Not Allowed&quot;">​</a></h3><p>请求行中指定的请求方法不能被用于请求相应的资源。</p><h3 id="_406-not-acceptable" tabindex="-1">406 Not Acceptable <a class="header-anchor" href="#_406-not-acceptable" aria-label="Permalink to &quot;406 Not Acceptable&quot;">​</a></h3><p>请求的资源的内容特性无法满足请求头中的条件，因此无法生成相应实体，该请求不可接受。</p><h3 id="_407-proxy-authentication-required-rfc" tabindex="-1">407 Proxy Authentication Required - RFC <a class="header-anchor" href="#_407-proxy-authentication-required-rfc" aria-label="Permalink to &quot;407 Proxy Authentication Required - RFC&quot;">​</a></h3><p>客户端必须在代理服务器上进行身份验证</p><h3 id="_408-request-timeout" tabindex="-1">408 Request Timeout <a class="header-anchor" href="#_408-request-timeout" aria-label="Permalink to &quot;408 Request Timeout&quot;">​</a></h3><p>请求超时</p><h3 id="_415-unsupported-media-type" tabindex="-1">415 Unsupported Media Type <a class="header-anchor" href="#_415-unsupported-media-type" aria-label="Permalink to &quot;415 Unsupported Media Type&quot;">​</a></h3><p>对于当前请求的方法和所请求的资源（请求中提交的媒体类型不支持）</p><h2 id="_5xx" tabindex="-1">5xx <a class="header-anchor" href="#_5xx" aria-label="Permalink to &quot;5xx&quot;">​</a></h2><p><code>服务器错误</code>，表示服务器无法完成明显有效的请求</p><h3 id="_500-internal-server-error" tabindex="-1">500 Internal Server Error <a class="header-anchor" href="#_500-internal-server-error" aria-label="Permalink to &quot;500 Internal Server Error&quot;">​</a></h3><p>服务器出现问题，无法完成对请求的处理。</p><h3 id="_501-not-implemented" tabindex="-1">501 Not Implemented <a class="header-anchor" href="#_501-not-implemented" aria-label="Permalink to &quot;501 Not Implemented&quot;">​</a></h3><p>服务器不支持当前请求所需要的某个功能。当服务器无法识别请求的方法，并且无法支持其对任何资源的请求。</p><h3 id="_502-bad-gateway" tabindex="-1">502 Bad Gateway <a class="header-anchor" href="#_502-bad-gateway" aria-label="Permalink to &quot;502 Bad Gateway&quot;">​</a></h3><p>作为网关或者代理工作的服务器尝试执行请求时，从上游服务器接收到无效的响应。</p><h3 id="_503-service-unavailable" tabindex="-1">503 Service Unavailable <a class="header-anchor" href="#_503-service-unavailable" aria-label="Permalink to &quot;503 Service Unavailable&quot;">​</a></h3><p>暂时性的，服务器维护或者过载，服务器当前无法处理请求。</p><h3 id="_504-gateway-timeout" tabindex="-1">504 Gateway Timeout <a class="header-anchor" href="#_504-gateway-timeout" aria-label="Permalink to &quot;504 Gateway Timeout&quot;">​</a></h3><p>作为网关或者代理工作的服务器尝试执行请求时，未能及时从上游服务器收到响应。</p><h3 id="_511-network-authentication-required" tabindex="-1">511 Network Authentication Required <a class="header-anchor" href="#_511-network-authentication-required" aria-label="Permalink to &quot;511 Network Authentication Required&quot;">​</a></h3><p>客户端需要进行身份验证才能获得网络访问权限，旨在限制用户群访问特定网络（WiFi 热点）</p>',91),n=[i];function h(d,l,c,s,u,p){return a(),t("div",null,n)}const m=e(o,[["render",h]]);export{b as __pageData,m as default};
diff --git a/assets/network_status_code.md.3f54f40a.lean.js b/assets/network_status_code.md.b6f517ca.lean.js
similarity index 70%
rename from assets/network_status_code.md.3f54f40a.lean.js
rename to assets/network_status_code.md.b6f517ca.lean.js
index 2291e6f..16d150e 100644
--- a/assets/network_status_code.md.3f54f40a.lean.js
+++ b/assets/network_status_code.md.b6f517ca.lean.js
@@ -1 +1 @@
-import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"HTTP 状态码","description":"","frontmatter":{},"headers":[],"relativePath":"network/status_code.md","filePath":"network/status_code.md","lastUpdated":1670330848000}'),o={name:"network/status_code.md"},i=r("",91),n=[i];function h(d,l,c,s,u,p){return a(),t("div",null,n)}const m=e(o,[["render",h]]);export{b as __pageData,m as default};
+import{_ as e,o as a,c as t,Q as r}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"HTTP 状态码","description":"","frontmatter":{},"headers":[],"relativePath":"network/status_code.md","filePath":"network/status_code.md","lastUpdated":1670330848000}'),o={name:"network/status_code.md"},i=r("",91),n=[i];function h(d,l,c,s,u,p){return a(),t("div",null,n)}const m=e(o,[["render",h]]);export{b as __pageData,m as default};
diff --git a/assets/network_subnet_mask.md.9eb6788c.js b/assets/network_subnet_mask.md.7a58406b.js
similarity index 97%
rename from assets/network_subnet_mask.md.9eb6788c.js
rename to assets/network_subnet_mask.md.7a58406b.js
index b1d27e0..7296aa3 100644
--- a/assets/network_subnet_mask.md.9eb6788c.js
+++ b/assets/network_subnet_mask.md.7a58406b.js
@@ -1,4 +1,4 @@
-import{_ as a,o as t,c as e,Q as s}from"./chunks/framework.7c0fadea.js";const P=JSON.parse('{"title":"子网掩码","description":"","frontmatter":{},"headers":[],"relativePath":"network/subnet_mask.md","filePath":"network/subnet_mask.md","lastUpdated":1670330848000}'),l={name:"network/subnet_mask.md"},n=s(`<h1 id="子网掩码" tabindex="-1">子网掩码 <a class="header-anchor" href="#子网掩码" aria-label="Permalink to &quot;子网掩码&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">定义</p><p><code>子网掩码</code>(subnet mask)又叫网络掩码、地址掩码、子网络遮罩。指明一个 IP 地址的哪些位标识的是主机所在的子网以及哪些位标识的是主机的位掩码。不能单独存在，结合 IP 地址使用，将 IP 地址划分成网络地址和主机地址。</p></div><h2 id="背景" tabindex="-1">背景 <a class="header-anchor" href="#背景" aria-label="Permalink to &quot;背景&quot;">​</a></h2><p>IPV4 地址资源紧缺，解决 IP 地址分配而产生的虚拟 IP 技术，通过子网掩码将 A、B、C 三类地址划分为若干子网，提高 IP 地址的分配效率。</p><h2 id="功能" tabindex="-1">功能 <a class="header-anchor" href="#功能" aria-label="Permalink to &quot;功能&quot;">​</a></h2><p>32 位地址</p><ul><li>用于屏蔽 IP 地址的一部分以区别网络标识和主机标识，该 IP 地址是在局域网上还是在远程网（广域网）</li><li>将一个大的 IP 网络划分为若干个小的子网络</li></ul><h3 id="声明网络地址与主机地址" tabindex="-1">声明网络地址与主机地址 <a class="header-anchor" href="#声明网络地址与主机地址" aria-label="Permalink to &quot;声明网络地址与主机地址&quot;">​</a></h3><table><thead><tr><th>类别</th><th>子网掩码的二进制数值</th><th>子网掩码的十进制数值</th></tr></thead><tbody><tr><td>A</td><td>11111111 00000000 00000000 00000000</td><td>255.0.0.0</td></tr><tr><td>B</td><td>11111111 11111111 00000000 00000000</td><td>255.255.0.0</td></tr><tr><td>C</td><td>11111111 11111111 11111111 00000000</td><td>255.255.255.0</td></tr></tbody></table><ul><li>将子网掩码二进制和 IP 地址二进制进行逻辑与（AND）运算，得到的是主机地址</li></ul><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">IP 地址 192.168.10.11 AND 255.255.255.0 ==== 192.168.10.0</span></span>
+import{_ as a,o as t,c as e,Q as s}from"./chunks/framework.0e8ae64e.js";const P=JSON.parse('{"title":"子网掩码","description":"","frontmatter":{},"headers":[],"relativePath":"network/subnet_mask.md","filePath":"network/subnet_mask.md","lastUpdated":1670330848000}'),l={name:"network/subnet_mask.md"},n=s(`<h1 id="子网掩码" tabindex="-1">子网掩码 <a class="header-anchor" href="#子网掩码" aria-label="Permalink to &quot;子网掩码&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">定义</p><p><code>子网掩码</code>(subnet mask)又叫网络掩码、地址掩码、子网络遮罩。指明一个 IP 地址的哪些位标识的是主机所在的子网以及哪些位标识的是主机的位掩码。不能单独存在，结合 IP 地址使用，将 IP 地址划分成网络地址和主机地址。</p></div><h2 id="背景" tabindex="-1">背景 <a class="header-anchor" href="#背景" aria-label="Permalink to &quot;背景&quot;">​</a></h2><p>IPV4 地址资源紧缺，解决 IP 地址分配而产生的虚拟 IP 技术，通过子网掩码将 A、B、C 三类地址划分为若干子网，提高 IP 地址的分配效率。</p><h2 id="功能" tabindex="-1">功能 <a class="header-anchor" href="#功能" aria-label="Permalink to &quot;功能&quot;">​</a></h2><p>32 位地址</p><ul><li>用于屏蔽 IP 地址的一部分以区别网络标识和主机标识，该 IP 地址是在局域网上还是在远程网（广域网）</li><li>将一个大的 IP 网络划分为若干个小的子网络</li></ul><h3 id="声明网络地址与主机地址" tabindex="-1">声明网络地址与主机地址 <a class="header-anchor" href="#声明网络地址与主机地址" aria-label="Permalink to &quot;声明网络地址与主机地址&quot;">​</a></h3><table><thead><tr><th>类别</th><th>子网掩码的二进制数值</th><th>子网掩码的十进制数值</th></tr></thead><tbody><tr><td>A</td><td>11111111 00000000 00000000 00000000</td><td>255.0.0.0</td></tr><tr><td>B</td><td>11111111 11111111 00000000 00000000</td><td>255.255.0.0</td></tr><tr><td>C</td><td>11111111 11111111 11111111 00000000</td><td>255.255.255.0</td></tr></tbody></table><ul><li>将子网掩码二进制和 IP 地址二进制进行逻辑与（AND）运算，得到的是主机地址</li></ul><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">IP 地址 192.168.10.11 AND 255.255.255.0 ==== 192.168.10.0</span></span>
 <span class="line"><span style="color:#e1e4e8;"></span></span>
 <span class="line"><span style="color:#e1e4e8;">说明：该IP地址属于192.168.10.0这个网络，其主机号为11（网络中编号为11的主机）</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">IP 地址 192.168.10.11 AND 255.255.255.0 ==== 192.168.10.0</span></span>
 <span class="line"><span style="color:#24292e;"></span></span>
diff --git a/assets/network_subnet_mask.md.9eb6788c.lean.js b/assets/network_subnet_mask.md.7a58406b.lean.js
similarity index 70%
rename from assets/network_subnet_mask.md.9eb6788c.lean.js
rename to assets/network_subnet_mask.md.7a58406b.lean.js
index 0058047..65e34eb 100644
--- a/assets/network_subnet_mask.md.9eb6788c.lean.js
+++ b/assets/network_subnet_mask.md.7a58406b.lean.js
@@ -1 +1 @@
-import{_ as a,o as t,c as e,Q as s}from"./chunks/framework.7c0fadea.js";const P=JSON.parse('{"title":"子网掩码","description":"","frontmatter":{},"headers":[],"relativePath":"network/subnet_mask.md","filePath":"network/subnet_mask.md","lastUpdated":1670330848000}'),l={name:"network/subnet_mask.md"},n=s("",19),o=[n];function r(d,i,c,p,h,u){return t(),e("div",null,o)}const _=a(l,[["render",r]]);export{P as __pageData,_ as default};
+import{_ as a,o as t,c as e,Q as s}from"./chunks/framework.0e8ae64e.js";const P=JSON.parse('{"title":"子网掩码","description":"","frontmatter":{},"headers":[],"relativePath":"network/subnet_mask.md","filePath":"network/subnet_mask.md","lastUpdated":1670330848000}'),l={name:"network/subnet_mask.md"},n=s("",19),o=[n];function r(d,i,c,p,h,u){return t(),e("div",null,o)}const _=a(l,[["render",r]]);export{P as __pageData,_ as default};
diff --git a/assets/network_tls_ssl.md.1b14e38d.js b/assets/network_tls_ssl.md.e0605f70.js
similarity index 98%
rename from assets/network_tls_ssl.md.1b14e38d.js
rename to assets/network_tls_ssl.md.e0605f70.js
index 4c313ba..3ce4311 100644
--- a/assets/network_tls_ssl.md.1b14e38d.js
+++ b/assets/network_tls_ssl.md.e0605f70.js
@@ -1 +1 @@
-import{_ as a,o as e,c as l,Q as o}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"HTTPS 加密层","description":"","frontmatter":{},"headers":[],"relativePath":"network/tls_ssl.md","filePath":"network/tls_ssl.md","lastUpdated":1670330848000}'),i={name:"network/tls_ssl.md"},t=o('<h1 id="https-加密层" tabindex="-1">HTTPS 加密层 <a class="header-anchor" href="#https-加密层" aria-label="Permalink to &quot;HTTPS 加密层&quot;">​</a></h1><p><a href="https://time.geekbang.org/column/article/156181" target="_blank" rel="noreferrer">参考链接</a></p><p>HTTP - TLS/SSL - TCP - IP - 数据链路层</p><p><code>HTTP 数据传输加密过程</code></p><blockquote><p>加密套件列表</p></blockquote><p>浏览器支持的加密方式有多少种</p><h2 id="对称加密" tabindex="-1">对称加密 <a class="header-anchor" href="#对称加密" aria-label="Permalink to &quot;对称加密&quot;">​</a></h2><ol><li>浏览器发送对称加密套件列表和 client-random 随机数</li><li>服务器收到加密套件列表，选择加密方式和 service-random 随机数，返回给浏览器</li><li>浏览器和服务器返回确认信息</li></ol><h3 id="计算密钥" tabindex="-1">计算密钥 <a class="header-anchor" href="#计算密钥" aria-label="Permalink to &quot;计算密钥&quot;">​</a></h3><blockquote><p>密钥都能用来解密</p></blockquote><ol><li>浏览器和服务器都有 client-random 和 service-random</li><li>浏览器和服务器使用相同的方法对 client-random 和 service-random 混合起来生成密钥 master-secret</li><li>使用 master-secret 加密传输数据</li></ol><h3 id="缺陷" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><blockquote><p>client-random 和 service-random 都是明文的，拿到随机数和加密方式，以及利用随机数的生成密钥的算法都是公开的，也可以生成密钥来解析数据</p></blockquote><h2 id="非对称加密" tabindex="-1">非对称加密 <a class="header-anchor" href="#非对称加密" aria-label="Permalink to &quot;非对称加密&quot;">​</a></h2><blockquote><p>非对称，公钥只有私钥能解密，私钥只有公钥能解密</p></blockquote><ol><li>浏览器发送非对称加密套件列表</li><li>服务收到非对称加密套件列表，返回加密方式和公钥</li><li>浏览器和服务器返回确认信息</li></ol><h3 id="加密数据" tabindex="-1">加密数据 <a class="header-anchor" href="#加密数据" aria-label="Permalink to &quot;加密数据&quot;">​</a></h3><ol><li>浏览器使用公钥加密数据</li><li>私钥只有服务器存在，利用私钥解密数据</li></ol><h3 id="缺陷-1" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷-1" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><ol><li>非对称加密算法效率太慢，影响数据传输速率</li><li>无法保证服务器发送给浏览器的数据安全（公钥是可以被拦截获取的）</li></ol><h2 id="对称加密-非对称加密" tabindex="-1">对称加密 + 非对称加密 <a class="header-anchor" href="#对称加密-非对称加密" aria-label="Permalink to &quot;对称加密 + 非对称加密&quot;">​</a></h2><blockquote><p>HTTPS 采用混合加密方式进行数据的加密</p></blockquote><ol><li>浏览器发送加密套件列表、非对称加密套件列表以及 client-random 随机数</li><li>服务器收到消息，选择加密方式以及生成公钥和 service-random 随机数</li><li>浏览器保存公钥，并生成随机数 pre-master</li><li>使用公钥加密 pre-master 发送给服务器确认 master-secret</li><li>服务器浏览器确认返回信息</li></ol><h3 id="加密数据-1" tabindex="-1">加密数据 <a class="header-anchor" href="#加密数据-1" aria-label="Permalink to &quot;加密数据&quot;">​</a></h3><ol><li>浏览器和服务器都拥有 client-random、service-random 以及 pre-master 三组随机数</li><li>使用三组随机数生成对称密钥，就可以使用对称加密方式传输数据</li></ol><h3 id="安全性" tabindex="-1">安全性 <a class="header-anchor" href="#安全性" aria-label="Permalink to &quot;安全性&quot;">​</a></h3><blockquote><p>获取到 pre-master 随机数，但是是经过公钥加密过的，只有私钥才能解密</p></blockquote><h2 id="ca-证书" tabindex="-1">CA 证书 <a class="header-anchor" href="#ca-证书" aria-label="Permalink to &quot;CA 证书&quot;">​</a></h2><blockquote><p>有了混合加密方式的传输数据仍然不是安全的（DNS 劫持替换 IP 地址）</p></blockquote><h3 id="加密方式" tabindex="-1">加密方式 <a class="header-anchor" href="#加密方式" aria-label="Permalink to &quot;加密方式&quot;">​</a></h3><ol><li>浏览器发送加密套件列表、非对称加密套件列表以及 client-random 随机数</li><li>服务器收到消息，选择加密方式以及返回<code>数字证书</code>和 service-random 随机数</li><li>浏览器获取数字证书中的公钥，并生成随机数 pre-master</li><li>使用公钥加密 pre-master 发送给服务器确认 master-secret</li><li>服务器浏览器确认返回信息</li></ol><h3 id="申请数字证书" tabindex="-1">申请数字证书 <a class="header-anchor" href="#申请数字证书" aria-label="Permalink to &quot;申请数字证书&quot;">​</a></h3><ol><li>准备一套公钥和私钥，私钥留着自己使用</li><li>向 CA 机构提交公钥以及相关信息（收费）</li><li>CA 机构验证信息是否合理合法</li><li>信息审核通过，签发数字证书（公钥、组织信息、CA 的信息、有效时间、证书序列号等明文信息）以及一个 CA 生成的签名</li></ol><h3 id="ca-数字签名" tabindex="-1">CA 数字签名 <a class="header-anchor" href="#ca-数字签名" aria-label="Permalink to &quot;CA 数字签名&quot;">​</a></h3><ol><li>CA 使用 Hash 函数算法计算明文信息，并得出信息摘要</li><li>CA 使用其自有的私钥对信息摘要进行加密，加密后的密文就是数字签名</li></ol><h3 id="验证数字证书" tabindex="-1">验证数字证书 <a class="header-anchor" href="#验证数字证书" aria-label="Permalink to &quot;验证数字证书&quot;">​</a></h3><ol><li>浏览器使用相同的 Hash 算法函数计算明文信息，得到信息摘要 A</li><li>再使用公钥对数字签名解密，得到信息摘要 B</li><li>信息摘要 A === 信息摘要 B</li></ol><blockquote><p>CA 是机构，会沿着 CA 机构链查找，直到根证书机构为止（否则视为不合法）</p></blockquote><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><ol><li>申请数字证书是不需要提供私钥的，私钥永远只能存在于服务器上</li><li>数字证书最核心的内容就是使用其自有的私钥生成的数字签名</li><li>内置 CA 对应的证书称为根证书，最权威的机构（自签名证书）</li></ol><h2 id="数字证书拓展" tabindex="-1">数字证书拓展 <a class="header-anchor" href="#数字证书拓展" aria-label="Permalink to &quot;数字证书拓展&quot;">​</a></h2><p>数字证书</p><blockquote><p>个人申请的证书属于 DV 类型；普通公司申请的证书属于 OV 类型；金融机构、银行、电商平台申请的证书属于 EV 类型（DV 自动验证，OV 和 EV 需要人工验证）</p></blockquote><blockquote><p>CA 机构的权威性，数字证书链，中间 CA(Intermediates CAs)和根 CA(Root CAs)</p></blockquote><blockquote><p>操作系统内置根证书，WebTrust（网络信任） 认证是电子认证服务行业中唯一的国际性认证标准（认证的根 CA 目前有 Comodo，geotrust，rapidssl，symantec，thawte，digicert），只有在操作系统中能追溯到数字证书链才能验证证书合法</p></blockquote>',45),r=[t];function c(s,n,h,d,u,b){return e(),l("div",null,r)}const p=a(i,[["render",c]]);export{m as __pageData,p as default};
+import{_ as a,o as e,c as l,Q as o}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"HTTPS 加密层","description":"","frontmatter":{},"headers":[],"relativePath":"network/tls_ssl.md","filePath":"network/tls_ssl.md","lastUpdated":1670330848000}'),i={name:"network/tls_ssl.md"},t=o('<h1 id="https-加密层" tabindex="-1">HTTPS 加密层 <a class="header-anchor" href="#https-加密层" aria-label="Permalink to &quot;HTTPS 加密层&quot;">​</a></h1><p><a href="https://time.geekbang.org/column/article/156181" target="_blank" rel="noreferrer">参考链接</a></p><p>HTTP - TLS/SSL - TCP - IP - 数据链路层</p><p><code>HTTP 数据传输加密过程</code></p><blockquote><p>加密套件列表</p></blockquote><p>浏览器支持的加密方式有多少种</p><h2 id="对称加密" tabindex="-1">对称加密 <a class="header-anchor" href="#对称加密" aria-label="Permalink to &quot;对称加密&quot;">​</a></h2><ol><li>浏览器发送对称加密套件列表和 client-random 随机数</li><li>服务器收到加密套件列表，选择加密方式和 service-random 随机数，返回给浏览器</li><li>浏览器和服务器返回确认信息</li></ol><h3 id="计算密钥" tabindex="-1">计算密钥 <a class="header-anchor" href="#计算密钥" aria-label="Permalink to &quot;计算密钥&quot;">​</a></h3><blockquote><p>密钥都能用来解密</p></blockquote><ol><li>浏览器和服务器都有 client-random 和 service-random</li><li>浏览器和服务器使用相同的方法对 client-random 和 service-random 混合起来生成密钥 master-secret</li><li>使用 master-secret 加密传输数据</li></ol><h3 id="缺陷" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><blockquote><p>client-random 和 service-random 都是明文的，拿到随机数和加密方式，以及利用随机数的生成密钥的算法都是公开的，也可以生成密钥来解析数据</p></blockquote><h2 id="非对称加密" tabindex="-1">非对称加密 <a class="header-anchor" href="#非对称加密" aria-label="Permalink to &quot;非对称加密&quot;">​</a></h2><blockquote><p>非对称，公钥只有私钥能解密，私钥只有公钥能解密</p></blockquote><ol><li>浏览器发送非对称加密套件列表</li><li>服务收到非对称加密套件列表，返回加密方式和公钥</li><li>浏览器和服务器返回确认信息</li></ol><h3 id="加密数据" tabindex="-1">加密数据 <a class="header-anchor" href="#加密数据" aria-label="Permalink to &quot;加密数据&quot;">​</a></h3><ol><li>浏览器使用公钥加密数据</li><li>私钥只有服务器存在，利用私钥解密数据</li></ol><h3 id="缺陷-1" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷-1" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><ol><li>非对称加密算法效率太慢，影响数据传输速率</li><li>无法保证服务器发送给浏览器的数据安全（公钥是可以被拦截获取的）</li></ol><h2 id="对称加密-非对称加密" tabindex="-1">对称加密 + 非对称加密 <a class="header-anchor" href="#对称加密-非对称加密" aria-label="Permalink to &quot;对称加密 + 非对称加密&quot;">​</a></h2><blockquote><p>HTTPS 采用混合加密方式进行数据的加密</p></blockquote><ol><li>浏览器发送加密套件列表、非对称加密套件列表以及 client-random 随机数</li><li>服务器收到消息，选择加密方式以及生成公钥和 service-random 随机数</li><li>浏览器保存公钥，并生成随机数 pre-master</li><li>使用公钥加密 pre-master 发送给服务器确认 master-secret</li><li>服务器浏览器确认返回信息</li></ol><h3 id="加密数据-1" tabindex="-1">加密数据 <a class="header-anchor" href="#加密数据-1" aria-label="Permalink to &quot;加密数据&quot;">​</a></h3><ol><li>浏览器和服务器都拥有 client-random、service-random 以及 pre-master 三组随机数</li><li>使用三组随机数生成对称密钥，就可以使用对称加密方式传输数据</li></ol><h3 id="安全性" tabindex="-1">安全性 <a class="header-anchor" href="#安全性" aria-label="Permalink to &quot;安全性&quot;">​</a></h3><blockquote><p>获取到 pre-master 随机数，但是是经过公钥加密过的，只有私钥才能解密</p></blockquote><h2 id="ca-证书" tabindex="-1">CA 证书 <a class="header-anchor" href="#ca-证书" aria-label="Permalink to &quot;CA 证书&quot;">​</a></h2><blockquote><p>有了混合加密方式的传输数据仍然不是安全的（DNS 劫持替换 IP 地址）</p></blockquote><h3 id="加密方式" tabindex="-1">加密方式 <a class="header-anchor" href="#加密方式" aria-label="Permalink to &quot;加密方式&quot;">​</a></h3><ol><li>浏览器发送加密套件列表、非对称加密套件列表以及 client-random 随机数</li><li>服务器收到消息，选择加密方式以及返回<code>数字证书</code>和 service-random 随机数</li><li>浏览器获取数字证书中的公钥，并生成随机数 pre-master</li><li>使用公钥加密 pre-master 发送给服务器确认 master-secret</li><li>服务器浏览器确认返回信息</li></ol><h3 id="申请数字证书" tabindex="-1">申请数字证书 <a class="header-anchor" href="#申请数字证书" aria-label="Permalink to &quot;申请数字证书&quot;">​</a></h3><ol><li>准备一套公钥和私钥，私钥留着自己使用</li><li>向 CA 机构提交公钥以及相关信息（收费）</li><li>CA 机构验证信息是否合理合法</li><li>信息审核通过，签发数字证书（公钥、组织信息、CA 的信息、有效时间、证书序列号等明文信息）以及一个 CA 生成的签名</li></ol><h3 id="ca-数字签名" tabindex="-1">CA 数字签名 <a class="header-anchor" href="#ca-数字签名" aria-label="Permalink to &quot;CA 数字签名&quot;">​</a></h3><ol><li>CA 使用 Hash 函数算法计算明文信息，并得出信息摘要</li><li>CA 使用其自有的私钥对信息摘要进行加密，加密后的密文就是数字签名</li></ol><h3 id="验证数字证书" tabindex="-1">验证数字证书 <a class="header-anchor" href="#验证数字证书" aria-label="Permalink to &quot;验证数字证书&quot;">​</a></h3><ol><li>浏览器使用相同的 Hash 算法函数计算明文信息，得到信息摘要 A</li><li>再使用公钥对数字签名解密，得到信息摘要 B</li><li>信息摘要 A === 信息摘要 B</li></ol><blockquote><p>CA 是机构，会沿着 CA 机构链查找，直到根证书机构为止（否则视为不合法）</p></blockquote><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><ol><li>申请数字证书是不需要提供私钥的，私钥永远只能存在于服务器上</li><li>数字证书最核心的内容就是使用其自有的私钥生成的数字签名</li><li>内置 CA 对应的证书称为根证书，最权威的机构（自签名证书）</li></ol><h2 id="数字证书拓展" tabindex="-1">数字证书拓展 <a class="header-anchor" href="#数字证书拓展" aria-label="Permalink to &quot;数字证书拓展&quot;">​</a></h2><p>数字证书</p><blockquote><p>个人申请的证书属于 DV 类型；普通公司申请的证书属于 OV 类型；金融机构、银行、电商平台申请的证书属于 EV 类型（DV 自动验证，OV 和 EV 需要人工验证）</p></blockquote><blockquote><p>CA 机构的权威性，数字证书链，中间 CA(Intermediates CAs)和根 CA(Root CAs)</p></blockquote><blockquote><p>操作系统内置根证书，WebTrust（网络信任） 认证是电子认证服务行业中唯一的国际性认证标准（认证的根 CA 目前有 Comodo，geotrust，rapidssl，symantec，thawte，digicert），只有在操作系统中能追溯到数字证书链才能验证证书合法</p></blockquote>',45),r=[t];function c(s,n,h,d,u,b){return e(),l("div",null,r)}const p=a(i,[["render",c]]);export{m as __pageData,p as default};
diff --git a/assets/network_tls_ssl.md.1b14e38d.lean.js b/assets/network_tls_ssl.md.e0605f70.lean.js
similarity index 70%
rename from assets/network_tls_ssl.md.1b14e38d.lean.js
rename to assets/network_tls_ssl.md.e0605f70.lean.js
index 28167db..f348fcb 100644
--- a/assets/network_tls_ssl.md.1b14e38d.lean.js
+++ b/assets/network_tls_ssl.md.e0605f70.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as l,Q as o}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"HTTPS 加密层","description":"","frontmatter":{},"headers":[],"relativePath":"network/tls_ssl.md","filePath":"network/tls_ssl.md","lastUpdated":1670330848000}'),i={name:"network/tls_ssl.md"},t=o("",45),r=[t];function c(s,n,h,d,u,b){return e(),l("div",null,r)}const p=a(i,[["render",c]]);export{m as __pageData,p as default};
+import{_ as a,o as e,c as l,Q as o}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"HTTPS 加密层","description":"","frontmatter":{},"headers":[],"relativePath":"network/tls_ssl.md","filePath":"network/tls_ssl.md","lastUpdated":1670330848000}'),i={name:"network/tls_ssl.md"},t=o("",45),r=[t];function c(s,n,h,d,u,b){return e(),l("div",null,r)}const p=a(i,[["render",c]]);export{m as __pageData,p as default};
diff --git a/assets/network_webrtc.md.5adc7068.js b/assets/network_webrtc.md.06b0eb25.js
similarity index 91%
rename from assets/network_webrtc.md.5adc7068.js
rename to assets/network_webrtc.md.06b0eb25.js
index 3f841a5..2a4cfa9 100644
--- a/assets/network_webrtc.md.5adc7068.js
+++ b/assets/network_webrtc.md.06b0eb25.js
@@ -1 +1 @@
-import{_ as t,o as e,c as a,Q as r}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"WebRTC","description":"","frontmatter":{},"headers":[],"relativePath":"network/webrtc.md","filePath":"network/webrtc.md","lastUpdated":1670330848000}'),o={name:"network/webrtc.md"},s=r('<h1 id="webrtc" tabindex="-1">WebRTC <a class="header-anchor" href="#webrtc" aria-label="Permalink to &quot;WebRTC&quot;">​</a></h1><p>WebRTC 同时支持传输音视频数据、自定义应用数据</p><ul><li>传输音视频数据相关协议 UDP、DTLS、RTP/SRTCP</li><li>传输自定义应用数据相关协议 UDP、DTLS、SCTP</li></ul><h2 id="udp-dtls" tabindex="-1">UDP DTLS <a class="header-anchor" href="#udp-dtls" aria-label="Permalink to &quot;UDP DTLS&quot;">​</a></h2><p>加密信道建立</p><h2 id="rtp-srtp-rtcp-srtcp" tabindex="-1">RTP/SRTP RTCP/SRTCP <a class="header-anchor" href="#rtp-srtp-rtcp-srtcp" aria-label="Permalink to &quot;RTP/SRTP RTCP/SRTCP&quot;">​</a></h2><p>RTP(Realtime Transport Protocol): 实时传输协议 RTCP(RTP Transport Control Protocol): RTP 传输控制协议</p><h2 id="sctp" tabindex="-1">SCTP <a class="header-anchor" href="#sctp" aria-label="Permalink to &quot;SCTP&quot;">​</a></h2><p>SCTP(Stream Control Transimission Protocol): 流控制传输协议</p>',9),c=[s];function l(n,i,T,p,P,d){return e(),a("div",null,c)}const R=t(o,[["render",l]]);export{h as __pageData,R as default};
+import{_ as t,o as e,c as a,Q as r}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"WebRTC","description":"","frontmatter":{},"headers":[],"relativePath":"network/webrtc.md","filePath":"network/webrtc.md","lastUpdated":1670330848000}'),o={name:"network/webrtc.md"},s=r('<h1 id="webrtc" tabindex="-1">WebRTC <a class="header-anchor" href="#webrtc" aria-label="Permalink to &quot;WebRTC&quot;">​</a></h1><p>WebRTC 同时支持传输音视频数据、自定义应用数据</p><ul><li>传输音视频数据相关协议 UDP、DTLS、RTP/SRTCP</li><li>传输自定义应用数据相关协议 UDP、DTLS、SCTP</li></ul><h2 id="udp-dtls" tabindex="-1">UDP DTLS <a class="header-anchor" href="#udp-dtls" aria-label="Permalink to &quot;UDP DTLS&quot;">​</a></h2><p>加密信道建立</p><h2 id="rtp-srtp-rtcp-srtcp" tabindex="-1">RTP/SRTP RTCP/SRTCP <a class="header-anchor" href="#rtp-srtp-rtcp-srtcp" aria-label="Permalink to &quot;RTP/SRTP RTCP/SRTCP&quot;">​</a></h2><p>RTP(Realtime Transport Protocol): 实时传输协议 RTCP(RTP Transport Control Protocol): RTP 传输控制协议</p><h2 id="sctp" tabindex="-1">SCTP <a class="header-anchor" href="#sctp" aria-label="Permalink to &quot;SCTP&quot;">​</a></h2><p>SCTP(Stream Control Transimission Protocol): 流控制传输协议</p>',9),c=[s];function l(n,i,T,p,P,d){return e(),a("div",null,c)}const R=t(o,[["render",l]]);export{h as __pageData,R as default};
diff --git a/assets/network_webrtc.md.5adc7068.lean.js b/assets/network_webrtc.md.06b0eb25.lean.js
similarity index 69%
rename from assets/network_webrtc.md.5adc7068.lean.js
rename to assets/network_webrtc.md.06b0eb25.lean.js
index cfb2e29..2b0f2a2 100644
--- a/assets/network_webrtc.md.5adc7068.lean.js
+++ b/assets/network_webrtc.md.06b0eb25.lean.js
@@ -1 +1 @@
-import{_ as t,o as e,c as a,Q as r}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"WebRTC","description":"","frontmatter":{},"headers":[],"relativePath":"network/webrtc.md","filePath":"network/webrtc.md","lastUpdated":1670330848000}'),o={name:"network/webrtc.md"},s=r("",9),c=[s];function l(n,i,T,p,P,d){return e(),a("div",null,c)}const R=t(o,[["render",l]]);export{h as __pageData,R as default};
+import{_ as t,o as e,c as a,Q as r}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"WebRTC","description":"","frontmatter":{},"headers":[],"relativePath":"network/webrtc.md","filePath":"network/webrtc.md","lastUpdated":1670330848000}'),o={name:"network/webrtc.md"},s=r("",9),c=[s];function l(n,i,T,p,P,d){return e(),a("div",null,c)}const R=t(o,[["render",l]]);export{h as __pageData,R as default};
diff --git a/assets/notes_css_bfc.md.cf27ad88.js b/assets/notes_css_bfc.md.d9623d35.js
similarity index 97%
rename from assets/notes_css_bfc.md.cf27ad88.js
rename to assets/notes_css_bfc.md.d9623d35.js
index 3aafb3a..56381c7 100644
--- a/assets/notes_css_bfc.md.cf27ad88.js
+++ b/assets/notes_css_bfc.md.d9623d35.js
@@ -1 +1 @@
-import{_ as l,o as i,c as a,Q as t}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"HTML 格式化上下文","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/bfc.md","filePath":"notes/css/bfc.md","lastUpdated":1689042901000}'),o={name:"notes/css/bfc.md"},e=t('<h1 id="html-格式化上下文" tabindex="-1">HTML 格式化上下文 <a class="header-anchor" href="#html-格式化上下文" aria-label="Permalink to &quot;HTML 格式化上下文&quot;">​</a></h1><h2 id="bfc" tabindex="-1">BFC <a class="header-anchor" href="#bfc" aria-label="Permalink to &quot;BFC&quot;">​</a></h2><p>BFC - block formatting context 块级格式化上下文</p><div class="tip custom-block"><p class="custom-block-title">BFC 概念</p><p>文档最外层元素使用块布局规则称为初始块格式上下文</p></div><h3 id="css-属性创建-bfc" tabindex="-1">CSS 属性创建 BFC <a class="header-anchor" href="#css-属性创建-bfc" aria-label="Permalink to &quot;CSS 属性创建 BFC&quot;">​</a></h3><p>适用以下的方法可以创建一个新的 BFC</p><ul><li>使用 float 时其浮动的元素</li><li>绝对定位的元素 （position: absolute/fixed/sticky）</li><li>display: inline-block</li><li>表格单元格 display: table-cell，包括使用所有 table-* 属性的所有表格单元格</li><li>块级元素的 overflow 属性不为 visible</li><li>元素属性为 display: flow-root/list-item</li><li>元素属性为 contain: layout/content/strict</li><li>flex items（display: flex 容器布局下的子元素）</li><li>gird 布局（display: grid 容器布局下的子元素）</li><li>multicol containers 多列容器（column-count: 1 或 column-width 不为 auto）</li><li>元素属性 column-span: all</li></ul><blockquote><p>创建新的 BFC 的行为与最外层的文档非常相似，主布局中创造了一个小布局，包含了其内部所有的内容</p></blockquote><blockquote><p>float &amp; clear</p></blockquote><ol><li>float(脱离文档流) 和 clear 仅适用于同一格式上下文中的项目，页边距仅在同一格式上下文中的元素之间折叠</li><li>浮动不会影响其他 BFC 中元素的布局，而清除浮动只能清除同一 BFC 在它前面的元素的浮动</li></ol><h3 id="解决了什么问题" tabindex="-1">解决了什么问题 <a class="header-anchor" href="#解决了什么问题" aria-label="Permalink to &quot;解决了什么问题&quot;">​</a></h3><blockquote><p>高度塌陷问题</p></blockquote><ul><li>子元素设置 float 父容器高度塌陷</li></ul><blockquote><p>外边距重叠问题</p></blockquote><ul><li>创建新的 BFC 避免两个块元素之间的外边距合并问题</li></ul><h2 id="ifc" tabindex="-1">IFC <a class="header-anchor" href="#ifc" aria-label="Permalink to &quot;IFC&quot;">​</a></h2><p>IFC - inline formatting context 行内格式化上下文</p><div class="tip custom-block"><p class="custom-block-title">IFC 概念</p><p>一个块元素内存在内联元素，一次排列；内联格式上下文存在于其他格式上下文中，可以将其视为段落的上下文</p></div><h3 id="说明" tabindex="-1">说明 <a class="header-anchor" href="#说明" aria-label="Permalink to &quot;说明&quot;">​</a></h3><ul><li>行内元素设置水平间距可以适用</li><li>行内元素设置垂直间距不适用（可能会在内容的上方和下方重叠）</li><li>行内格式化上下文填充和边框不会将行框撑开</li></ul><h2 id="flow-layout" tabindex="-1">Flow Layout <a class="header-anchor" href="#flow-layout" aria-label="Permalink to &quot;Flow Layout&quot;">​</a></h2><p>流式布局(正常流)</p><ul><li>CSS2.1 水平写入模式</li></ul><h2 id="writing-mode" tabindex="-1">Writing Mode <a class="header-anchor" href="#writing-mode" aria-label="Permalink to &quot;Writing Mode&quot;">​</a></h2><p>书写模式（书写模式、方向、文本方向属性决定）</p><ul><li>css =&gt; writing-mode: verticla-lr, horizontal-tb, vertical-rl</li></ul><h3 id="说明-1" tabindex="-1">说明 <a class="header-anchor" href="#说明-1" aria-label="Permalink to &quot;说明&quot;">​</a></h3><ul><li>图像不会改变方向</li><li>块元素应用书写模式，改变文字方向，块元素不发生旋转</li></ul><h2 id="外边距重叠" tabindex="-1">外边距重叠 <a class="header-anchor" href="#外边距重叠" aria-label="Permalink to &quot;外边距重叠&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">概念</p><p>块的上外边距和下外边距有时合并（折叠）为单个边距，其大小为单个边距的最大值（如果相等，取其中一个）</p></div><ul><li>有设定 float 和 position:absolute 的元素不产生外边距重叠问题</li></ul><h3 id="情形" tabindex="-1">情形 <a class="header-anchor" href="#情形" aria-label="Permalink to &quot;情形&quot;">​</a></h3><blockquote><p>同一层相邻元素</p></blockquote><p>相邻的两个元素之间的外边距重叠，除非后一个元素加上 clearfix 清除浮动</p><blockquote><p>没有内容将父元素和后代元素分开</p></blockquote><ol><li>父级 margin-top(没有边框、内边距、行内内容、BFC、清除浮动 clearfix)，子元素的 margin-top 会与父元素重叠，并且溢出；</li><li>父级 margin-bottom(没有边框、内边距、行内内容、高度 height min-height max-height)，子元素的 margin-bottom 会与父元素重叠，并且溢出。</li></ol><blockquote><p>空的块级元素</p></blockquote><p>块元素（没有边框、内边距、行内内容、高度 height min-height max-height、inline、clearfix)，margin-top 和 margin-bottom 会发生重叠</p><blockquote><p>外边距为负值</p></blockquote><ol><li>参与折叠的外边距包含负值，折叠后的外边距的最大的正边距与最小的负边距（绝对值最大的负边距）；</li><li>所有参与折叠的元素外边距都为负值，折叠后的外边距的值为最小的负边距的值。</li></ol>',40),c=[e];function r(s,n,u,h,p,d){return i(),a("div",null,c)}const f=l(o,[["render",r]]);export{m as __pageData,f as default};
+import{_ as l,o as i,c as a,Q as t}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"HTML 格式化上下文","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/bfc.md","filePath":"notes/css/bfc.md","lastUpdated":1689042901000}'),o={name:"notes/css/bfc.md"},e=t('<h1 id="html-格式化上下文" tabindex="-1">HTML 格式化上下文 <a class="header-anchor" href="#html-格式化上下文" aria-label="Permalink to &quot;HTML 格式化上下文&quot;">​</a></h1><h2 id="bfc" tabindex="-1">BFC <a class="header-anchor" href="#bfc" aria-label="Permalink to &quot;BFC&quot;">​</a></h2><p>BFC - block formatting context 块级格式化上下文</p><div class="tip custom-block"><p class="custom-block-title">BFC 概念</p><p>文档最外层元素使用块布局规则称为初始块格式上下文</p></div><h3 id="css-属性创建-bfc" tabindex="-1">CSS 属性创建 BFC <a class="header-anchor" href="#css-属性创建-bfc" aria-label="Permalink to &quot;CSS 属性创建 BFC&quot;">​</a></h3><p>适用以下的方法可以创建一个新的 BFC</p><ul><li>使用 float 时其浮动的元素</li><li>绝对定位的元素 （position: absolute/fixed/sticky）</li><li>display: inline-block</li><li>表格单元格 display: table-cell，包括使用所有 table-* 属性的所有表格单元格</li><li>块级元素的 overflow 属性不为 visible</li><li>元素属性为 display: flow-root/list-item</li><li>元素属性为 contain: layout/content/strict</li><li>flex items（display: flex 容器布局下的子元素）</li><li>gird 布局（display: grid 容器布局下的子元素）</li><li>multicol containers 多列容器（column-count: 1 或 column-width 不为 auto）</li><li>元素属性 column-span: all</li></ul><blockquote><p>创建新的 BFC 的行为与最外层的文档非常相似，主布局中创造了一个小布局，包含了其内部所有的内容</p></blockquote><blockquote><p>float &amp; clear</p></blockquote><ol><li>float(脱离文档流) 和 clear 仅适用于同一格式上下文中的项目，页边距仅在同一格式上下文中的元素之间折叠</li><li>浮动不会影响其他 BFC 中元素的布局，而清除浮动只能清除同一 BFC 在它前面的元素的浮动</li></ol><h3 id="解决了什么问题" tabindex="-1">解决了什么问题 <a class="header-anchor" href="#解决了什么问题" aria-label="Permalink to &quot;解决了什么问题&quot;">​</a></h3><blockquote><p>高度塌陷问题</p></blockquote><ul><li>子元素设置 float 父容器高度塌陷</li></ul><blockquote><p>外边距重叠问题</p></blockquote><ul><li>创建新的 BFC 避免两个块元素之间的外边距合并问题</li></ul><h2 id="ifc" tabindex="-1">IFC <a class="header-anchor" href="#ifc" aria-label="Permalink to &quot;IFC&quot;">​</a></h2><p>IFC - inline formatting context 行内格式化上下文</p><div class="tip custom-block"><p class="custom-block-title">IFC 概念</p><p>一个块元素内存在内联元素，一次排列；内联格式上下文存在于其他格式上下文中，可以将其视为段落的上下文</p></div><h3 id="说明" tabindex="-1">说明 <a class="header-anchor" href="#说明" aria-label="Permalink to &quot;说明&quot;">​</a></h3><ul><li>行内元素设置水平间距可以适用</li><li>行内元素设置垂直间距不适用（可能会在内容的上方和下方重叠）</li><li>行内格式化上下文填充和边框不会将行框撑开</li></ul><h2 id="flow-layout" tabindex="-1">Flow Layout <a class="header-anchor" href="#flow-layout" aria-label="Permalink to &quot;Flow Layout&quot;">​</a></h2><p>流式布局(正常流)</p><ul><li>CSS2.1 水平写入模式</li></ul><h2 id="writing-mode" tabindex="-1">Writing Mode <a class="header-anchor" href="#writing-mode" aria-label="Permalink to &quot;Writing Mode&quot;">​</a></h2><p>书写模式（书写模式、方向、文本方向属性决定）</p><ul><li>css =&gt; writing-mode: verticla-lr, horizontal-tb, vertical-rl</li></ul><h3 id="说明-1" tabindex="-1">说明 <a class="header-anchor" href="#说明-1" aria-label="Permalink to &quot;说明&quot;">​</a></h3><ul><li>图像不会改变方向</li><li>块元素应用书写模式，改变文字方向，块元素不发生旋转</li></ul><h2 id="外边距重叠" tabindex="-1">外边距重叠 <a class="header-anchor" href="#外边距重叠" aria-label="Permalink to &quot;外边距重叠&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">概念</p><p>块的上外边距和下外边距有时合并（折叠）为单个边距，其大小为单个边距的最大值（如果相等，取其中一个）</p></div><ul><li>有设定 float 和 position:absolute 的元素不产生外边距重叠问题</li></ul><h3 id="情形" tabindex="-1">情形 <a class="header-anchor" href="#情形" aria-label="Permalink to &quot;情形&quot;">​</a></h3><blockquote><p>同一层相邻元素</p></blockquote><p>相邻的两个元素之间的外边距重叠，除非后一个元素加上 clearfix 清除浮动</p><blockquote><p>没有内容将父元素和后代元素分开</p></blockquote><ol><li>父级 margin-top(没有边框、内边距、行内内容、BFC、清除浮动 clearfix)，子元素的 margin-top 会与父元素重叠，并且溢出；</li><li>父级 margin-bottom(没有边框、内边距、行内内容、高度 height min-height max-height)，子元素的 margin-bottom 会与父元素重叠，并且溢出。</li></ol><blockquote><p>空的块级元素</p></blockquote><p>块元素（没有边框、内边距、行内内容、高度 height min-height max-height、inline、clearfix)，margin-top 和 margin-bottom 会发生重叠</p><blockquote><p>外边距为负值</p></blockquote><ol><li>参与折叠的外边距包含负值，折叠后的外边距的最大的正边距与最小的负边距（绝对值最大的负边距）；</li><li>所有参与折叠的元素外边距都为负值，折叠后的外边距的值为最小的负边距的值。</li></ol>',40),c=[e];function r(s,n,u,h,p,d){return i(),a("div",null,c)}const f=l(o,[["render",r]]);export{m as __pageData,f as default};
diff --git a/assets/notes_css_bfc.md.cf27ad88.lean.js b/assets/notes_css_bfc.md.d9623d35.lean.js
similarity index 70%
rename from assets/notes_css_bfc.md.cf27ad88.lean.js
rename to assets/notes_css_bfc.md.d9623d35.lean.js
index 5486421..dcd11d0 100644
--- a/assets/notes_css_bfc.md.cf27ad88.lean.js
+++ b/assets/notes_css_bfc.md.d9623d35.lean.js
@@ -1 +1 @@
-import{_ as l,o as i,c as a,Q as t}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"HTML 格式化上下文","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/bfc.md","filePath":"notes/css/bfc.md","lastUpdated":1689042901000}'),o={name:"notes/css/bfc.md"},e=t("",40),c=[e];function r(s,n,u,h,p,d){return i(),a("div",null,c)}const f=l(o,[["render",r]]);export{m as __pageData,f as default};
+import{_ as l,o as i,c as a,Q as t}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"HTML 格式化上下文","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/bfc.md","filePath":"notes/css/bfc.md","lastUpdated":1689042901000}'),o={name:"notes/css/bfc.md"},e=t("",40),c=[e];function r(s,n,u,h,p,d){return i(),a("div",null,c)}const f=l(o,[["render",r]]);export{m as __pageData,f as default};
diff --git a/assets/notes_css_box.md.b41a02c1.js b/assets/notes_css_box.md.b1484cf4.js
similarity index 96%
rename from assets/notes_css_box.md.b41a02c1.js
rename to assets/notes_css_box.md.b1484cf4.js
index 9fd68cd..8af1f40 100644
--- a/assets/notes_css_box.md.b41a02c1.js
+++ b/assets/notes_css_box.md.b1484cf4.js
@@ -1 +1 @@
-import{_ as t,o,c as a,Q as e}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"盒模型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/box.md","filePath":"notes/css/box.md","lastUpdated":1670330848000}'),i={name:"notes/css/box.md"},l=e('<h1 id="盒模型" tabindex="-1">盒模型 <a class="header-anchor" href="#盒模型" aria-label="Permalink to &quot;盒模型&quot;">​</a></h1><p>box-model</p><h2 id="基础盒模型" tabindex="-1">基础盒模型 <a class="header-anchor" href="#基础盒模型" aria-label="Permalink to &quot;基础盒模型&quot;">​</a></h2><p>每个盒子由四部分组成：内容边界、内边距边界、边框边界、外边距边界</p><h2 id="与盒模型相关的css属性" tabindex="-1">与盒模型相关的css属性 <a class="header-anchor" href="#与盒模型相关的css属性" aria-label="Permalink to &quot;与盒模型相关的css属性&quot;">​</a></h2><blockquote><p>内容流</p></blockquote><p>overflow overflow-x overflow-y</p><blockquote><p>大小</p></blockquote><p>height min-height max-height width min-width max-width</p><blockquote><p>外边距</p></blockquote><p>margin margin-left marign-right margin-top margin-bottom margin-trim</p><blockquote><p>内边距</p></blockquote><p>padding padding-left padding-right padding-top padding-bottom</p><blockquote><p>其他</p></blockquote><p>visibility</p><h2 id="视觉格式化模型" tabindex="-1">视觉格式化模型 <a class="header-anchor" href="#视觉格式化模型" aria-label="Permalink to &quot;视觉格式化模型&quot;">​</a></h2><p>用来处理在视觉媒体上显示文档时使用的计算规则</p><ul><li><p>块</p></li><li><p>包含块</p></li><li><p>盒子</p></li><li><p>块级元素</p></li><li><p>块级盒子</p></li><li><p>块盒子</p></li><li><p>块容器盒子</p></li><li><p>行内级元素</p></li><li><p>行内级盒子</p></li><li><p>行内盒子</p></li><li><p>原子行内级盒子</p></li></ul>',18),p=[l];function r(s,n,c,d,h,m){return o(),a("div",null,p)}const u=t(i,[["render",r]]);export{b as __pageData,u as default};
+import{_ as t,o,c as a,Q as e}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"盒模型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/box.md","filePath":"notes/css/box.md","lastUpdated":1670330848000}'),i={name:"notes/css/box.md"},l=e('<h1 id="盒模型" tabindex="-1">盒模型 <a class="header-anchor" href="#盒模型" aria-label="Permalink to &quot;盒模型&quot;">​</a></h1><p>box-model</p><h2 id="基础盒模型" tabindex="-1">基础盒模型 <a class="header-anchor" href="#基础盒模型" aria-label="Permalink to &quot;基础盒模型&quot;">​</a></h2><p>每个盒子由四部分组成：内容边界、内边距边界、边框边界、外边距边界</p><h2 id="与盒模型相关的css属性" tabindex="-1">与盒模型相关的css属性 <a class="header-anchor" href="#与盒模型相关的css属性" aria-label="Permalink to &quot;与盒模型相关的css属性&quot;">​</a></h2><blockquote><p>内容流</p></blockquote><p>overflow overflow-x overflow-y</p><blockquote><p>大小</p></blockquote><p>height min-height max-height width min-width max-width</p><blockquote><p>外边距</p></blockquote><p>margin margin-left marign-right margin-top margin-bottom margin-trim</p><blockquote><p>内边距</p></blockquote><p>padding padding-left padding-right padding-top padding-bottom</p><blockquote><p>其他</p></blockquote><p>visibility</p><h2 id="视觉格式化模型" tabindex="-1">视觉格式化模型 <a class="header-anchor" href="#视觉格式化模型" aria-label="Permalink to &quot;视觉格式化模型&quot;">​</a></h2><p>用来处理在视觉媒体上显示文档时使用的计算规则</p><ul><li><p>块</p></li><li><p>包含块</p></li><li><p>盒子</p></li><li><p>块级元素</p></li><li><p>块级盒子</p></li><li><p>块盒子</p></li><li><p>块容器盒子</p></li><li><p>行内级元素</p></li><li><p>行内级盒子</p></li><li><p>行内盒子</p></li><li><p>原子行内级盒子</p></li></ul>',18),p=[l];function r(s,n,c,d,h,m){return o(),a("div",null,p)}const u=t(i,[["render",r]]);export{b as __pageData,u as default};
diff --git a/assets/notes_css_box.md.b41a02c1.lean.js b/assets/notes_css_box.md.b1484cf4.lean.js
similarity index 84%
rename from assets/notes_css_box.md.b41a02c1.lean.js
rename to assets/notes_css_box.md.b1484cf4.lean.js
index 68e72b1..8d73109 100644
--- a/assets/notes_css_box.md.b41a02c1.lean.js
+++ b/assets/notes_css_box.md.b1484cf4.lean.js
@@ -1 +1 @@
-import{_ as t,o,c as a,Q as e}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"盒模型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/box.md","filePath":"notes/css/box.md","lastUpdated":1670330848000}'),i={name:"notes/css/box.md"},l=e("",18),p=[l];function r(s,n,c,d,h,m){return o(),a("div",null,p)}const u=t(i,[["render",r]]);export{b as __pageData,u as default};
+import{_ as t,o,c as a,Q as e}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"盒模型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/box.md","filePath":"notes/css/box.md","lastUpdated":1670330848000}'),i={name:"notes/css/box.md"},l=e("",18),p=[l];function r(s,n,c,d,h,m){return o(),a("div",null,p)}const u=t(i,[["render",r]]);export{b as __pageData,u as default};
diff --git a/assets/notes_css_flex.md.2119380d.js b/assets/notes_css_flex.md.d5fb90fd.js
similarity index 99%
rename from assets/notes_css_flex.md.2119380d.js
rename to assets/notes_css_flex.md.d5fb90fd.js
index 8d9b33d..f5086c7 100644
--- a/assets/notes_css_flex.md.2119380d.js
+++ b/assets/notes_css_flex.md.d5fb90fd.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const g=JSON.parse('{"title":"flex 扩展","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/flex.md","filePath":"notes/css/flex.md","lastUpdated":1670330848000}'),p={name:"notes/css/flex.md"},o=l(`<h1 id="flex-扩展" tabindex="-1">flex 扩展 <a class="header-anchor" href="#flex-扩展" aria-label="Permalink to &quot;flex 扩展&quot;">​</a></h1><h2 id="flex-margin" tabindex="-1">flex &amp; margin <a class="header-anchor" href="#flex-margin" aria-label="Permalink to &quot;flex &amp; margin&quot;">​</a></h2><blockquote><p>flex 布局容器下的项目使用 margin 属性，有些情况会得到 flex 布局中项目属性的同等效果</p></blockquote><h3 id="margin-auto" tabindex="-1">margin: auto <a class="header-anchor" href="#margin-auto" aria-label="Permalink to &quot;margin: auto&quot;">​</a></h3><ul><li>块元素在确定宽度元素下，使用 margin:auto 可以实现水平居中，无法实现垂直居中，CSS 规定 margin-top, margin-bottom 默认为 0，margin-left, margin-right 为 auto</li><li>flex 布局容器下的项目属性，margin:auto 可以实现水平垂直居中（flex 布局下的元素 margin-top, margin-bottom, margin-left, margin-right 属性值默认为 auto）</li></ul><h3 id="justify-content-align-items" tabindex="-1">justify-content/align-items <a class="header-anchor" href="#justify-content-align-items" aria-label="Permalink to &quot;justify-content/align-items&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const g=JSON.parse('{"title":"flex 扩展","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/flex.md","filePath":"notes/css/flex.md","lastUpdated":1670330848000}'),p={name:"notes/css/flex.md"},o=l(`<h1 id="flex-扩展" tabindex="-1">flex 扩展 <a class="header-anchor" href="#flex-扩展" aria-label="Permalink to &quot;flex 扩展&quot;">​</a></h1><h2 id="flex-margin" tabindex="-1">flex &amp; margin <a class="header-anchor" href="#flex-margin" aria-label="Permalink to &quot;flex &amp; margin&quot;">​</a></h2><blockquote><p>flex 布局容器下的项目使用 margin 属性，有些情况会得到 flex 布局中项目属性的同等效果</p></blockquote><h3 id="margin-auto" tabindex="-1">margin: auto <a class="header-anchor" href="#margin-auto" aria-label="Permalink to &quot;margin: auto&quot;">​</a></h3><ul><li>块元素在确定宽度元素下，使用 margin:auto 可以实现水平居中，无法实现垂直居中，CSS 规定 margin-top, margin-bottom 默认为 0，margin-left, margin-right 为 auto</li><li>flex 布局容器下的项目属性，margin:auto 可以实现水平垂直居中（flex 布局下的元素 margin-top, margin-bottom, margin-left, margin-right 属性值默认为 auto）</li></ul><h3 id="justify-content-align-items" tabindex="-1">justify-content/align-items <a class="header-anchor" href="#justify-content-align-items" aria-label="Permalink to &quot;justify-content/align-items&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;item&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#6A737D;">&lt;!-- 水平垂直居中 --&gt;</span></span>
diff --git a/assets/notes_css_flex.md.2119380d.lean.js b/assets/notes_css_flex.md.d5fb90fd.lean.js
similarity index 69%
rename from assets/notes_css_flex.md.2119380d.lean.js
rename to assets/notes_css_flex.md.d5fb90fd.lean.js
index 1651ec4..63b89d8 100644
--- a/assets/notes_css_flex.md.2119380d.lean.js
+++ b/assets/notes_css_flex.md.d5fb90fd.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const g=JSON.parse('{"title":"flex 扩展","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/flex.md","filePath":"notes/css/flex.md","lastUpdated":1670330848000}'),p={name:"notes/css/flex.md"},o=l("",15),t=[o];function e(c,E,r,y,i,F){return n(),a("div",null,t)}const u=s(p,[["render",e]]);export{g as __pageData,u as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const g=JSON.parse('{"title":"flex 扩展","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/flex.md","filePath":"notes/css/flex.md","lastUpdated":1670330848000}'),p={name:"notes/css/flex.md"},o=l("",15),t=[o];function e(c,E,r,y,i,F){return n(),a("div",null,t)}const u=s(p,[["render",e]]);export{g as __pageData,u as default};
diff --git a/assets/notes_css_float.md.88996ca7.js b/assets/notes_css_float.md.74e6557b.js
similarity index 98%
rename from assets/notes_css_float.md.88996ca7.js
rename to assets/notes_css_float.md.74e6557b.js
index ea8f1fc..f187d08 100644
--- a/assets/notes_css_float.md.88996ca7.js
+++ b/assets/notes_css_float.md.74e6557b.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"float & clear","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/float.md","filePath":"notes/css/float.md","lastUpdated":1670330848000}'),p={name:"notes/css/float.md"},o=n(`<h1 id="float-clear" tabindex="-1">float &amp; clear <a class="header-anchor" href="#float-clear" aria-label="Permalink to &quot;float &amp; clear&quot;">​</a></h1><p>浮动元素 清除浮动</p><h2 id="float" tabindex="-1">float <a class="header-anchor" href="#float" aria-label="Permalink to &quot;float&quot;">​</a></h2><ul><li>浮动元素表示使用块布局</li><li>文本和行内元素围绕着浮动元素</li></ul><h3 id="float-属性取值" tabindex="-1">float 属性取值 <a class="header-anchor" href="#float-属性取值" aria-label="Permalink to &quot;float 属性取值&quot;">​</a></h3><p>left | right | none | inline-start | inline-end</p><h3 id="是否设置宽度" tabindex="-1">是否设置宽度 <a class="header-anchor" href="#是否设置宽度" aria-label="Permalink to &quot;是否设置宽度&quot;">​</a></h3><blockquote><p>行内元素</p></blockquote><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">&lt;!-- css --&gt;</span></span>
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"float & clear","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/float.md","filePath":"notes/css/float.md","lastUpdated":1670330848000}'),p={name:"notes/css/float.md"},o=n(`<h1 id="float-clear" tabindex="-1">float &amp; clear <a class="header-anchor" href="#float-clear" aria-label="Permalink to &quot;float &amp; clear&quot;">​</a></h1><p>浮动元素 清除浮动</p><h2 id="float" tabindex="-1">float <a class="header-anchor" href="#float" aria-label="Permalink to &quot;float&quot;">​</a></h2><ul><li>浮动元素表示使用块布局</li><li>文本和行内元素围绕着浮动元素</li></ul><h3 id="float-属性取值" tabindex="-1">float 属性取值 <a class="header-anchor" href="#float-属性取值" aria-label="Permalink to &quot;float 属性取值&quot;">​</a></h3><p>left | right | none | inline-start | inline-end</p><h3 id="是否设置宽度" tabindex="-1">是否设置宽度 <a class="header-anchor" href="#是否设置宽度" aria-label="Permalink to &quot;是否设置宽度&quot;">​</a></h3><blockquote><p>行内元素</p></blockquote><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">&lt;!-- css --&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">style</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#6A737D;">/* 不设置宽度 */</span></span>
diff --git a/assets/notes_css_float.md.88996ca7.lean.js b/assets/notes_css_float.md.74e6557b.lean.js
similarity index 70%
rename from assets/notes_css_float.md.88996ca7.lean.js
rename to assets/notes_css_float.md.74e6557b.lean.js
index 06dc4fe..d8ea71c 100644
--- a/assets/notes_css_float.md.88996ca7.lean.js
+++ b/assets/notes_css_float.md.74e6557b.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"float & clear","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/float.md","filePath":"notes/css/float.md","lastUpdated":1670330848000}'),p={name:"notes/css/float.md"},o=n("",23),e=[o];function t(c,r,i,E,y,d){return a(),l("div",null,e)}const f=s(p,[["render",t]]);export{u as __pageData,f as default};
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"float & clear","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/float.md","filePath":"notes/css/float.md","lastUpdated":1670330848000}'),p={name:"notes/css/float.md"},o=n("",23),e=[o];function t(c,r,i,E,y,d){return a(),l("div",null,e)}const f=s(p,[["render",t]]);export{u as __pageData,f as default};
diff --git a/assets/notes_css_index.md.9165b88b.js b/assets/notes_css_index.md.97c1211d.js
similarity index 98%
rename from assets/notes_css_index.md.9165b88b.js
rename to assets/notes_css_index.md.97c1211d.js
index 11f93bf..7969f12 100644
--- a/assets/notes_css_index.md.9165b88b.js
+++ b/assets/notes_css_index.md.97c1211d.js
@@ -1,4 +1,4 @@
-import{_ as a,o as s,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"css 选择器","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/index.md","filePath":"notes/css/index.md","lastUpdated":1670330848000}'),e={name:"notes/css/index.md"},o=l(`<h1 id="css-选择器" tabindex="-1">css 选择器 <a class="header-anchor" href="#css-选择器" aria-label="Permalink to &quot;css 选择器&quot;">​</a></h1><h2 id="元素选择器" tabindex="-1">元素选择器 <a class="header-anchor" href="#元素选择器" aria-label="Permalink to &quot;元素选择器&quot;">​</a></h2><p>div</p><h2 id="id-选择器" tabindex="-1">id 选择器 <a class="header-anchor" href="#id-选择器" aria-label="Permalink to &quot;id 选择器&quot;">​</a></h2><p>#div</p><h2 id="类选择器" tabindex="-1">类选择器 <a class="header-anchor" href="#类选择器" aria-label="Permalink to &quot;类选择器&quot;">​</a></h2><p>.div</p><h2 id="属性选择器" tabindex="-1">属性选择器 <a class="header-anchor" href="#属性选择器" aria-label="Permalink to &quot;属性选择器&quot;">​</a></h2><p>input[type=&quot;text&quot;]</p><h2 id="伪类选择器" tabindex="-1">伪类选择器 <a class="header-anchor" href="#伪类选择器" aria-label="Permalink to &quot;伪类选择器&quot;">​</a></h2><p>伪类 伪元素</p><h2 id="选择器组合" tabindex="-1">选择器组合 <a class="header-anchor" href="#选择器组合" aria-label="Permalink to &quot;选择器组合&quot;">​</a></h2><h3 id="" tabindex="-1">* <a class="header-anchor" href="#" aria-label="Permalink to &quot;\\*&quot;">​</a></h3><p>全体选择器</p><h3 id="空格" tabindex="-1">空格 <a class="header-anchor" href="#空格" aria-label="Permalink to &quot;空格&quot;">​</a></h3><p>后代选择器</p><h3 id="-1" tabindex="-1">+ <a class="header-anchor" href="#-1" aria-label="Permalink to &quot;+&quot;">​</a></h3><p>兄弟元素组合选择器</p><h3 id="-2" tabindex="-1">&gt; <a class="header-anchor" href="#-2" aria-label="Permalink to &quot;&gt;&quot;">​</a></h3><p>父元素后第一代子元素选择器</p><h3 id="-3" tabindex="-1">~ <a class="header-anchor" href="#-3" aria-label="Permalink to &quot;~&quot;">​</a></h3><p>兄弟选择器</p><h3 id="-4" tabindex="-1">|| <a class="header-anchor" href="#-4" aria-label="Permalink to &quot;||&quot;">​</a></h3><p>列组合选择器（一般用于表格表示第几列中的元素指定的特殊样式）</p><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#85E89D;">col</span><span style="color:#B392F0;">.selected</span><span style="color:#E1E4E8;">||</span><span style="color:#85E89D;">td</span><span style="color:#E1E4E8;"> {</span></span>
+import{_ as a,o as s,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"css 选择器","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/index.md","filePath":"notes/css/index.md","lastUpdated":1670330848000}'),e={name:"notes/css/index.md"},o=l(`<h1 id="css-选择器" tabindex="-1">css 选择器 <a class="header-anchor" href="#css-选择器" aria-label="Permalink to &quot;css 选择器&quot;">​</a></h1><h2 id="元素选择器" tabindex="-1">元素选择器 <a class="header-anchor" href="#元素选择器" aria-label="Permalink to &quot;元素选择器&quot;">​</a></h2><p>div</p><h2 id="id-选择器" tabindex="-1">id 选择器 <a class="header-anchor" href="#id-选择器" aria-label="Permalink to &quot;id 选择器&quot;">​</a></h2><p>#div</p><h2 id="类选择器" tabindex="-1">类选择器 <a class="header-anchor" href="#类选择器" aria-label="Permalink to &quot;类选择器&quot;">​</a></h2><p>.div</p><h2 id="属性选择器" tabindex="-1">属性选择器 <a class="header-anchor" href="#属性选择器" aria-label="Permalink to &quot;属性选择器&quot;">​</a></h2><p>input[type=&quot;text&quot;]</p><h2 id="伪类选择器" tabindex="-1">伪类选择器 <a class="header-anchor" href="#伪类选择器" aria-label="Permalink to &quot;伪类选择器&quot;">​</a></h2><p>伪类 伪元素</p><h2 id="选择器组合" tabindex="-1">选择器组合 <a class="header-anchor" href="#选择器组合" aria-label="Permalink to &quot;选择器组合&quot;">​</a></h2><h3 id="" tabindex="-1">* <a class="header-anchor" href="#" aria-label="Permalink to &quot;\\*&quot;">​</a></h3><p>全体选择器</p><h3 id="空格" tabindex="-1">空格 <a class="header-anchor" href="#空格" aria-label="Permalink to &quot;空格&quot;">​</a></h3><p>后代选择器</p><h3 id="-1" tabindex="-1">+ <a class="header-anchor" href="#-1" aria-label="Permalink to &quot;+&quot;">​</a></h3><p>兄弟元素组合选择器</p><h3 id="-2" tabindex="-1">&gt; <a class="header-anchor" href="#-2" aria-label="Permalink to &quot;&gt;&quot;">​</a></h3><p>父元素后第一代子元素选择器</p><h3 id="-3" tabindex="-1">~ <a class="header-anchor" href="#-3" aria-label="Permalink to &quot;~&quot;">​</a></h3><p>兄弟选择器</p><h3 id="-4" tabindex="-1">|| <a class="header-anchor" href="#-4" aria-label="Permalink to &quot;||&quot;">​</a></h3><p>列组合选择器（一般用于表格表示第几列中的元素指定的特殊样式）</p><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#85E89D;">col</span><span style="color:#B392F0;">.selected</span><span style="color:#E1E4E8;">||</span><span style="color:#85E89D;">td</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">background-color</span><span style="color:#E1E4E8;">: </span><span style="color:#79B8FF;">#000</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#22863A;">col</span><span style="color:#6F42C1;">.selected</span><span style="color:#24292E;">||</span><span style="color:#22863A;">td</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">background-color</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">#000</span><span style="color:#24292E;">;</span></span>
diff --git a/assets/notes_css_index.md.9165b88b.lean.js b/assets/notes_css_index.md.97c1211d.lean.js
similarity index 70%
rename from assets/notes_css_index.md.9165b88b.lean.js
rename to assets/notes_css_index.md.97c1211d.lean.js
index e55be7d..84060d7 100644
--- a/assets/notes_css_index.md.9165b88b.lean.js
+++ b/assets/notes_css_index.md.97c1211d.lean.js
@@ -1 +1 @@
-import{_ as a,o as s,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"css 选择器","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/index.md","filePath":"notes/css/index.md","lastUpdated":1670330848000}'),e={name:"notes/css/index.md"},o=l("",45),p=[o];function t(r,c,i,h,d,E){return s(),n("div",null,p)}const m=a(e,[["render",t]]);export{u as __pageData,m as default};
+import{_ as a,o as s,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"css 选择器","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/index.md","filePath":"notes/css/index.md","lastUpdated":1670330848000}'),e={name:"notes/css/index.md"},o=l("",45),p=[o];function t(r,c,i,h,d,E){return s(),n("div",null,p)}const m=a(e,[["render",t]]);export{u as __pageData,m as default};
diff --git a/assets/notes_css_inline.md.ed702657.js b/assets/notes_css_inline.md.5f3b894b.js
similarity index 91%
rename from assets/notes_css_inline.md.ed702657.js
rename to assets/notes_css_inline.md.5f3b894b.js
index 90c15ab..4a1bcf5 100644
--- a/assets/notes_css_inline.md.ed702657.js
+++ b/assets/notes_css_inline.md.5f3b894b.js
@@ -1 +1 @@
-import{_ as e,o as a,c as t,Q as i}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"行内元素 css","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/inline.md","filePath":"notes/css/inline.md","lastUpdated":1670330848000}'),l={name:"notes/css/inline.md"},n=i('<h1 id="行内元素-css" tabindex="-1">行内元素 css <a class="header-anchor" href="#行内元素-css" aria-label="Permalink to &quot;行内元素 css&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">名词</p><p>line box 行框元素</p><p>inline box 行内元素（内联元素）</p></div><h2 id="vertical-align" tabindex="-1">vertical-align <a class="header-anchor" href="#vertical-align" aria-label="Permalink to &quot;vertical-align&quot;">​</a></h2><blockquote><p>适用 inline inline-block table-cell 元素盒子 box</p></blockquote><h2 id="line-height" tabindex="-1">line-height <a class="header-anchor" href="#line-height" aria-label="Permalink to &quot;line-height&quot;">​</a></h2><blockquote><p>适用 行框内文字 块元素中文字（用来设置文字行之间的间距）</p></blockquote><h3 id="取值" tabindex="-1">取值 <a class="header-anchor" href="#取值" aria-label="Permalink to &quot;取值&quot;">​</a></h3><ul><li>normal</li><li>number 相对于文字的 font-size</li><li>percentage 相对于文字的 font-size</li><li>length 行框内的高度 px/em</li></ul>',8),o=[n];function s(c,r,h,d,_,p){return a(),t("div",null,o)}const m=e(l,[["render",s]]);export{b as __pageData,m as default};
+import{_ as e,o as a,c as t,Q as i}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"行内元素 css","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/inline.md","filePath":"notes/css/inline.md","lastUpdated":1670330848000}'),l={name:"notes/css/inline.md"},n=i('<h1 id="行内元素-css" tabindex="-1">行内元素 css <a class="header-anchor" href="#行内元素-css" aria-label="Permalink to &quot;行内元素 css&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">名词</p><p>line box 行框元素</p><p>inline box 行内元素（内联元素）</p></div><h2 id="vertical-align" tabindex="-1">vertical-align <a class="header-anchor" href="#vertical-align" aria-label="Permalink to &quot;vertical-align&quot;">​</a></h2><blockquote><p>适用 inline inline-block table-cell 元素盒子 box</p></blockquote><h2 id="line-height" tabindex="-1">line-height <a class="header-anchor" href="#line-height" aria-label="Permalink to &quot;line-height&quot;">​</a></h2><blockquote><p>适用 行框内文字 块元素中文字（用来设置文字行之间的间距）</p></blockquote><h3 id="取值" tabindex="-1">取值 <a class="header-anchor" href="#取值" aria-label="Permalink to &quot;取值&quot;">​</a></h3><ul><li>normal</li><li>number 相对于文字的 font-size</li><li>percentage 相对于文字的 font-size</li><li>length 行框内的高度 px/em</li></ul>',8),o=[n];function s(c,r,h,d,_,p){return a(),t("div",null,o)}const m=e(l,[["render",s]]);export{b as __pageData,m as default};
diff --git a/assets/notes_css_inline.md.ed702657.lean.js b/assets/notes_css_inline.md.5f3b894b.lean.js
similarity index 70%
rename from assets/notes_css_inline.md.ed702657.lean.js
rename to assets/notes_css_inline.md.5f3b894b.lean.js
index 0d97880..fe5acfe 100644
--- a/assets/notes_css_inline.md.ed702657.lean.js
+++ b/assets/notes_css_inline.md.5f3b894b.lean.js
@@ -1 +1 @@
-import{_ as e,o as a,c as t,Q as i}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"行内元素 css","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/inline.md","filePath":"notes/css/inline.md","lastUpdated":1670330848000}'),l={name:"notes/css/inline.md"},n=i("",8),o=[n];function s(c,r,h,d,_,p){return a(),t("div",null,o)}const m=e(l,[["render",s]]);export{b as __pageData,m as default};
+import{_ as e,o as a,c as t,Q as i}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"行内元素 css","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/inline.md","filePath":"notes/css/inline.md","lastUpdated":1670330848000}'),l={name:"notes/css/inline.md"},n=i("",8),o=[n];function s(c,r,h,d,_,p){return a(),t("div",null,o)}const m=e(l,[["render",s]]);export{b as __pageData,m as default};
diff --git a/assets/notes_css_pseudo.md.65d61dd8.js b/assets/notes_css_pseudo.md.8a522478.js
similarity index 96%
rename from assets/notes_css_pseudo.md.65d61dd8.js
rename to assets/notes_css_pseudo.md.8a522478.js
index 757897a..c3e1de1 100644
--- a/assets/notes_css_pseudo.md.65d61dd8.js
+++ b/assets/notes_css_pseudo.md.8a522478.js
@@ -1 +1 @@
-import{_ as t,o as d,c as r,Q as e}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"伪元素 伪类","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/pseudo.md","filePath":"notes/css/pseudo.md","lastUpdated":1670330848000}'),a={name:"notes/css/pseudo.md"},l=e('<h1 id="伪元素-伪类" tabindex="-1">伪元素 伪类 <a class="header-anchor" href="#伪元素-伪类" aria-label="Permalink to &quot;伪元素 伪类&quot;">​</a></h1><h2 id="伪元素" tabindex="-1">伪元素 <a class="header-anchor" href="#伪元素" aria-label="Permalink to &quot;伪元素&quot;">​</a></h2><p>伪元素是一个附加至选择器末的关键词，允许对被选择元素的特定部分修改样式</p><div class="warning custom-block"><p class="custom-block-title">注意</p><p>一个选择器中只能使用一个伪元素，伪元素必须跟在普通选择器和基础选择器之后；使用双冒号（::）以便区分伪元素（::）伪类（:）</p></div><h3 id="列举" tabindex="-1">列举 <a class="header-anchor" href="#列举" aria-label="Permalink to &quot;列举&quot;">​</a></h3><ul><li>::after</li><li>::before</li><li>::backdrop</li><li>::first-line</li><li>::first-letter</li><li>::cue</li><li>::grammar-error</li><li>::marker</li><li>::placeholder --- input::placeholder</li><li>::selection</li><li>::slotted()</li><li>::spelling-error</li></ul><h2 id="伪类" tabindex="-1">伪类 <a class="header-anchor" href="#伪类" aria-label="Permalink to &quot;伪类&quot;">​</a></h2><p>伪类是添加到选择器的关键词，指定要选择的元素的特殊状态</p><h3 id="列举-1" tabindex="-1">列举 <a class="header-anchor" href="#列举-1" aria-label="Permalink to &quot;列举&quot;">​</a></h3><table><thead><tr><th>伪类</th><th>伪类</th></tr></thead><tbody><tr><td>:active</td><td>:last-child</td></tr><tr><td>:any-link</td><td>:last-of-type</td></tr><tr><td>:blank</td><td>:left</td></tr><tr><td>:checked</td><td>:link</td></tr><tr><td>:current</td><td>:local-link</td></tr><tr><td>:default</td><td>:not()</td></tr><tr><td>:defined</td><td>:nth-child()</td></tr><tr><td>:dir()</td><td>:nth-col()</td></tr><tr><td>:disabled</td><td>:nth-last-child()</td></tr><tr><td>:drop</td><td>:nth-last-col()</td></tr><tr><td>:empty</td><td>:nth-last-of-type()</td></tr><tr><td>:enabled</td><td>:nth-of-type()</td></tr><tr><td>:first</td><td>:only-child</td></tr><tr><td>:first-child</td><td>:only-of-type</td></tr><tr><td>:first-of-type</td><td>:optional</td></tr><tr><td>:fullscreen</td><td>:out-of-range</td></tr><tr><td>:future</td><td>:past</td></tr><tr><td>:focus</td><td>:placeholder-shown</td></tr><tr><td>:focus-visible</td><td>:read-only</td></tr><tr><td>:focus-within</td><td>:read-write</td></tr><tr><td>:has()</td><td>:required</td></tr><tr><td>:host</td><td>:right</td></tr><tr><td>:host()</td><td>:root</td></tr><tr><td>:host-context()</td><td>:scope</td></tr><tr><td>:hover</td><td>:target</td></tr><tr><td>:indeterminate</td><td>:target-within</td></tr><tr><td>:in-range</td><td>:user-invalid</td></tr><tr><td>:invalid</td><td>:valid</td></tr><tr><td>:is()</td><td>:visited</td></tr><tr><td>:lang()</td><td>:where()</td></tr></tbody></table>',10),i=[l];function o(s,n,c,h,p,u){return d(),r("div",null,i)}const b=t(a,[["render",o]]);export{_ as __pageData,b as default};
+import{_ as t,o as d,c as r,Q as e}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"伪元素 伪类","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/pseudo.md","filePath":"notes/css/pseudo.md","lastUpdated":1670330848000}'),a={name:"notes/css/pseudo.md"},l=e('<h1 id="伪元素-伪类" tabindex="-1">伪元素 伪类 <a class="header-anchor" href="#伪元素-伪类" aria-label="Permalink to &quot;伪元素 伪类&quot;">​</a></h1><h2 id="伪元素" tabindex="-1">伪元素 <a class="header-anchor" href="#伪元素" aria-label="Permalink to &quot;伪元素&quot;">​</a></h2><p>伪元素是一个附加至选择器末的关键词，允许对被选择元素的特定部分修改样式</p><div class="warning custom-block"><p class="custom-block-title">注意</p><p>一个选择器中只能使用一个伪元素，伪元素必须跟在普通选择器和基础选择器之后；使用双冒号（::）以便区分伪元素（::）伪类（:）</p></div><h3 id="列举" tabindex="-1">列举 <a class="header-anchor" href="#列举" aria-label="Permalink to &quot;列举&quot;">​</a></h3><ul><li>::after</li><li>::before</li><li>::backdrop</li><li>::first-line</li><li>::first-letter</li><li>::cue</li><li>::grammar-error</li><li>::marker</li><li>::placeholder --- input::placeholder</li><li>::selection</li><li>::slotted()</li><li>::spelling-error</li></ul><h2 id="伪类" tabindex="-1">伪类 <a class="header-anchor" href="#伪类" aria-label="Permalink to &quot;伪类&quot;">​</a></h2><p>伪类是添加到选择器的关键词，指定要选择的元素的特殊状态</p><h3 id="列举-1" tabindex="-1">列举 <a class="header-anchor" href="#列举-1" aria-label="Permalink to &quot;列举&quot;">​</a></h3><table><thead><tr><th>伪类</th><th>伪类</th></tr></thead><tbody><tr><td>:active</td><td>:last-child</td></tr><tr><td>:any-link</td><td>:last-of-type</td></tr><tr><td>:blank</td><td>:left</td></tr><tr><td>:checked</td><td>:link</td></tr><tr><td>:current</td><td>:local-link</td></tr><tr><td>:default</td><td>:not()</td></tr><tr><td>:defined</td><td>:nth-child()</td></tr><tr><td>:dir()</td><td>:nth-col()</td></tr><tr><td>:disabled</td><td>:nth-last-child()</td></tr><tr><td>:drop</td><td>:nth-last-col()</td></tr><tr><td>:empty</td><td>:nth-last-of-type()</td></tr><tr><td>:enabled</td><td>:nth-of-type()</td></tr><tr><td>:first</td><td>:only-child</td></tr><tr><td>:first-child</td><td>:only-of-type</td></tr><tr><td>:first-of-type</td><td>:optional</td></tr><tr><td>:fullscreen</td><td>:out-of-range</td></tr><tr><td>:future</td><td>:past</td></tr><tr><td>:focus</td><td>:placeholder-shown</td></tr><tr><td>:focus-visible</td><td>:read-only</td></tr><tr><td>:focus-within</td><td>:read-write</td></tr><tr><td>:has()</td><td>:required</td></tr><tr><td>:host</td><td>:right</td></tr><tr><td>:host()</td><td>:root</td></tr><tr><td>:host-context()</td><td>:scope</td></tr><tr><td>:hover</td><td>:target</td></tr><tr><td>:indeterminate</td><td>:target-within</td></tr><tr><td>:in-range</td><td>:user-invalid</td></tr><tr><td>:invalid</td><td>:valid</td></tr><tr><td>:is()</td><td>:visited</td></tr><tr><td>:lang()</td><td>:where()</td></tr></tbody></table>',10),i=[l];function o(s,n,c,h,p,u){return d(),r("div",null,i)}const b=t(a,[["render",o]]);export{_ as __pageData,b as default};
diff --git a/assets/notes_css_pseudo.md.65d61dd8.lean.js b/assets/notes_css_pseudo.md.8a522478.lean.js
similarity index 70%
rename from assets/notes_css_pseudo.md.65d61dd8.lean.js
rename to assets/notes_css_pseudo.md.8a522478.lean.js
index 8e2ae3e..688e485 100644
--- a/assets/notes_css_pseudo.md.65d61dd8.lean.js
+++ b/assets/notes_css_pseudo.md.8a522478.lean.js
@@ -1 +1 @@
-import{_ as t,o as d,c as r,Q as e}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"伪元素 伪类","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/pseudo.md","filePath":"notes/css/pseudo.md","lastUpdated":1670330848000}'),a={name:"notes/css/pseudo.md"},l=e("",10),i=[l];function o(s,n,c,h,p,u){return d(),r("div",null,i)}const b=t(a,[["render",o]]);export{_ as __pageData,b as default};
+import{_ as t,o as d,c as r,Q as e}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"伪元素 伪类","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/pseudo.md","filePath":"notes/css/pseudo.md","lastUpdated":1670330848000}'),a={name:"notes/css/pseudo.md"},l=e("",10),i=[l];function o(s,n,c,h,p,u){return d(),r("div",null,i)}const b=t(a,[["render",o]]);export{_ as __pageData,b as default};
diff --git a/assets/notes_css_replaced.md.ceaac847.js b/assets/notes_css_replaced.md.3cd3cdf4.js
similarity index 96%
rename from assets/notes_css_replaced.md.ceaac847.js
rename to assets/notes_css_replaced.md.3cd3cdf4.js
index 4972c31..326c3bd 100644
--- a/assets/notes_css_replaced.md.ceaac847.js
+++ b/assets/notes_css_replaced.md.3cd3cdf4.js
@@ -1 +1 @@
-import{_ as e,o as l,c as t,Q as a}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"可替换元素","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/replaced.md","filePath":"notes/css/replaced.md","lastUpdated":1670330848000}'),i={name:"notes/css/replaced.md"},o=a('<h1 id="可替换元素" tabindex="-1">可替换元素 <a class="header-anchor" href="#可替换元素" aria-label="Permalink to &quot;可替换元素&quot;">​</a></h1><p>replaced element / none-replaced element</p><h2 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h2><ul><li>在 CSS 中，替换元素是表示形式超出 CSS 范围的元素，他们是外部对象，独立于 CSS 格式模型</li><li>CSS 可影响可替换元素的位置，不会影响到可替换元素自身的内容</li><li>某些替换元素具有固有尺寸或定义的基线，只有可替换的元素才能具有固有尺寸</li></ul><h2 id="替换元素" tabindex="-1">替换元素 <a class="header-anchor" href="#替换元素" aria-label="Permalink to &quot;替换元素&quot;">​</a></h2><ul><li>iframe</li><li>video</li><li>embed</li><li>img</li></ul><p>某些特殊情况下，以下元素也可以是替换元素</p><ul><li>opiton</li><li>audio</li><li>canvas</li><li>object</li><li>applet</li><li>input type=image</li></ul><h2 id="content-属性" tabindex="-1">content 属性 <a class="header-anchor" href="#content-属性" aria-label="Permalink to &quot;content 属性&quot;">​</a></h2><blockquote><p>content 属性应用在元素的 ::before 和 ::after 伪元素中插入内容</p></blockquote><h3 id="取值" tabindex="-1">取值 <a class="header-anchor" href="#取值" aria-label="Permalink to &quot;取值&quot;">​</a></h3><ul><li>normal 默认值</li><li>none 不产生伪类元素</li><li>string 文本内容</li><li>url</li><li>counter/counters 计数/嵌套计数</li><li>attr 显示元素属性内容</li><li>open-quote close-quote 增加去除引号</li><li>no-open-quote no-close-quote 不产生任何内容（会改变引号层级）</li></ul><h3 id="counter-counters" tabindex="-1">counter/counters <a class="header-anchor" href="#counter-counters" aria-label="Permalink to &quot;counter/counters&quot;">​</a></h3><blockquote><p>嵌套计数器，返回表示指定计数器当前值的拼接字符串</p></blockquote><ul><li>两种形式 <ul><li>counters(name, string)</li><li>counters(name, string, style)</li></ul></li><li>通常与伪元素搭配使用 content 属性，理论上支持属性值为 string 的任何地方</li><li>生成的文本是具有给定名称的所有计数器的值，从最外层到最内层，之间由指定字符串分隔</li><li>style 默认为十进制（upper-roman, lower-roman, decimal-leading-zero, lower-alpha)</li></ul><h2 id="list-style-属性" tabindex="-1">list-style 属性 <a class="header-anchor" href="#list-style-属性" aria-label="Permalink to &quot;list-style 属性&quot;">​</a></h2><blockquote><p>symbols 函数</p></blockquote>',17),n=[o];function r(c,s,u,d,h,p){return l(),t("div",null,n)}const b=e(i,[["render",r]]);export{_ as __pageData,b as default};
+import{_ as e,o as l,c as t,Q as a}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"可替换元素","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/replaced.md","filePath":"notes/css/replaced.md","lastUpdated":1670330848000}'),i={name:"notes/css/replaced.md"},o=a('<h1 id="可替换元素" tabindex="-1">可替换元素 <a class="header-anchor" href="#可替换元素" aria-label="Permalink to &quot;可替换元素&quot;">​</a></h1><p>replaced element / none-replaced element</p><h2 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h2><ul><li>在 CSS 中，替换元素是表示形式超出 CSS 范围的元素，他们是外部对象，独立于 CSS 格式模型</li><li>CSS 可影响可替换元素的位置，不会影响到可替换元素自身的内容</li><li>某些替换元素具有固有尺寸或定义的基线，只有可替换的元素才能具有固有尺寸</li></ul><h2 id="替换元素" tabindex="-1">替换元素 <a class="header-anchor" href="#替换元素" aria-label="Permalink to &quot;替换元素&quot;">​</a></h2><ul><li>iframe</li><li>video</li><li>embed</li><li>img</li></ul><p>某些特殊情况下，以下元素也可以是替换元素</p><ul><li>opiton</li><li>audio</li><li>canvas</li><li>object</li><li>applet</li><li>input type=image</li></ul><h2 id="content-属性" tabindex="-1">content 属性 <a class="header-anchor" href="#content-属性" aria-label="Permalink to &quot;content 属性&quot;">​</a></h2><blockquote><p>content 属性应用在元素的 ::before 和 ::after 伪元素中插入内容</p></blockquote><h3 id="取值" tabindex="-1">取值 <a class="header-anchor" href="#取值" aria-label="Permalink to &quot;取值&quot;">​</a></h3><ul><li>normal 默认值</li><li>none 不产生伪类元素</li><li>string 文本内容</li><li>url</li><li>counter/counters 计数/嵌套计数</li><li>attr 显示元素属性内容</li><li>open-quote close-quote 增加去除引号</li><li>no-open-quote no-close-quote 不产生任何内容（会改变引号层级）</li></ul><h3 id="counter-counters" tabindex="-1">counter/counters <a class="header-anchor" href="#counter-counters" aria-label="Permalink to &quot;counter/counters&quot;">​</a></h3><blockquote><p>嵌套计数器，返回表示指定计数器当前值的拼接字符串</p></blockquote><ul><li>两种形式 <ul><li>counters(name, string)</li><li>counters(name, string, style)</li></ul></li><li>通常与伪元素搭配使用 content 属性，理论上支持属性值为 string 的任何地方</li><li>生成的文本是具有给定名称的所有计数器的值，从最外层到最内层，之间由指定字符串分隔</li><li>style 默认为十进制（upper-roman, lower-roman, decimal-leading-zero, lower-alpha)</li></ul><h2 id="list-style-属性" tabindex="-1">list-style 属性 <a class="header-anchor" href="#list-style-属性" aria-label="Permalink to &quot;list-style 属性&quot;">​</a></h2><blockquote><p>symbols 函数</p></blockquote>',17),n=[o];function r(c,s,u,d,h,p){return l(),t("div",null,n)}const b=e(i,[["render",r]]);export{_ as __pageData,b as default};
diff --git a/assets/notes_css_replaced.md.ceaac847.lean.js b/assets/notes_css_replaced.md.3cd3cdf4.lean.js
similarity index 70%
rename from assets/notes_css_replaced.md.ceaac847.lean.js
rename to assets/notes_css_replaced.md.3cd3cdf4.lean.js
index 12bb123..c715c0b 100644
--- a/assets/notes_css_replaced.md.ceaac847.lean.js
+++ b/assets/notes_css_replaced.md.3cd3cdf4.lean.js
@@ -1 +1 @@
-import{_ as e,o as l,c as t,Q as a}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"可替换元素","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/replaced.md","filePath":"notes/css/replaced.md","lastUpdated":1670330848000}'),i={name:"notes/css/replaced.md"},o=a("",17),n=[o];function r(c,s,u,d,h,p){return l(),t("div",null,n)}const b=e(i,[["render",r]]);export{_ as __pageData,b as default};
+import{_ as e,o as l,c as t,Q as a}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"可替换元素","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/replaced.md","filePath":"notes/css/replaced.md","lastUpdated":1670330848000}'),i={name:"notes/css/replaced.md"},o=a("",17),n=[o];function r(c,s,u,d,h,p){return l(),t("div",null,n)}const b=e(i,[["render",r]]);export{_ as __pageData,b as default};
diff --git a/assets/notes_css_text-character.md.ab74a92c.js b/assets/notes_css_text-character.md.567549b3.js
similarity index 99%
rename from assets/notes_css_text-character.md.ab74a92c.js
rename to assets/notes_css_text-character.md.567549b3.js
index 42666db..6302080 100644
--- a/assets/notes_css_text-character.md.ab74a92c.js
+++ b/assets/notes_css_text-character.md.567549b3.js
@@ -1,4 +1,4 @@
-import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.7c0fadea.js";const d=JSON.parse('{"title":"文字特性","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/text-character.md","filePath":"notes/css/text-character.md","lastUpdated":1670330848000}'),p={name:"notes/css/text-character.md"},o=n(`<h1 id="文字特性" tabindex="-1">文字特性 <a class="header-anchor" href="#文字特性" aria-label="Permalink to &quot;文字特性&quot;">​</a></h1><p><strong>文字特性的 html 标签元素：a, li, img, span, ~~~</strong></p><div class="tip custom-block"><p class="custom-block-title">扩展</p><p>html 标签设置成 display: inline-block; 元素存在间隙</p><ol><li>display: inline; 行内元素，设置高度无效；</li><li>display: block; 块级元素，设置高度有效；</li><li>display: inline-block; 行内块级元素，设置高度有效</li></ol></div><h2 id="例子" tabindex="-1">例子 <a class="header-anchor" href="#例子" aria-label="Permalink to &quot;例子&quot;">​</a></h2><ul class="tc-ul"><li class="tc-item">1</li><li class="tc-item">2</li><li class="tc-item">3</li></ul><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">ul</span><span style="color:#E1E4E8;">&gt;</span></span>
+import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.0e8ae64e.js";const d=JSON.parse('{"title":"文字特性","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/text-character.md","filePath":"notes/css/text-character.md","lastUpdated":1670330848000}'),p={name:"notes/css/text-character.md"},o=n(`<h1 id="文字特性" tabindex="-1">文字特性 <a class="header-anchor" href="#文字特性" aria-label="Permalink to &quot;文字特性&quot;">​</a></h1><p><strong>文字特性的 html 标签元素：a, li, img, span, ~~~</strong></p><div class="tip custom-block"><p class="custom-block-title">扩展</p><p>html 标签设置成 display: inline-block; 元素存在间隙</p><ol><li>display: inline; 行内元素，设置高度无效；</li><li>display: block; 块级元素，设置高度有效；</li><li>display: inline-block; 行内块级元素，设置高度有效</li></ol></div><h2 id="例子" tabindex="-1">例子 <a class="header-anchor" href="#例子" aria-label="Permalink to &quot;例子&quot;">​</a></h2><ul class="tc-ul"><li class="tc-item">1</li><li class="tc-item">2</li><li class="tc-item">3</li></ul><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">ul</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;1&lt;/</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;2&lt;/</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;3&lt;/</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;</span></span>
diff --git a/assets/notes_css_text-character.md.ab74a92c.lean.js b/assets/notes_css_text-character.md.567549b3.lean.js
similarity index 71%
rename from assets/notes_css_text-character.md.ab74a92c.lean.js
rename to assets/notes_css_text-character.md.567549b3.lean.js
index 7bcdf86..aaea3ee 100644
--- a/assets/notes_css_text-character.md.ab74a92c.lean.js
+++ b/assets/notes_css_text-character.md.567549b3.lean.js
@@ -1 +1 @@
-import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.7c0fadea.js";const d=JSON.parse('{"title":"文字特性","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/text-character.md","filePath":"notes/css/text-character.md","lastUpdated":1670330848000}'),p={name:"notes/css/text-character.md"},o=n("",33),t=[o];function e(c,E,r,y,i,u){return l(),a("div",null,t)}const F=s(p,[["render",e]]);export{d as __pageData,F as default};
+import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.0e8ae64e.js";const d=JSON.parse('{"title":"文字特性","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/text-character.md","filePath":"notes/css/text-character.md","lastUpdated":1670330848000}'),p={name:"notes/css/text-character.md"},o=n("",33),t=[o];function e(c,E,r,y,i,u){return l(),a("div",null,t)}const F=s(p,[["render",e]]);export{d as __pageData,F as default};
diff --git a/assets/notes_css_visibility.md.4ed2886f.js b/assets/notes_css_visibility.md.36af78c5.js
similarity index 97%
rename from assets/notes_css_visibility.md.4ed2886f.js
rename to assets/notes_css_visibility.md.36af78c5.js
index 5fa8d77..03ad866 100644
--- a/assets/notes_css_visibility.md.4ed2886f.js
+++ b/assets/notes_css_visibility.md.36af78c5.js
@@ -1,4 +1,4 @@
-import{_ as a,o as l,c as s,Q as i}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"visibility","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/visibility.md","filePath":"notes/css/visibility.md","lastUpdated":1670330848000}'),n={name:"notes/css/visibility.md"},t=i(`<h1 id="visibility" tabindex="-1">visibility <a class="header-anchor" href="#visibility" aria-label="Permalink to &quot;visibility&quot;">​</a></h1><p>css 中控制显示隐藏的属性</p><h2 id="display" tabindex="-1">display <a class="header-anchor" href="#display" aria-label="Permalink to &quot;display&quot;">​</a></h2><ul><li>none/block</li></ul><ul><li>控制元素的显隐，破坏渲染状态（代价比较高）；none 独立文档之外，不占空间大小</li></ul><h2 id="visibility-1" tabindex="-1">visibility <a class="header-anchor" href="#visibility-1" aria-label="Permalink to &quot;visibility&quot;">​</a></h2><ul><li>visible/hidden</li></ul><ul><li>隐藏元素并保持自身的渲染状态，dom 事件依然可行，空间大小依然占据（物理上显示空白）</li></ul><h2 id="content-visibility" tabindex="-1">content-visibility <a class="header-anchor" href="#content-visibility" aria-label="Permalink to &quot;content-visibility&quot;">​</a></h2><p>chrome85+ 兼容</p><ul><li>visible/hidden/auto</li></ul><ul><li>跳过屏幕之外的元素，不渲染以达到首次加载渲染速度</li><li>隐藏元素并保持自身的渲染状态，dom 操作、空间大小随着元素的显隐（显示即可操作，隐藏不可操作）</li></ul><ul><li>contain-intrinsic-size 包含固有的大小（当隐藏时仍然保有设置的大小的空间，元素空间显示为空）</li></ul><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">.container</span><span style="color:#E1E4E8;"> {</span></span>
+import{_ as a,o as l,c as s,Q as i}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"visibility","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/visibility.md","filePath":"notes/css/visibility.md","lastUpdated":1670330848000}'),n={name:"notes/css/visibility.md"},t=i(`<h1 id="visibility" tabindex="-1">visibility <a class="header-anchor" href="#visibility" aria-label="Permalink to &quot;visibility&quot;">​</a></h1><p>css 中控制显示隐藏的属性</p><h2 id="display" tabindex="-1">display <a class="header-anchor" href="#display" aria-label="Permalink to &quot;display&quot;">​</a></h2><ul><li>none/block</li></ul><ul><li>控制元素的显隐，破坏渲染状态（代价比较高）；none 独立文档之外，不占空间大小</li></ul><h2 id="visibility-1" tabindex="-1">visibility <a class="header-anchor" href="#visibility-1" aria-label="Permalink to &quot;visibility&quot;">​</a></h2><ul><li>visible/hidden</li></ul><ul><li>隐藏元素并保持自身的渲染状态，dom 事件依然可行，空间大小依然占据（物理上显示空白）</li></ul><h2 id="content-visibility" tabindex="-1">content-visibility <a class="header-anchor" href="#content-visibility" aria-label="Permalink to &quot;content-visibility&quot;">​</a></h2><p>chrome85+ 兼容</p><ul><li>visible/hidden/auto</li></ul><ul><li>跳过屏幕之外的元素，不渲染以达到首次加载渲染速度</li><li>隐藏元素并保持自身的渲染状态，dom 操作、空间大小随着元素的显隐（显示即可操作，隐藏不可操作）</li></ul><ul><li>contain-intrinsic-size 包含固有的大小（当隐藏时仍然保有设置的大小的空间，元素空间显示为空）</li></ul><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">.container</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">content-visibility</span><span style="color:#E1E4E8;">: </span><span style="color:#79B8FF;">auto</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">contain-intrinsic-size</span><span style="color:#E1E4E8;">: </span><span style="color:#79B8FF;">0</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">100</span><span style="color:#F97583;">px</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">.container</span><span style="color:#24292E;"> {</span></span>
diff --git a/assets/notes_css_visibility.md.4ed2886f.lean.js b/assets/notes_css_visibility.md.36af78c5.lean.js
similarity index 70%
rename from assets/notes_css_visibility.md.4ed2886f.lean.js
rename to assets/notes_css_visibility.md.36af78c5.lean.js
index 4d7ddb4..1be7336 100644
--- a/assets/notes_css_visibility.md.4ed2886f.lean.js
+++ b/assets/notes_css_visibility.md.36af78c5.lean.js
@@ -1 +1 @@
-import{_ as a,o as l,c as s,Q as i}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"visibility","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/visibility.md","filePath":"notes/css/visibility.md","lastUpdated":1670330848000}'),n={name:"notes/css/visibility.md"},t=i("",32),e=[t];function o(c,p,r,u,d,y){return l(),s("div",null,e)}const E=a(n,[["render",o]]);export{b as __pageData,E as default};
+import{_ as a,o as l,c as s,Q as i}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"visibility","description":"","frontmatter":{},"headers":[],"relativePath":"notes/css/visibility.md","filePath":"notes/css/visibility.md","lastUpdated":1670330848000}'),n={name:"notes/css/visibility.md"},t=i("",32),e=[t];function o(c,p,r,u,d,y){return l(),s("div",null,e)}const E=a(n,[["render",o]]);export{b as __pageData,E as default};
diff --git a/assets/notes_es_es6.md.cb465ca1.js b/assets/notes_es_es6.md.c70b9687.js
similarity index 99%
rename from assets/notes_es_es6.md.cb465ca1.js
rename to assets/notes_es_es6.md.c70b9687.js
index a7f305b..9986551 100644
--- a/assets/notes_es_es6.md.cb465ca1.js
+++ b/assets/notes_es_es6.md.c70b9687.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"ES6","description":"","frontmatter":{},"headers":[],"relativePath":"notes/es/es6.md","filePath":"notes/es/es6.md","lastUpdated":1670330848000}'),p={name:"notes/es/es6.md"},o=l(`<h1 id="es6" tabindex="-1">ES6 <a class="header-anchor" href="#es6" aria-label="Permalink to &quot;ES6&quot;">​</a></h1><div class="warning custom-block"><p class="custom-block-title">注意</p><p>记录一些之前没有注意的地方</p></div><h2 id="let-const" tabindex="-1">let &amp; const <a class="header-anchor" href="#let-const" aria-label="Permalink to &quot;let &amp; const&quot;">​</a></h2><p><strong>1. 暂时行死区</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">typeof</span><span style="color:#E1E4E8;"> x;</span></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"ES6","description":"","frontmatter":{},"headers":[],"relativePath":"notes/es/es6.md","filePath":"notes/es/es6.md","lastUpdated":1670330848000}'),p={name:"notes/es/es6.md"},o=l(`<h1 id="es6" tabindex="-1">ES6 <a class="header-anchor" href="#es6" aria-label="Permalink to &quot;ES6&quot;">​</a></h1><div class="warning custom-block"><p class="custom-block-title">注意</p><p>记录一些之前没有注意的地方</p></div><h2 id="let-const" tabindex="-1">let &amp; const <a class="header-anchor" href="#let-const" aria-label="Permalink to &quot;let &amp; const&quot;">​</a></h2><p><strong>1. 暂时行死区</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">typeof</span><span style="color:#E1E4E8;"> x;</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> x;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">typeof</span><span style="color:#24292E;"> x;</span></span>
 <span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> x;</span></span></code></pre></div><h2 id="解构赋值" tabindex="-1">解构赋值 <a class="header-anchor" href="#解构赋值" aria-label="Permalink to &quot;解构赋值&quot;">​</a></h2><p><strong>1. 数组结构赋值</strong></p><p><code>如果等号左边不是可遍历对象，报错！需要Iterator对象</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 报错</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> [foo] </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">1</span><span style="color:#E1E4E8;">, flase, NaN, undefined, null, {};</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// 报错</span></span>
diff --git a/assets/notes_es_es6.md.cb465ca1.lean.js b/assets/notes_es_es6.md.c70b9687.lean.js
similarity index 68%
rename from assets/notes_es_es6.md.cb465ca1.lean.js
rename to assets/notes_es_es6.md.c70b9687.lean.js
index 4a3ea4e..b257fb5 100644
--- a/assets/notes_es_es6.md.cb465ca1.lean.js
+++ b/assets/notes_es_es6.md.c70b9687.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"ES6","description":"","frontmatter":{},"headers":[],"relativePath":"notes/es/es6.md","filePath":"notes/es/es6.md","lastUpdated":1670330848000}'),p={name:"notes/es/es6.md"},o=l("",71),e=[o];function t(c,r,y,E,i,F){return a(),n("div",null,e)}const D=s(p,[["render",t]]);export{u as __pageData,D as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"ES6","description":"","frontmatter":{},"headers":[],"relativePath":"notes/es/es6.md","filePath":"notes/es/es6.md","lastUpdated":1670330848000}'),p={name:"notes/es/es6.md"},o=l("",71),e=[o];function t(c,r,y,E,i,F){return a(),n("div",null,e)}const D=s(p,[["render",t]]);export{u as __pageData,D as default};
diff --git a/assets/notes_html_esmodule.md.ddda8566.js b/assets/notes_html_esmodule.md.8d06acba.js
similarity index 99%
rename from assets/notes_html_esmodule.md.ddda8566.js
rename to assets/notes_html_esmodule.md.8d06acba.js
index 2ce8d1d..01016c9 100644
--- a/assets/notes_html_esmodule.md.ddda8566.js
+++ b/assets/notes_html_esmodule.md.8d06acba.js
@@ -1,4 +1,4 @@
-import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.7c0fadea.js";const F=JSON.parse('{"title":"浏览器[type=\\"module\\"]","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/esmodule.md","filePath":"notes/html/esmodule.md","lastUpdated":1670330848000}'),p={name:"notes/html/esmodule.md"},o=n(`<h1 id="浏览器-type-module" tabindex="-1">浏览器[type=&quot;module&quot;] <a class="header-anchor" href="#浏览器-type-module" aria-label="Permalink to &quot;浏览器[type=&quot;module&quot;]&quot;">​</a></h1><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><ul><li>Safari 10.1.</li><li>Chrome 61.</li><li>Firefox 60.</li><li>Edge 16.</li></ul><h2 id="基本使用" tabindex="-1">基本使用 <a class="header-anchor" href="#基本使用" aria-label="Permalink to &quot;基本使用&quot;">​</a></h2><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">type</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;module&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
+import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.0e8ae64e.js";const F=JSON.parse('{"title":"浏览器[type=\\"module\\"]","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/esmodule.md","filePath":"notes/html/esmodule.md","lastUpdated":1670330848000}'),p={name:"notes/html/esmodule.md"},o=n(`<h1 id="浏览器-type-module" tabindex="-1">浏览器[type=&quot;module&quot;] <a class="header-anchor" href="#浏览器-type-module" aria-label="Permalink to &quot;浏览器[type=&quot;module&quot;]&quot;">​</a></h1><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><ul><li>Safari 10.1.</li><li>Chrome 61.</li><li>Firefox 60.</li><li>Edge 16.</li></ul><h2 id="基本使用" tabindex="-1">基本使用 <a class="header-anchor" href="#基本使用" aria-label="Permalink to &quot;基本使用&quot;">​</a></h2><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">type</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;module&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> { sayHello } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./utils.mjs&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">sayHello</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;Let us do it!&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">script</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">type</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;module&quot;</span><span style="color:#24292E;">&gt;</span></span>
diff --git a/assets/notes_html_esmodule.md.ddda8566.lean.js b/assets/notes_html_esmodule.md.8d06acba.lean.js
similarity index 71%
rename from assets/notes_html_esmodule.md.ddda8566.lean.js
rename to assets/notes_html_esmodule.md.8d06acba.lean.js
index aabd254..af1855e 100644
--- a/assets/notes_html_esmodule.md.ddda8566.lean.js
+++ b/assets/notes_html_esmodule.md.8d06acba.lean.js
@@ -1 +1 @@
-import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.7c0fadea.js";const F=JSON.parse('{"title":"浏览器[type=\\"module\\"]","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/esmodule.md","filePath":"notes/html/esmodule.md","lastUpdated":1670330848000}'),p={name:"notes/html/esmodule.md"},o=n("",36),t=[o];function e(c,r,E,y,i,u){return l(),a("div",null,t)}const g=s(p,[["render",e]]);export{F as __pageData,g as default};
+import{_ as s,o as l,c as a,Q as n}from"./chunks/framework.0e8ae64e.js";const F=JSON.parse('{"title":"浏览器[type=\\"module\\"]","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/esmodule.md","filePath":"notes/html/esmodule.md","lastUpdated":1670330848000}'),p={name:"notes/html/esmodule.md"},o=n("",36),t=[o];function e(c,r,E,y,i,u){return l(),a("div",null,t)}const g=s(p,[["render",e]]);export{F as __pageData,g as default};
diff --git a/assets/notes_html_seo.md.15c47690.lean.js b/assets/notes_html_seo.md.15c47690.lean.js
deleted file mode 100644
index e85a94d..0000000
--- a/assets/notes_html_seo.md.15c47690.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as s,o as a,c as l,Q as p}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/otherseo.jpg",u=JSON.parse('{"title":"SEO语义化","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/seo.md","filePath":"notes/html/seo.md","lastUpdated":1670379203000}'),n={name:"notes/html/seo.md"},e=p("",44),t=[e];function r(c,i,E,h,d,y){return a(),l("div",null,t)}const b=s(n,[["render",r]]);export{u as __pageData,b as default};
diff --git a/assets/notes_html_seo.md.15c47690.js b/assets/notes_html_seo.md.17a408c9.js
similarity index 67%
rename from assets/notes_html_seo.md.15c47690.js
rename to assets/notes_html_seo.md.17a408c9.js
index 58f467c..dd676b0 100644
--- a/assets/notes_html_seo.md.15c47690.js
+++ b/assets/notes_html_seo.md.17a408c9.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as l,Q as p}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/otherseo.jpg",u=JSON.parse('{"title":"SEO语义化","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/seo.md","filePath":"notes/html/seo.md","lastUpdated":1670379203000}'),n={name:"notes/html/seo.md"},e=p(`<h1 id="seo语义化" tabindex="-1">SEO语义化 <a class="header-anchor" href="#seo语义化" aria-label="Permalink to &quot;SEO语义化&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">HTML语义</p><p>HTML语义化标签你知道多少</p><p>开发中正确使用SEO优化</p></div><h2 id="aside" tabindex="-1">aside <a class="header-anchor" href="#aside" aria-label="Permalink to &quot;aside&quot;">​</a></h2><p>左侧侧边栏</p><h2 id="article" tabindex="-1">article <a class="header-anchor" href="#article" aria-label="Permalink to &quot;article&quot;">​</a></h2><p>文章</p><h2 id="hgroup-h1-h2" tabindex="-1">hgroup h1 h2 <a class="header-anchor" href="#hgroup-h1-h2" aria-label="Permalink to &quot;hgroup h1 h2&quot;">​</a></h2><p>hgroup 是标题组 h1 ~ h6 分别为一级标题 二级标题 ...</p><h2 id="abbr" tabindex="-1">abbr <a class="header-anchor" href="#abbr" aria-label="Permalink to &quot;abbr&quot;">​</a></h2><p>缩写</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">abbr</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">title</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;World Wide Web&quot;</span><span style="color:#E1E4E8;">&gt;WWW&lt;/</span><span style="color:#85E89D;">abbr</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">abbr</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">title</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;World Wide Web&quot;</span><span style="color:#24292E;">&gt;WWW&lt;/</span><span style="color:#22863A;">abbr</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h2 id="hr" tabindex="-1">hr <a class="header-anchor" href="#hr" aria-label="Permalink to &quot;hr&quot;">​</a></h2><p>下划线</p><h2 id="p" tabindex="-1">p <a class="header-anchor" href="#p" aria-label="Permalink to &quot;p&quot;">​</a></h2><p>段落标签</p><h2 id="strong" tabindex="-1">strong <a class="header-anchor" href="#strong" aria-label="Permalink to &quot;strong&quot;">​</a></h2><p>强调</p><h2 id="blockquote-q-cite" tabindex="-1">blockquote q cite <a class="header-anchor" href="#blockquote-q-cite" aria-label="Permalink to &quot;blockquote q cite&quot;">​</a></h2><p>引用</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">blockquote</span><span style="color:#E1E4E8;">&gt;What Apple?（段落引述内容）&lt;/</span><span style="color:#85E89D;">blockquote</span><span style="color:#E1E4E8;">&gt;</span></span>
+import{_ as s,o as a,c as l,Q as p}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/otherseo.jpg",u=JSON.parse('{"title":"SEO语义化","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/seo.md","filePath":"notes/html/seo.md","lastUpdated":1670379203000}'),n={name:"notes/html/seo.md"},e=p(`<h1 id="seo语义化" tabindex="-1">SEO语义化 <a class="header-anchor" href="#seo语义化" aria-label="Permalink to &quot;SEO语义化&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">HTML语义</p><p>HTML语义化标签你知道多少</p><p>开发中正确使用SEO优化</p></div><h2 id="aside" tabindex="-1">aside <a class="header-anchor" href="#aside" aria-label="Permalink to &quot;aside&quot;">​</a></h2><p>左侧侧边栏</p><h2 id="article" tabindex="-1">article <a class="header-anchor" href="#article" aria-label="Permalink to &quot;article&quot;">​</a></h2><p>文章</p><h2 id="hgroup-h1-h2" tabindex="-1">hgroup h1 h2 <a class="header-anchor" href="#hgroup-h1-h2" aria-label="Permalink to &quot;hgroup h1 h2&quot;">​</a></h2><p>hgroup 是标题组 h1 ~ h6 分别为一级标题 二级标题 ...</p><h2 id="abbr" tabindex="-1">abbr <a class="header-anchor" href="#abbr" aria-label="Permalink to &quot;abbr&quot;">​</a></h2><p>缩写</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">abbr</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">title</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;World Wide Web&quot;</span><span style="color:#E1E4E8;">&gt;WWW&lt;/</span><span style="color:#85E89D;">abbr</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">abbr</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">title</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;World Wide Web&quot;</span><span style="color:#24292E;">&gt;WWW&lt;/</span><span style="color:#22863A;">abbr</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h2 id="hr" tabindex="-1">hr <a class="header-anchor" href="#hr" aria-label="Permalink to &quot;hr&quot;">​</a></h2><p>下划线</p><h2 id="p" tabindex="-1">p <a class="header-anchor" href="#p" aria-label="Permalink to &quot;p&quot;">​</a></h2><p>段落标签</p><h2 id="strong" tabindex="-1">strong <a class="header-anchor" href="#strong" aria-label="Permalink to &quot;strong&quot;">​</a></h2><p>强调</p><h2 id="blockquote-q-cite" tabindex="-1">blockquote q cite <a class="header-anchor" href="#blockquote-q-cite" aria-label="Permalink to &quot;blockquote q cite&quot;">​</a></h2><p>引用</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">blockquote</span><span style="color:#E1E4E8;">&gt;What Apple?（段落引述内容）&lt;/</span><span style="color:#85E89D;">blockquote</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">q</span><span style="color:#E1E4E8;">&gt;What Apple?（行内引述内容）&lt;/</span><span style="color:#85E89D;">q</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">cite</span><span style="color:#E1E4E8;">&gt;What Apple?（引述作品名）&lt;/</span><span style="color:#85E89D;">cite</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">blockquote</span><span style="color:#24292E;">&gt;What Apple?（段落引述内容）&lt;/</span><span style="color:#22863A;">blockquote</span><span style="color:#24292E;">&gt;</span></span>
 <span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">q</span><span style="color:#24292E;">&gt;What Apple?（行内引述内容）&lt;/</span><span style="color:#22863A;">q</span><span style="color:#24292E;">&gt;</span></span>
diff --git a/assets/notes_html_seo.md.17a408c9.lean.js b/assets/notes_html_seo.md.17a408c9.lean.js
new file mode 100644
index 0000000..71e0d82
--- /dev/null
+++ b/assets/notes_html_seo.md.17a408c9.lean.js
@@ -0,0 +1 @@
+import{_ as s,o as a,c as l,Q as p}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/otherseo.jpg",u=JSON.parse('{"title":"SEO语义化","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/seo.md","filePath":"notes/html/seo.md","lastUpdated":1670379203000}'),n={name:"notes/html/seo.md"},e=p("",44),t=[e];function r(c,i,E,h,d,y){return a(),l("div",null,t)}const b=s(n,[["render",r]]);export{u as __pageData,b as default};
diff --git a/assets/notes_html_unusual.md.a78f96eb.js b/assets/notes_html_unusual.md.76389d1b.js
similarity index 91%
rename from assets/notes_html_unusual.md.a78f96eb.js
rename to assets/notes_html_unusual.md.76389d1b.js
index b9b5c91..5c7080a 100644
--- a/assets/notes_html_unusual.md.a78f96eb.js
+++ b/assets/notes_html_unusual.md.76389d1b.js
@@ -1 +1 @@
-import{_ as t,o as e,c as l,Q as a}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"你不知道的 HTML 标签","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/unusual.md","filePath":"notes/html/unusual.md","lastUpdated":1670330848000}'),i={name:"notes/html/unusual.md"},n=a('<h1 id="你不知道的-html-标签" tabindex="-1">你不知道的 HTML 标签 <a class="header-anchor" href="#你不知道的-html-标签" aria-label="Permalink to &quot;你不知道的 HTML 标签&quot;">​</a></h1><h2 id="meta" tabindex="-1">meta <a class="header-anchor" href="#meta" aria-label="Permalink to &quot;meta&quot;">​</a></h2><ul><li>charset 指定编码集</li><li>http-equiv 为 content 属性值提供 HTTP header <ul><li>content-security-policy 定义内容策略，指定允许的服务器元和脚本端点，有助于跨站点脚本共计</li><li>content-type 内容格式 text/html</li><li>default-style 设置默认css样式表集的名称</li><li>refresh 过几秒刷新跳转 content=&quot;秒数;url=xxx&quot;</li><li>x-ua-compatible 如果指定 content 属性值必须有 IE=edge</li></ul></li><li>name <ul><li>application-name 页面应用名</li><li>author 页面作者</li><li>description 页面描述</li><li>generator</li><li>keywords 关键字</li><li>viewport 视口</li></ul></li><li>content 为 http-equiv 属性和 name 属性提供值</li></ul>',3),o=[n];function r(s,c,u,h,_,d){return e(),l("div",null,o)}const f=t(i,[["render",r]]);export{p as __pageData,f as default};
+import{_ as t,o as e,c as l,Q as a}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"你不知道的 HTML 标签","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/unusual.md","filePath":"notes/html/unusual.md","lastUpdated":1670330848000}'),i={name:"notes/html/unusual.md"},n=a('<h1 id="你不知道的-html-标签" tabindex="-1">你不知道的 HTML 标签 <a class="header-anchor" href="#你不知道的-html-标签" aria-label="Permalink to &quot;你不知道的 HTML 标签&quot;">​</a></h1><h2 id="meta" tabindex="-1">meta <a class="header-anchor" href="#meta" aria-label="Permalink to &quot;meta&quot;">​</a></h2><ul><li>charset 指定编码集</li><li>http-equiv 为 content 属性值提供 HTTP header <ul><li>content-security-policy 定义内容策略，指定允许的服务器元和脚本端点，有助于跨站点脚本共计</li><li>content-type 内容格式 text/html</li><li>default-style 设置默认css样式表集的名称</li><li>refresh 过几秒刷新跳转 content=&quot;秒数;url=xxx&quot;</li><li>x-ua-compatible 如果指定 content 属性值必须有 IE=edge</li></ul></li><li>name <ul><li>application-name 页面应用名</li><li>author 页面作者</li><li>description 页面描述</li><li>generator</li><li>keywords 关键字</li><li>viewport 视口</li></ul></li><li>content 为 http-equiv 属性和 name 属性提供值</li></ul>',3),o=[n];function r(s,c,u,h,_,d){return e(),l("div",null,o)}const f=t(i,[["render",r]]);export{p as __pageData,f as default};
diff --git a/assets/notes_html_unusual.md.a78f96eb.lean.js b/assets/notes_html_unusual.md.76389d1b.lean.js
similarity index 71%
rename from assets/notes_html_unusual.md.a78f96eb.lean.js
rename to assets/notes_html_unusual.md.76389d1b.lean.js
index e2bf0a3..6411236 100644
--- a/assets/notes_html_unusual.md.a78f96eb.lean.js
+++ b/assets/notes_html_unusual.md.76389d1b.lean.js
@@ -1 +1 @@
-import{_ as t,o as e,c as l,Q as a}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"你不知道的 HTML 标签","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/unusual.md","filePath":"notes/html/unusual.md","lastUpdated":1670330848000}'),i={name:"notes/html/unusual.md"},n=a("",3),o=[n];function r(s,c,u,h,_,d){return e(),l("div",null,o)}const f=t(i,[["render",r]]);export{p as __pageData,f as default};
+import{_ as t,o as e,c as l,Q as a}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"你不知道的 HTML 标签","description":"","frontmatter":{},"headers":[],"relativePath":"notes/html/unusual.md","filePath":"notes/html/unusual.md","lastUpdated":1670330848000}'),i={name:"notes/html/unusual.md"},n=a("",3),o=[n];function r(s,c,u,h,_,d){return e(),l("div",null,o)}const f=t(i,[["render",r]]);export{p as __pageData,f as default};
diff --git a/assets/notes_index.md.778f192c.js b/assets/notes_index.md.0f4dfe42.js
similarity index 91%
rename from assets/notes_index.md.778f192c.js
rename to assets/notes_index.md.0f4dfe42.js
index 71abc57..f607c43 100644
--- a/assets/notes_index.md.778f192c.js
+++ b/assets/notes_index.md.0f4dfe42.js
@@ -1 +1 @@
-import{_ as t,o as a,c as s,k as e,a as o}from"./chunks/framework.7c0fadea.js";const x=JSON.parse('{"title":"JUST DO IT","description":"","frontmatter":{},"headers":[],"relativePath":"notes/index.md","filePath":"notes/index.md","lastUpdated":1670330848000}'),n={name:"notes/index.md"},c=e("h1",{id:"just-do-it",tabindex:"-1"},[o("JUST DO IT "),e("a",{class:"header-anchor",href:"#just-do-it","aria-label":'Permalink to "JUST DO IT"'},"​")],-1),d=e("div",{class:"tip custom-block"},[e("p",{class:"custom-block-title"},"专注"),e("p",null,"👊 记录前端的点点滴滴，持续成长，持续学习")],-1),i=[c,d];function r(l,_,p,m,h,u){return a(),s("div",null,i)}const T=t(n,[["render",r]]);export{x as __pageData,T as default};
+import{_ as t,o as a,c as s,k as e,a as o}from"./chunks/framework.0e8ae64e.js";const x=JSON.parse('{"title":"JUST DO IT","description":"","frontmatter":{},"headers":[],"relativePath":"notes/index.md","filePath":"notes/index.md","lastUpdated":1670330848000}'),n={name:"notes/index.md"},c=e("h1",{id:"just-do-it",tabindex:"-1"},[o("JUST DO IT "),e("a",{class:"header-anchor",href:"#just-do-it","aria-label":'Permalink to "JUST DO IT"'},"​")],-1),d=e("div",{class:"tip custom-block"},[e("p",{class:"custom-block-title"},"专注"),e("p",null,"👊 记录前端的点点滴滴，持续成长，持续学习")],-1),i=[c,d];function r(l,_,p,m,h,u){return a(),s("div",null,i)}const T=t(n,[["render",r]]);export{x as __pageData,T as default};
diff --git a/assets/notes_index.md.778f192c.lean.js b/assets/notes_index.md.0f4dfe42.lean.js
similarity index 91%
rename from assets/notes_index.md.778f192c.lean.js
rename to assets/notes_index.md.0f4dfe42.lean.js
index 71abc57..f607c43 100644
--- a/assets/notes_index.md.778f192c.lean.js
+++ b/assets/notes_index.md.0f4dfe42.lean.js
@@ -1 +1 @@
-import{_ as t,o as a,c as s,k as e,a as o}from"./chunks/framework.7c0fadea.js";const x=JSON.parse('{"title":"JUST DO IT","description":"","frontmatter":{},"headers":[],"relativePath":"notes/index.md","filePath":"notes/index.md","lastUpdated":1670330848000}'),n={name:"notes/index.md"},c=e("h1",{id:"just-do-it",tabindex:"-1"},[o("JUST DO IT "),e("a",{class:"header-anchor",href:"#just-do-it","aria-label":'Permalink to "JUST DO IT"'},"​")],-1),d=e("div",{class:"tip custom-block"},[e("p",{class:"custom-block-title"},"专注"),e("p",null,"👊 记录前端的点点滴滴，持续成长，持续学习")],-1),i=[c,d];function r(l,_,p,m,h,u){return a(),s("div",null,i)}const T=t(n,[["render",r]]);export{x as __pageData,T as default};
+import{_ as t,o as a,c as s,k as e,a as o}from"./chunks/framework.0e8ae64e.js";const x=JSON.parse('{"title":"JUST DO IT","description":"","frontmatter":{},"headers":[],"relativePath":"notes/index.md","filePath":"notes/index.md","lastUpdated":1670330848000}'),n={name:"notes/index.md"},c=e("h1",{id:"just-do-it",tabindex:"-1"},[o("JUST DO IT "),e("a",{class:"header-anchor",href:"#just-do-it","aria-label":'Permalink to "JUST DO IT"'},"​")],-1),d=e("div",{class:"tip custom-block"},[e("p",{class:"custom-block-title"},"专注"),e("p",null,"👊 记录前端的点点滴滴，持续成长，持续学习")],-1),i=[c,d];function r(l,_,p,m,h,u){return a(),s("div",null,i)}const T=t(n,[["render",r]]);export{x as __pageData,T as default};
diff --git a/assets/notes_javascript_URI.md.aa38219c.js b/assets/notes_javascript_URI.md.0675aa7b.js
similarity index 93%
rename from assets/notes_javascript_URI.md.aa38219c.js
rename to assets/notes_javascript_URI.md.0675aa7b.js
index 71ebb59..14e6e46 100644
--- a/assets/notes_javascript_URI.md.aa38219c.js
+++ b/assets/notes_javascript_URI.md.0675aa7b.js
@@ -1 +1 @@
-import{_ as e,o as a,c as o,Q as t}from"./chunks/framework.7c0fadea.js";const I=JSON.parse('{"title":"URI 编码","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/URI.md","filePath":"notes/javascript/URI.md","lastUpdated":1670330848000}'),c={name:"notes/javascript/URI.md"},n=t('<h1 id="uri-编码" tabindex="-1">URI 编码 <a class="header-anchor" href="#uri-编码" aria-label="Permalink to &quot;URI 编码&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">URI 编码</p><p>URI 方法能对所有的 Unicode 码进行编码，escape &amp; unescape 基本别废弃，它只对 ASCII 码进行编码</p></div><h2 id="unescape" tabindex="-1">unescape <a class="header-anchor" href="#unescape" aria-label="Permalink to &quot;unescape&quot;">​</a></h2><p>ASCII 编码</p><h2 id="escape" tabindex="-1">escape <a class="header-anchor" href="#escape" aria-label="Permalink to &quot;escape&quot;">​</a></h2><p>ASCII 解码</p><h2 id="encodeuri" tabindex="-1">encodeURI <a class="header-anchor" href="#encodeuri" aria-label="Permalink to &quot;encodeURI&quot;">​</a></h2><blockquote><p>不会对本身属于 URI 特殊字符进行编码</p></blockquote><p>URI 特殊字符：冒号(😃 井号(#) 正斜杠(/) 问号(?)</p><h2 id="decodeuri" tabindex="-1">decodeURI <a class="header-anchor" href="#decodeuri" aria-label="Permalink to &quot;decodeURI&quot;">​</a></h2><p>解码</p><h2 id="encodeuricomponent" tabindex="-1">encodeURIComponent <a class="header-anchor" href="#encodeuricomponent" aria-label="Permalink to &quot;encodeURIComponent&quot;">​</a></h2><p>所有非标准字符编码</p><h2 id="decodeuricomponent" tabindex="-1">decodeURIComponent <a class="header-anchor" href="#decodeuricomponent" aria-label="Permalink to &quot;decodeURIComponent&quot;">​</a></h2><p>解码</p>',15),r=[n];function d(i,s,p,l,h,u){return a(),o("div",null,r)}const _=e(c,[["render",d]]);export{I as __pageData,_ as default};
+import{_ as e,o as a,c as o,Q as t}from"./chunks/framework.0e8ae64e.js";const I=JSON.parse('{"title":"URI 编码","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/URI.md","filePath":"notes/javascript/URI.md","lastUpdated":1670330848000}'),c={name:"notes/javascript/URI.md"},n=t('<h1 id="uri-编码" tabindex="-1">URI 编码 <a class="header-anchor" href="#uri-编码" aria-label="Permalink to &quot;URI 编码&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">URI 编码</p><p>URI 方法能对所有的 Unicode 码进行编码，escape &amp; unescape 基本别废弃，它只对 ASCII 码进行编码</p></div><h2 id="unescape" tabindex="-1">unescape <a class="header-anchor" href="#unescape" aria-label="Permalink to &quot;unescape&quot;">​</a></h2><p>ASCII 编码</p><h2 id="escape" tabindex="-1">escape <a class="header-anchor" href="#escape" aria-label="Permalink to &quot;escape&quot;">​</a></h2><p>ASCII 解码</p><h2 id="encodeuri" tabindex="-1">encodeURI <a class="header-anchor" href="#encodeuri" aria-label="Permalink to &quot;encodeURI&quot;">​</a></h2><blockquote><p>不会对本身属于 URI 特殊字符进行编码</p></blockquote><p>URI 特殊字符：冒号(😃 井号(#) 正斜杠(/) 问号(?)</p><h2 id="decodeuri" tabindex="-1">decodeURI <a class="header-anchor" href="#decodeuri" aria-label="Permalink to &quot;decodeURI&quot;">​</a></h2><p>解码</p><h2 id="encodeuricomponent" tabindex="-1">encodeURIComponent <a class="header-anchor" href="#encodeuricomponent" aria-label="Permalink to &quot;encodeURIComponent&quot;">​</a></h2><p>所有非标准字符编码</p><h2 id="decodeuricomponent" tabindex="-1">decodeURIComponent <a class="header-anchor" href="#decodeuricomponent" aria-label="Permalink to &quot;decodeURIComponent&quot;">​</a></h2><p>解码</p>',15),r=[n];function d(i,s,p,l,h,u){return a(),o("div",null,r)}const _=e(c,[["render",d]]);export{I as __pageData,_ as default};
diff --git a/assets/notes_javascript_URI.md.aa38219c.lean.js b/assets/notes_javascript_URI.md.0675aa7b.lean.js
similarity index 70%
rename from assets/notes_javascript_URI.md.aa38219c.lean.js
rename to assets/notes_javascript_URI.md.0675aa7b.lean.js
index 10112fa..0a0aa63 100644
--- a/assets/notes_javascript_URI.md.aa38219c.lean.js
+++ b/assets/notes_javascript_URI.md.0675aa7b.lean.js
@@ -1 +1 @@
-import{_ as e,o as a,c as o,Q as t}from"./chunks/framework.7c0fadea.js";const I=JSON.parse('{"title":"URI 编码","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/URI.md","filePath":"notes/javascript/URI.md","lastUpdated":1670330848000}'),c={name:"notes/javascript/URI.md"},n=t("",15),r=[n];function d(i,s,p,l,h,u){return a(),o("div",null,r)}const _=e(c,[["render",d]]);export{I as __pageData,_ as default};
+import{_ as e,o as a,c as o,Q as t}from"./chunks/framework.0e8ae64e.js";const I=JSON.parse('{"title":"URI 编码","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/URI.md","filePath":"notes/javascript/URI.md","lastUpdated":1670330848000}'),c={name:"notes/javascript/URI.md"},n=t("",15),r=[n];function d(i,s,p,l,h,u){return a(),o("div",null,r)}const _=e(c,[["render",d]]);export{I as __pageData,_ as default};
diff --git a/assets/notes_javascript_addEventListener.md.1f4fe8a5.js b/assets/notes_javascript_addEventListener.md.6026f065.js
similarity index 99%
rename from assets/notes_javascript_addEventListener.md.1f4fe8a5.js
rename to assets/notes_javascript_addEventListener.md.6026f065.js
index b6bcdcf..2aaffae 100644
--- a/assets/notes_javascript_addEventListener.md.1f4fe8a5.js
+++ b/assets/notes_javascript_addEventListener.md.6026f065.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"DOM2 级绑定事件","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/addEventListener.md","filePath":"notes/javascript/addEventListener.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/addEventListener.md"},o=l(`<h1 id="dom2-级绑定事件" tabindex="-1">DOM2 级绑定事件 <a class="header-anchor" href="#dom2-级绑定事件" aria-label="Permalink to &quot;DOM2 级绑定事件&quot;">​</a></h1><h2 id="addeventlistener" tabindex="-1">addEventListener <a class="header-anchor" href="#addeventlistener" aria-label="Permalink to &quot;addEventListener&quot;">​</a></h2><blockquote><p>addEventListener 绑定事件接收三个参数</p></blockquote><h3 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h3><ul><li>event 事件名</li><li>handler 事件处理函数</li><li>boolean/object <ul><li>当为 bool 值时，false 表示冒泡阶段，true 表示捕获阶段</li><li>当为对象时 <ul><li>once 是否执行一次即销毁</li><li>capture 是否优先其他事件执行</li><li>passive 默认行为是否立即执行（多用于移动端）</li></ul></li></ul></li></ul><h3 id="例子" tabindex="-1">例子 <a class="header-anchor" href="#例子" aria-label="Permalink to &quot;例子&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;parent&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"DOM2 级绑定事件","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/addEventListener.md","filePath":"notes/javascript/addEventListener.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/addEventListener.md"},o=l(`<h1 id="dom2-级绑定事件" tabindex="-1">DOM2 级绑定事件 <a class="header-anchor" href="#dom2-级绑定事件" aria-label="Permalink to &quot;DOM2 级绑定事件&quot;">​</a></h1><h2 id="addeventlistener" tabindex="-1">addEventListener <a class="header-anchor" href="#addeventlistener" aria-label="Permalink to &quot;addEventListener&quot;">​</a></h2><blockquote><p>addEventListener 绑定事件接收三个参数</p></blockquote><h3 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h3><ul><li>event 事件名</li><li>handler 事件处理函数</li><li>boolean/object <ul><li>当为 bool 值时，false 表示冒泡阶段，true 表示捕获阶段</li><li>当为对象时 <ul><li>once 是否执行一次即销毁</li><li>capture 是否优先其他事件执行</li><li>passive 默认行为是否立即执行（多用于移动端）</li></ul></li></ul></li></ul><h3 id="例子" tabindex="-1">例子 <a class="header-anchor" href="#例子" aria-label="Permalink to &quot;例子&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;parent&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;child1&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;child2&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
diff --git a/assets/notes_javascript_addEventListener.md.1f4fe8a5.lean.js b/assets/notes_javascript_addEventListener.md.6026f065.lean.js
similarity index 73%
rename from assets/notes_javascript_addEventListener.md.1f4fe8a5.lean.js
rename to assets/notes_javascript_addEventListener.md.6026f065.lean.js
index 251a6da..83607f1 100644
--- a/assets/notes_javascript_addEventListener.md.1f4fe8a5.lean.js
+++ b/assets/notes_javascript_addEventListener.md.6026f065.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"DOM2 级绑定事件","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/addEventListener.md","filePath":"notes/javascript/addEventListener.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/addEventListener.md"},o=l("",7),e=[o];function t(c,r,E,y,i,d){return n(),a("div",null,e)}const h=s(p,[["render",t]]);export{u as __pageData,h as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"DOM2 级绑定事件","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/addEventListener.md","filePath":"notes/javascript/addEventListener.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/addEventListener.md"},o=l("",7),e=[o];function t(c,r,E,y,i,d){return n(),a("div",null,e)}const h=s(p,[["render",t]]);export{u as __pageData,h as default};
diff --git a/assets/notes_javascript_dom.md.00aacf49.lean.js b/assets/notes_javascript_dom.md.00aacf49.lean.js
deleted file mode 100644
index 6818b27..0000000
--- a/assets/notes_javascript_dom.md.00aacf49.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const p="/learning-docs2/assets/images/dom.png",o="/learning-docs2/assets/images/tblr.png",e="/learning-docs2/assets/images/clientBS.png",t="/learning-docs2/assets/images/scrollBS.png",D=JSON.parse('{"title":"DOM 类型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/dom.md","filePath":"notes/javascript/dom.md","lastUpdated":1670379203000}'),c={name:"notes/javascript/dom.md"},r=l("",38),E=[r];function i(y,d,u,m,g,F){return n(),a("div",null,E)}const h=s(c,[["render",i]]);export{D as __pageData,h as default};
diff --git a/assets/notes_javascript_dom.md.00aacf49.js b/assets/notes_javascript_dom.md.0af651ba.js
similarity index 96%
rename from assets/notes_javascript_dom.md.00aacf49.js
rename to assets/notes_javascript_dom.md.0af651ba.js
index b664562..4448fc1 100644
--- a/assets/notes_javascript_dom.md.00aacf49.js
+++ b/assets/notes_javascript_dom.md.0af651ba.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const p="/learning-docs2/assets/images/dom.png",o="/learning-docs2/assets/images/tblr.png",e="/learning-docs2/assets/images/clientBS.png",t="/learning-docs2/assets/images/scrollBS.png",D=JSON.parse('{"title":"DOM 类型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/dom.md","filePath":"notes/javascript/dom.md","lastUpdated":1670379203000}'),c={name:"notes/javascript/dom.md"},r=l(`<h1 id="dom-类型" tabindex="-1">DOM 类型 <a class="header-anchor" href="#dom-类型" aria-label="Permalink to &quot;DOM 类型&quot;">​</a></h1><h2 id="dom-链" tabindex="-1">DOM 链 <a class="header-anchor" href="#dom-链" aria-label="Permalink to &quot;DOM 链&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">JS &amp; HTML</p><p>记录原生的 js 操作 dom 链</p></div><p><code>让我们从最熟悉的的 document 开始</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">document</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const p="/assets/images/dom.png",o="/assets/images/tblr.png",e="/assets/images/clientBS.png",t="/assets/images/scrollBS.png",D=JSON.parse('{"title":"DOM 类型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/dom.md","filePath":"notes/javascript/dom.md","lastUpdated":1670379203000}'),c={name:"notes/javascript/dom.md"},r=l(`<h1 id="dom-类型" tabindex="-1">DOM 类型 <a class="header-anchor" href="#dom-类型" aria-label="Permalink to &quot;DOM 类型&quot;">​</a></h1><h2 id="dom-链" tabindex="-1">DOM 链 <a class="header-anchor" href="#dom-链" aria-label="Permalink to &quot;DOM 链&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">JS &amp; HTML</p><p>记录原生的 js 操作 dom 链</p></div><p><code>让我们从最熟悉的的 document 开始</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">document</span></span>
 <span class="line"><span style="color:#E1E4E8;">document.</span><span style="color:#79B8FF;">__proto__</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> HTMLDocument </span><span style="color:#6A737D;">// type object</span></span>
 <span class="line"><span style="color:#E1E4E8;">HTMLDocument.</span><span style="color:#79B8FF;">__proto__</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> Document </span><span style="color:#6A737D;">// type function =&gt; f Document({[native code]}) 源码</span></span>
 <span class="line"></span>
@@ -140,4 +140,4 @@ import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const p=
 <span class="line"><span style="color:#24292E;">      </span><span style="color:#D73A49;">return</span><span style="color:#24292E;"> window.clipboardData.</span><span style="color:#6F42C1;">setData</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;text&#39;</span><span style="color:#24292E;">, value);</span></span>
 <span class="line"><span style="color:#24292E;">    }</span></span>
 <span class="line"><span style="color:#24292E;">  },</span></span>
-<span class="line"><span style="color:#24292E;">};</span></span></code></pre></div></li></ul>`,38),E=[r];function i(y,d,u,m,g,F){return n(),a("div",null,E)}const h=s(c,[["render",i]]);export{D as __pageData,h as default};
+<span class="line"><span style="color:#24292E;">};</span></span></code></pre></div></li></ul>`,38),E=[r];function y(i,d,u,m,g,F){return n(),a("div",null,E)}const h=s(c,[["render",y]]);export{D as __pageData,h as default};
diff --git a/assets/notes_javascript_dom.md.0af651ba.lean.js b/assets/notes_javascript_dom.md.0af651ba.lean.js
new file mode 100644
index 0000000..330a940
--- /dev/null
+++ b/assets/notes_javascript_dom.md.0af651ba.lean.js
@@ -0,0 +1 @@
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const p="/assets/images/dom.png",o="/assets/images/tblr.png",e="/assets/images/clientBS.png",t="/assets/images/scrollBS.png",D=JSON.parse('{"title":"DOM 类型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/dom.md","filePath":"notes/javascript/dom.md","lastUpdated":1670379203000}'),c={name:"notes/javascript/dom.md"},r=l("",38),E=[r];function y(i,d,u,m,g,F){return n(),a("div",null,E)}const h=s(c,[["render",y]]);export{D as __pageData,h as default};
diff --git a/assets/notes_javascript_equal.md.0278cdef.js b/assets/notes_javascript_equal.md.0278cdef.js
new file mode 100644
index 0000000..d760c14
--- /dev/null
+++ b/assets/notes_javascript_equal.md.0278cdef.js
@@ -0,0 +1,9 @@
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/==.png",e="/assets/images/===.png",p="/assets/images/if().png",m=JSON.parse('{"title":"JS 相等性","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/equal.md","filePath":"notes/javascript/equal.md","lastUpdated":1675328164000}'),t={name:"notes/javascript/equal.md"},r=l('<h1 id="js-相等性" tabindex="-1">JS 相等性 <a class="header-anchor" href="#js-相等性" aria-label="Permalink to &quot;JS 相等性&quot;">​</a></h1><div class="warning custom-block"><p class="custom-block-title">相等性</p><p>JavaScript中的相等性检查（有的转换会感觉很奇怪，目前记住规则）</p></div><p>以下截图来源 <a href="https://github.com/dorey/JavaScript-Equality-Table" target="_blank" rel="noreferrer">Github @dorey</a></p><h2 id="相等" tabindex="-1">相等 == <a class="header-anchor" href="#相等" aria-label="Permalink to &quot;相等 ==&quot;">​</a></h2><p><code>发生强制转换类型</code></p><img src="'+o+'" alt="相等"><h2 id="严格相等" tabindex="-1">严格相等 === <a class="header-anchor" href="#严格相等" aria-label="Permalink to &quot;严格相等 ===&quot;">​</a></h2><img src="'+e+'" alt="严格相等"><h2 id="判断-if" tabindex="-1">判断 if() <a class="header-anchor" href="#判断-if" aria-label="Permalink to &quot;判断 if()&quot;">​</a></h2><img src="'+p+`" alt="if()"><h2 id="比较" tabindex="-1">比较 &gt; = &lt; <a class="header-anchor" href="#比较" aria-label="Permalink to &quot;比较 &gt; = &lt;&quot;">​</a></h2><p><code>两边都会发生转换</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> {b: </span><span style="color:#79B8FF;">1</span><span style="color:#E1E4E8;">};</span></span>
+<span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> b </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> {c: </span><span style="color:#79B8FF;">2</span><span style="color:#E1E4E8;">};</span></span>
+<span class="line"><span style="color:#E1E4E8;">a </span><span style="color:#F97583;">==</span><span style="color:#E1E4E8;"> b </span><span style="color:#6A737D;">// false</span></span>
+<span class="line"><span style="color:#E1E4E8;">a </span><span style="color:#F97583;">&lt;=</span><span style="color:#E1E4E8;"> b </span><span style="color:#6A737D;">// true</span></span>
+<span class="line"><span style="color:#E1E4E8;">a </span><span style="color:#F97583;">&gt;=</span><span style="color:#E1E4E8;"> b </span><span style="color:#6A737D;">// true</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> a </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> {b: </span><span style="color:#005CC5;">1</span><span style="color:#24292E;">};</span></span>
+<span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> b </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> {c: </span><span style="color:#005CC5;">2</span><span style="color:#24292E;">};</span></span>
+<span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">==</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// false</span></span>
+<span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">&lt;=</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// true</span></span>
+<span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">&gt;=</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// true</span></span></code></pre></div>`,13),c=[r];function i(y,E,d,h,_,u){return a(),n("div",null,c)}const g=s(t,[["render",i]]);export{m as __pageData,g as default};
diff --git a/assets/notes_javascript_equal.md.0278cdef.lean.js b/assets/notes_javascript_equal.md.0278cdef.lean.js
new file mode 100644
index 0000000..e13b37a
--- /dev/null
+++ b/assets/notes_javascript_equal.md.0278cdef.lean.js
@@ -0,0 +1 @@
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const o="/assets/images/==.png",e="/assets/images/===.png",p="/assets/images/if().png",m=JSON.parse('{"title":"JS 相等性","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/equal.md","filePath":"notes/javascript/equal.md","lastUpdated":1675328164000}'),t={name:"notes/javascript/equal.md"},r=l("",13),c=[r];function i(y,E,d,h,_,u){return a(),n("div",null,c)}const g=s(t,[["render",i]]);export{m as __pageData,g as default};
diff --git a/assets/notes_javascript_equal.md.392568f0.js b/assets/notes_javascript_equal.md.392568f0.js
deleted file mode 100644
index 3fec510..0000000
--- a/assets/notes_javascript_equal.md.392568f0.js
+++ /dev/null
@@ -1,9 +0,0 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/==.png",e="/learning-docs2/assets/images/===.png",p="/learning-docs2/assets/images/if().png",g=JSON.parse('{"title":"JS 相等性","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/equal.md","filePath":"notes/javascript/equal.md","lastUpdated":1675328164000}'),t={name:"notes/javascript/equal.md"},r=l('<h1 id="js-相等性" tabindex="-1">JS 相等性 <a class="header-anchor" href="#js-相等性" aria-label="Permalink to &quot;JS 相等性&quot;">​</a></h1><div class="warning custom-block"><p class="custom-block-title">相等性</p><p>JavaScript中的相等性检查（有的转换会感觉很奇怪，目前记住规则）</p></div><p>以下截图来源 <a href="https://github.com/dorey/JavaScript-Equality-Table" target="_blank" rel="noreferrer">Github @dorey</a></p><h2 id="相等" tabindex="-1">相等 == <a class="header-anchor" href="#相等" aria-label="Permalink to &quot;相等 ==&quot;">​</a></h2><p><code>发生强制转换类型</code></p><img src="'+o+'" alt="相等"><h2 id="严格相等" tabindex="-1">严格相等 === <a class="header-anchor" href="#严格相等" aria-label="Permalink to &quot;严格相等 ===&quot;">​</a></h2><img src="'+e+'" alt="严格相等"><h2 id="判断-if" tabindex="-1">判断 if() <a class="header-anchor" href="#判断-if" aria-label="Permalink to &quot;判断 if()&quot;">​</a></h2><img src="'+p+`" alt="if()"><h2 id="比较" tabindex="-1">比较 &gt; = &lt; <a class="header-anchor" href="#比较" aria-label="Permalink to &quot;比较 &gt; = &lt;&quot;">​</a></h2><p><code>两边都会发生转换</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> {b: </span><span style="color:#79B8FF;">1</span><span style="color:#E1E4E8;">};</span></span>
-<span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> b </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> {c: </span><span style="color:#79B8FF;">2</span><span style="color:#E1E4E8;">};</span></span>
-<span class="line"><span style="color:#E1E4E8;">a </span><span style="color:#F97583;">==</span><span style="color:#E1E4E8;"> b </span><span style="color:#6A737D;">// false</span></span>
-<span class="line"><span style="color:#E1E4E8;">a </span><span style="color:#F97583;">&lt;=</span><span style="color:#E1E4E8;"> b </span><span style="color:#6A737D;">// true</span></span>
-<span class="line"><span style="color:#E1E4E8;">a </span><span style="color:#F97583;">&gt;=</span><span style="color:#E1E4E8;"> b </span><span style="color:#6A737D;">// true</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> a </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> {b: </span><span style="color:#005CC5;">1</span><span style="color:#24292E;">};</span></span>
-<span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> b </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> {c: </span><span style="color:#005CC5;">2</span><span style="color:#24292E;">};</span></span>
-<span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">==</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// false</span></span>
-<span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">&lt;=</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// true</span></span>
-<span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">&gt;=</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// true</span></span></code></pre></div>`,13),c=[r];function i(d,y,E,h,_,u){return a(),n("div",null,c)}const m=s(t,[["render",i]]);export{g as __pageData,m as default};
diff --git a/assets/notes_javascript_equal.md.392568f0.lean.js b/assets/notes_javascript_equal.md.392568f0.lean.js
deleted file mode 100644
index d612514..0000000
--- a/assets/notes_javascript_equal.md.392568f0.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const o="/learning-docs2/assets/images/==.png",e="/learning-docs2/assets/images/===.png",p="/learning-docs2/assets/images/if().png",g=JSON.parse('{"title":"JS 相等性","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/equal.md","filePath":"notes/javascript/equal.md","lastUpdated":1675328164000}'),t={name:"notes/javascript/equal.md"},r=l("",13),c=[r];function i(d,y,E,h,_,u){return a(),n("div",null,c)}const m=s(t,[["render",i]]);export{g as __pageData,m as default};
diff --git a/assets/notes_javascript_event-loop.md.15fccb5b.js b/assets/notes_javascript_event-loop.md.15fccb5b.js
deleted file mode 100644
index 89a849f..0000000
--- a/assets/notes_javascript_event-loop.md.15fccb5b.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as e,o as l,c as a,Q as o}from"./chunks/framework.7c0fadea.js";const p="/learning-docs2/assets/images/001.png",i="/learning-docs2/assets/images/002.png",t="/learning-docs2/assets/images/003.png",k=JSON.parse('{"title":"Event Loop","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/event-loop.md","filePath":"notes/javascript/event-loop.md","lastUpdated":1675328164000}'),c={name:"notes/javascript/event-loop.md"},s=o('<h1 id="event-loop" tabindex="-1">Event Loop <a class="header-anchor" href="#event-loop" aria-label="Permalink to &quot;Event Loop&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">事件循环</p><p>🔥事件队列 异步 进程 线程</p></div><h2 id="cpu、进程、线程之间的关系" tabindex="-1">CPU、进程、线程之间的关系 <a class="header-anchor" href="#cpu、进程、线程之间的关系" aria-label="Permalink to &quot;CPU、进程、线程之间的关系&quot;">​</a></h2><p><code>进程</code>是 cpu 资源分配的最小单元（是能拥有资源和独立运行的最小单位）</p><p><code>线程</code>是 cpu 调度的最小单位（线程是建立在进程的基础上的一次程序运行单位，一个进程中可以有多个线程）</p><p>不同<code>进程</code>之间也可以通信，代价较大</p><p><code>单线程</code>与<code>多线程</code>，都是指在一个<code>进程</code>内的单和多</p><h2 id="浏览器是多进程的" tabindex="-1">浏览器是多进程的 <a class="header-anchor" href="#浏览器是多进程的" aria-label="Permalink to &quot;浏览器是多进程的&quot;">​</a></h2><p>浏览器是多进程的</p><p>每一个 tab 页，就是一个独立的进程</p><h2 id="浏览器包含了哪些进程" tabindex="-1">浏览器包含了哪些进程 <a class="header-anchor" href="#浏览器包含了哪些进程" aria-label="Permalink to &quot;浏览器包含了哪些进程&quot;">​</a></h2><h3 id="主进程" tabindex="-1">主进程 <a class="header-anchor" href="#主进程" aria-label="Permalink to &quot;主进程&quot;">​</a></h3><ul><li><p>协调控制其他子进程（创建、销毁）</p></li><li><p>浏览器界面显示，用户交互，前进、后退、收藏</p></li><li><p>将渲染进程得到的内存中的 bitmap，绘制到用户界面上</p></li><li><p>处理不可见操作，网络操作，文件访问</p></li></ul><h3 id="第三方插件进程" tabindex="-1">第三方插件进程 <a class="header-anchor" href="#第三方插件进程" aria-label="Permalink to &quot;第三方插件进程&quot;">​</a></h3><p><code>每个插件一个进程，使用的时候，进程被创建</code></p><blockquote><p>GPU 进程</p></blockquote><p>用于 3D 绘制等</p><blockquote><p>渲染进程（浏览器内核）</p></blockquote><ul><li><p>负责页面渲染，脚本执行，事件处理等</p></li><li><p>每个 tab 页一个渲染进程</p></li></ul><h2 id="浏览器内核-渲染进程" tabindex="-1">浏览器内核（渲染进程） <a class="header-anchor" href="#浏览器内核-渲染进程" aria-label="Permalink to &quot;浏览器内核（渲染进程）&quot;">​</a></h2><blockquote><p>GUI 渲染进程</p></blockquote><ul><li><p>负责渲染页面，布局和绘制</p></li><li><p>页面需要重绘和回流时，该线程就会执行</p></li><li><p>与 js 引擎互斥，防止渲染结果不可预期</p></li></ul><blockquote><p>JS 引擎线程</p></blockquote><ul><li><p>负责处理解析和执行 JavaScript 脚本程序</p></li><li><p>只有一个 JS 引擎线程（单线程）</p></li><li><p>与 GUI 渲染线程互斥，防止渲染结果不可预期</p></li></ul><blockquote><p>事件触发线程</p></blockquote><ul><li><p>用来控制事件循环（鼠标点击，setTimeout，ajax）</p></li><li><p>当事件满足触发条件时，将事件放入到 JS 引擎所在的执行队列中</p></li></ul><blockquote><p>定时触发器线程</p></blockquote><ul><li><p>setInterval 与 setTimeout 所在的线程</p></li><li><p>定时任务并不是由 JS 引擎计时的，是由定时触发线程来计时的</p></li><li><p>计时完毕后，通知事件触发线程</p></li></ul><blockquote><p>异步 http 请求线程</p></blockquote><ul><li><p>浏览器有一个单独的线程用于处理 AJAX 请求</p></li><li><p>当请求完成时，若有回调函数，通知时间触发线程</p></li></ul><h2 id="javascript-单线程" tabindex="-1">JavaScript 单线程？ <a class="header-anchor" href="#javascript-单线程" aria-label="Permalink to &quot;JavaScript 单线程？&quot;">​</a></h2><p><code>多线程需要加锁，同时操作DOM，在多线程不加锁的情况下，最终会导致DOM渲染的结果不可预期</code></p><h2 id="gui-渲染线程与-js-引擎线程互斥" tabindex="-1">GUI 渲染线程与 JS 引擎线程互斥？ <a class="header-anchor" href="#gui-渲染线程与-js-引擎线程互斥" aria-label="Permalink to &quot;GUI 渲染线程与 JS 引擎线程互斥？&quot;">​</a></h2><p><code>当JS引擎线程执行时，GUI渲染线程会被挂起，GUI更新则会被保存在一个队列中等待JS引擎线程空闲时立即被执行</code></p><h2 id="event-loop-go" tabindex="-1">Event Loop GO <a class="header-anchor" href="#event-loop-go" aria-label="Permalink to &quot;Event Loop GO&quot;">​</a></h2><ul><li><p>同步任务和异步任务</p></li><li><p>同步任务在 js 引擎线程上执行，形成一个执行栈</p></li><li><p>事件触发线程管理一个任务队列，异步任务触发条件达成，将回调事件放到任务队列中</p></li><li><p>执行栈中所有同步任务执行完毕，js 引擎线程空闲，系统会读取</p></li></ul><img src="'+p+'"><ul><li><p>宏任务 --&gt; 事件队列（循环）</p></li><li><p>微任务 --&gt; 微任务队列</p></li></ul><img src="'+i+'"><p><code>宏任务完成立即执行当前一轮的微任务</code></p><ul><li><p>执行一个宏任务（栈中没有从事件队列中获取）</p></li><li><p>执行过程中如果遇到微任务，添加到微任务队列</p></li><li><p>宏任务执行完毕后，立即执行当前微任务队列的所有微任务</p></li><li><p>宏任务执行完毕，开始检查渲染，然后 GUI 线程接管渲染</p></li><li><p>渲染完毕后，js 线程继续接管，开始下一个宏任务（事件队列）</p></li></ul><img src="'+t+'">',42),r=[s];function n(d,u,h,b,q,m){return l(),a("div",null,r)}const v=e(c,[["render",n]]);export{k as __pageData,v as default};
diff --git a/assets/notes_javascript_event-loop.md.15fccb5b.lean.js b/assets/notes_javascript_event-loop.md.15fccb5b.lean.js
deleted file mode 100644
index f4deeb9..0000000
--- a/assets/notes_javascript_event-loop.md.15fccb5b.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as e,o as l,c as a,Q as o}from"./chunks/framework.7c0fadea.js";const p="/learning-docs2/assets/images/001.png",i="/learning-docs2/assets/images/002.png",t="/learning-docs2/assets/images/003.png",k=JSON.parse('{"title":"Event Loop","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/event-loop.md","filePath":"notes/javascript/event-loop.md","lastUpdated":1675328164000}'),c={name:"notes/javascript/event-loop.md"},s=o("",42),r=[s];function n(d,u,h,b,q,m){return l(),a("div",null,r)}const v=e(c,[["render",n]]);export{k as __pageData,v as default};
diff --git a/assets/notes_javascript_event-loop.md.bdac45df.js b/assets/notes_javascript_event-loop.md.bdac45df.js
new file mode 100644
index 0000000..88cd894
--- /dev/null
+++ b/assets/notes_javascript_event-loop.md.bdac45df.js
@@ -0,0 +1 @@
+import{_ as e,o as l,c as a,Q as o}from"./chunks/framework.0e8ae64e.js";const p="/assets/images/001.png",i="/assets/images/002.png",t="/assets/images/003.png",k=JSON.parse('{"title":"Event Loop","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/event-loop.md","filePath":"notes/javascript/event-loop.md","lastUpdated":1675328164000}'),c={name:"notes/javascript/event-loop.md"},s=o('<h1 id="event-loop" tabindex="-1">Event Loop <a class="header-anchor" href="#event-loop" aria-label="Permalink to &quot;Event Loop&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">事件循环</p><p>🔥事件队列 异步 进程 线程</p></div><h2 id="cpu、进程、线程之间的关系" tabindex="-1">CPU、进程、线程之间的关系 <a class="header-anchor" href="#cpu、进程、线程之间的关系" aria-label="Permalink to &quot;CPU、进程、线程之间的关系&quot;">​</a></h2><p><code>进程</code>是 cpu 资源分配的最小单元（是能拥有资源和独立运行的最小单位）</p><p><code>线程</code>是 cpu 调度的最小单位（线程是建立在进程的基础上的一次程序运行单位，一个进程中可以有多个线程）</p><p>不同<code>进程</code>之间也可以通信，代价较大</p><p><code>单线程</code>与<code>多线程</code>，都是指在一个<code>进程</code>内的单和多</p><h2 id="浏览器是多进程的" tabindex="-1">浏览器是多进程的 <a class="header-anchor" href="#浏览器是多进程的" aria-label="Permalink to &quot;浏览器是多进程的&quot;">​</a></h2><p>浏览器是多进程的</p><p>每一个 tab 页，就是一个独立的进程</p><h2 id="浏览器包含了哪些进程" tabindex="-1">浏览器包含了哪些进程 <a class="header-anchor" href="#浏览器包含了哪些进程" aria-label="Permalink to &quot;浏览器包含了哪些进程&quot;">​</a></h2><h3 id="主进程" tabindex="-1">主进程 <a class="header-anchor" href="#主进程" aria-label="Permalink to &quot;主进程&quot;">​</a></h3><ul><li><p>协调控制其他子进程（创建、销毁）</p></li><li><p>浏览器界面显示，用户交互，前进、后退、收藏</p></li><li><p>将渲染进程得到的内存中的 bitmap，绘制到用户界面上</p></li><li><p>处理不可见操作，网络操作，文件访问</p></li></ul><h3 id="第三方插件进程" tabindex="-1">第三方插件进程 <a class="header-anchor" href="#第三方插件进程" aria-label="Permalink to &quot;第三方插件进程&quot;">​</a></h3><p><code>每个插件一个进程，使用的时候，进程被创建</code></p><blockquote><p>GPU 进程</p></blockquote><p>用于 3D 绘制等</p><blockquote><p>渲染进程（浏览器内核）</p></blockquote><ul><li><p>负责页面渲染，脚本执行，事件处理等</p></li><li><p>每个 tab 页一个渲染进程</p></li></ul><h2 id="浏览器内核-渲染进程" tabindex="-1">浏览器内核（渲染进程） <a class="header-anchor" href="#浏览器内核-渲染进程" aria-label="Permalink to &quot;浏览器内核（渲染进程）&quot;">​</a></h2><blockquote><p>GUI 渲染进程</p></blockquote><ul><li><p>负责渲染页面，布局和绘制</p></li><li><p>页面需要重绘和回流时，该线程就会执行</p></li><li><p>与 js 引擎互斥，防止渲染结果不可预期</p></li></ul><blockquote><p>JS 引擎线程</p></blockquote><ul><li><p>负责处理解析和执行 JavaScript 脚本程序</p></li><li><p>只有一个 JS 引擎线程（单线程）</p></li><li><p>与 GUI 渲染线程互斥，防止渲染结果不可预期</p></li></ul><blockquote><p>事件触发线程</p></blockquote><ul><li><p>用来控制事件循环（鼠标点击，setTimeout，ajax）</p></li><li><p>当事件满足触发条件时，将事件放入到 JS 引擎所在的执行队列中</p></li></ul><blockquote><p>定时触发器线程</p></blockquote><ul><li><p>setInterval 与 setTimeout 所在的线程</p></li><li><p>定时任务并不是由 JS 引擎计时的，是由定时触发线程来计时的</p></li><li><p>计时完毕后，通知事件触发线程</p></li></ul><blockquote><p>异步 http 请求线程</p></blockquote><ul><li><p>浏览器有一个单独的线程用于处理 AJAX 请求</p></li><li><p>当请求完成时，若有回调函数，通知时间触发线程</p></li></ul><h2 id="javascript-单线程" tabindex="-1">JavaScript 单线程？ <a class="header-anchor" href="#javascript-单线程" aria-label="Permalink to &quot;JavaScript 单线程？&quot;">​</a></h2><p><code>多线程需要加锁，同时操作DOM，在多线程不加锁的情况下，最终会导致DOM渲染的结果不可预期</code></p><h2 id="gui-渲染线程与-js-引擎线程互斥" tabindex="-1">GUI 渲染线程与 JS 引擎线程互斥？ <a class="header-anchor" href="#gui-渲染线程与-js-引擎线程互斥" aria-label="Permalink to &quot;GUI 渲染线程与 JS 引擎线程互斥？&quot;">​</a></h2><p><code>当JS引擎线程执行时，GUI渲染线程会被挂起，GUI更新则会被保存在一个队列中等待JS引擎线程空闲时立即被执行</code></p><h2 id="event-loop-go" tabindex="-1">Event Loop GO <a class="header-anchor" href="#event-loop-go" aria-label="Permalink to &quot;Event Loop GO&quot;">​</a></h2><ul><li><p>同步任务和异步任务</p></li><li><p>同步任务在 js 引擎线程上执行，形成一个执行栈</p></li><li><p>事件触发线程管理一个任务队列，异步任务触发条件达成，将回调事件放到任务队列中</p></li><li><p>执行栈中所有同步任务执行完毕，js 引擎线程空闲，系统会读取</p></li></ul><img src="'+p+'"><ul><li><p>宏任务 --&gt; 事件队列（循环）</p></li><li><p>微任务 --&gt; 微任务队列</p></li></ul><img src="'+i+'"><p><code>宏任务完成立即执行当前一轮的微任务</code></p><ul><li><p>执行一个宏任务（栈中没有从事件队列中获取）</p></li><li><p>执行过程中如果遇到微任务，添加到微任务队列</p></li><li><p>宏任务执行完毕后，立即执行当前微任务队列的所有微任务</p></li><li><p>宏任务执行完毕，开始检查渲染，然后 GUI 线程接管渲染</p></li><li><p>渲染完毕后，js 线程继续接管，开始下一个宏任务（事件队列）</p></li></ul><img src="'+t+'">',42),r=[s];function n(u,d,h,b,q,m){return l(),a("div",null,r)}const v=e(c,[["render",n]]);export{k as __pageData,v as default};
diff --git a/assets/notes_javascript_event-loop.md.bdac45df.lean.js b/assets/notes_javascript_event-loop.md.bdac45df.lean.js
new file mode 100644
index 0000000..b698247
--- /dev/null
+++ b/assets/notes_javascript_event-loop.md.bdac45df.lean.js
@@ -0,0 +1 @@
+import{_ as e,o as l,c as a,Q as o}from"./chunks/framework.0e8ae64e.js";const p="/assets/images/001.png",i="/assets/images/002.png",t="/assets/images/003.png",k=JSON.parse('{"title":"Event Loop","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/event-loop.md","filePath":"notes/javascript/event-loop.md","lastUpdated":1675328164000}'),c={name:"notes/javascript/event-loop.md"},s=o("",42),r=[s];function n(u,d,h,b,q,m){return l(),a("div",null,r)}const v=e(c,[["render",n]]);export{k as __pageData,v as default};
diff --git a/assets/notes_javascript_jsop.md.2e56b764.js b/assets/notes_javascript_jsop.md.a97810f8.js
similarity index 99%
rename from assets/notes_javascript_jsop.md.2e56b764.js
rename to assets/notes_javascript_jsop.md.a97810f8.js
index ef38003..79d58d6 100644
--- a/assets/notes_javascript_jsop.md.2e56b764.js
+++ b/assets/notes_javascript_jsop.md.a97810f8.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"JS 运算符","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/jsop.md","filePath":"notes/javascript/jsop.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/jsop.md"},o=l(`<h1 id="js-运算符" tabindex="-1">JS 运算符 <a class="header-anchor" href="#js-运算符" aria-label="Permalink to &quot;JS 运算符&quot;">​</a></h1><blockquote><p>记录一些特殊的操作运算符</p></blockquote><h2 id="控制合并操作符" tabindex="-1">控制合并操作符 ?? <a class="header-anchor" href="#控制合并操作符" aria-label="Permalink to &quot;控制合并操作符 ??&quot;">​</a></h2><p>空值合并操作符（??）是一个逻辑操作符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数</p><h3 id="赋值" tabindex="-1">赋值 <a class="header-anchor" href="#赋值" aria-label="Permalink to &quot;赋值&quot;">​</a></h3><ul><li>与逻辑或操作符（||）对比</li><li>逻辑或操作符（||）会在左侧操作数为假值时返回右侧操作数</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// ??</span></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"JS 运算符","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/jsop.md","filePath":"notes/javascript/jsop.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/jsop.md"},o=l(`<h1 id="js-运算符" tabindex="-1">JS 运算符 <a class="header-anchor" href="#js-运算符" aria-label="Permalink to &quot;JS 运算符&quot;">​</a></h1><blockquote><p>记录一些特殊的操作运算符</p></blockquote><h2 id="控制合并操作符" tabindex="-1">控制合并操作符 ?? <a class="header-anchor" href="#控制合并操作符" aria-label="Permalink to &quot;控制合并操作符 ??&quot;">​</a></h2><p>空值合并操作符（??）是一个逻辑操作符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数</p><h3 id="赋值" tabindex="-1">赋值 <a class="header-anchor" href="#赋值" aria-label="Permalink to &quot;赋值&quot;">​</a></h3><ul><li>与逻辑或操作符（||）对比</li><li>逻辑或操作符（||）会在左侧操作数为假值时返回右侧操作数</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// ??</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> n </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">null</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">||</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">undefined</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> o </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> n </span><span style="color:#F97583;">??</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;here value&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// output: here value</span></span>
diff --git a/assets/notes_javascript_jsop.md.2e56b764.lean.js b/assets/notes_javascript_jsop.md.a97810f8.lean.js
similarity index 71%
rename from assets/notes_javascript_jsop.md.2e56b764.lean.js
rename to assets/notes_javascript_jsop.md.a97810f8.lean.js
index 039d267..1b78e64 100644
--- a/assets/notes_javascript_jsop.md.2e56b764.lean.js
+++ b/assets/notes_javascript_jsop.md.a97810f8.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"JS 运算符","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/jsop.md","filePath":"notes/javascript/jsop.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/jsop.md"},o=l("",29),e=[o];function t(c,r,y,E,i,d){return a(),n("div",null,e)}const F=s(p,[["render",t]]);export{h as __pageData,F as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"JS 运算符","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/jsop.md","filePath":"notes/javascript/jsop.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/jsop.md"},o=l("",29),e=[o];function t(c,r,y,E,i,d){return a(),n("div",null,e)}const F=s(p,[["render",t]]);export{h as __pageData,F as default};
diff --git a/assets/notes_javascript_mutationObserver.md.a535a188.js b/assets/notes_javascript_mutationObserver.md.1d6ee92e.js
similarity index 99%
rename from assets/notes_javascript_mutationObserver.md.a535a188.js
rename to assets/notes_javascript_mutationObserver.md.1d6ee92e.js
index 74b05d8..251c021 100644
--- a/assets/notes_javascript_mutationObserver.md.a535a188.js
+++ b/assets/notes_javascript_mutationObserver.md.1d6ee92e.js
@@ -1,4 +1,4 @@
-import{_ as s}from"./chunks/mutationObserver.a5873c86.js";import{_ as a,o as n,c as l,Q as p}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"MutationObserver","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/mutationObserver.md","filePath":"notes/javascript/mutationObserver.md","lastUpdated":1670379203000}'),o={name:"notes/javascript/mutationObserver.md"},e=p('<h1 id="mutationobserver" tabindex="-1">MutationObserver <a class="header-anchor" href="#mutationobserver" aria-label="Permalink to &quot;MutationObserver&quot;">​</a></h1><h2 id="概念" tabindex="-1">概念 <a class="header-anchor" href="#概念" aria-label="Permalink to &quot;概念&quot;">​</a></h2><blockquote><p>当 DOM 变化时，可以异步执行回调监听 DOM 的变化 监听范围：document, dom subtree, single element, attributes, childNodes, textNode</p></blockquote><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><img src="'+s+`" alt="mutaion observer browser compatible"><h2 id="用法" tabindex="-1">用法 <a class="header-anchor" href="#用法" aria-label="Permalink to &quot;用法&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;DOM was mutated!&#39;</span><span style="color:#E1E4E8;">));</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> observer </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">MutationObserver</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;DOM was mutated!&#39;</span><span style="color:#24292E;">));</span></span></code></pre></div><h2 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><p>api 介绍</p><h3 id="observe-方法" tabindex="-1">observe 方法 <a class="header-anchor" href="#observe-方法" aria-label="Permalink to &quot;observe 方法&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
+import{_ as s}from"./chunks/mutationObserver.46371927.js";import{_ as a,o as n,c as l,Q as p}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"MutationObserver","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/mutationObserver.md","filePath":"notes/javascript/mutationObserver.md","lastUpdated":1670379203000}'),o={name:"notes/javascript/mutationObserver.md"},e=p('<h1 id="mutationobserver" tabindex="-1">MutationObserver <a class="header-anchor" href="#mutationobserver" aria-label="Permalink to &quot;MutationObserver&quot;">​</a></h1><h2 id="概念" tabindex="-1">概念 <a class="header-anchor" href="#概念" aria-label="Permalink to &quot;概念&quot;">​</a></h2><blockquote><p>当 DOM 变化时，可以异步执行回调监听 DOM 的变化 监听范围：document, dom subtree, single element, attributes, childNodes, textNode</p></blockquote><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><img src="'+s+`" alt="mutaion observer browser compatible"><h2 id="用法" tabindex="-1">用法 <a class="header-anchor" href="#用法" aria-label="Permalink to &quot;用法&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;DOM was mutated!&#39;</span><span style="color:#E1E4E8;">));</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> observer </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">MutationObserver</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;DOM was mutated!&#39;</span><span style="color:#24292E;">));</span></span></code></pre></div><h2 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><p>api 介绍</p><h3 id="observe-方法" tabindex="-1">observe 方法 <a class="header-anchor" href="#observe-方法" aria-label="Permalink to &quot;observe 方法&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;document has changed!!!&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">});</span></span>
 <span class="line"><span style="color:#E1E4E8;">observer.</span><span style="color:#B392F0;">observe</span><span style="color:#E1E4E8;">(document.body, { attributes: </span><span style="color:#79B8FF;">true</span><span style="color:#E1E4E8;"> });</span></span>
diff --git a/assets/notes_javascript_mutationObserver.md.a535a188.lean.js b/assets/notes_javascript_mutationObserver.md.1d6ee92e.lean.js
similarity index 76%
rename from assets/notes_javascript_mutationObserver.md.a535a188.lean.js
rename to assets/notes_javascript_mutationObserver.md.1d6ee92e.lean.js
index 2aeefe2..564716f 100644
--- a/assets/notes_javascript_mutationObserver.md.a535a188.lean.js
+++ b/assets/notes_javascript_mutationObserver.md.1d6ee92e.lean.js
@@ -1 +1 @@
-import{_ as s}from"./chunks/mutationObserver.a5873c86.js";import{_ as a,o as n,c as l,Q as p}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"MutationObserver","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/mutationObserver.md","filePath":"notes/javascript/mutationObserver.md","lastUpdated":1670379203000}'),o={name:"notes/javascript/mutationObserver.md"},e=p("",38),t=[e];function c(r,y,E,i,d,u){return n(),l("div",null,t)}const h=a(o,[["render",c]]);export{m as __pageData,h as default};
+import{_ as s}from"./chunks/mutationObserver.46371927.js";import{_ as a,o as n,c as l,Q as p}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"MutationObserver","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/mutationObserver.md","filePath":"notes/javascript/mutationObserver.md","lastUpdated":1670379203000}'),o={name:"notes/javascript/mutationObserver.md"},e=p("",38),t=[e];function c(r,y,E,i,d,u){return n(),l("div",null,t)}const h=a(o,[["render",c]]);export{m as __pageData,h as default};
diff --git a/assets/notes_javascript_prototype.md.b24cb541.js b/assets/notes_javascript_prototype.md.36c69f43.js
similarity index 99%
rename from assets/notes_javascript_prototype.md.b24cb541.js
rename to assets/notes_javascript_prototype.md.36c69f43.js
index 82550e3..9d78873 100644
--- a/assets/notes_javascript_prototype.md.b24cb541.js
+++ b/assets/notes_javascript_prototype.md.36c69f43.js
@@ -1,4 +1,4 @@
-import{_ as o,C as e,o as c,c as t,k as s,a as n,H as p,Q as l}from"./chunks/framework.7c0fadea.js";const w=JSON.parse('{"title":"原型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/prototype.md","filePath":"notes/javascript/prototype.md","lastUpdated":1670330848000}'),r={name:"notes/javascript/prototype.md"},E=s("h1",{id:"原型",tabindex:"-1"},[n("原型 "),s("a",{class:"header-anchor",href:"#原型","aria-label":'Permalink to "原型"'},"​")],-1),y=s("div",{class:"tip custom-block"},[s("p",{class:"custom-block-title"},"Prototype"),s("p",null,"关于原型的学习记录")],-1),i={id:"创建一个对象",tabindex:"-1"},F=s("a",{class:"header-anchor",href:"#创建一个对象","aria-label":'Permalink to "创建一个对象 <Badge text="FIRST" type="warn"/>"'},"​",-1),d=l(`<p><strong>1. 工厂模式</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">createObject</span><span style="color:#E1E4E8;">() {</span></span>
+import{_ as o,C as e,o as c,c as t,k as s,a as n,H as p,Q as l}from"./chunks/framework.0e8ae64e.js";const w=JSON.parse('{"title":"原型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/prototype.md","filePath":"notes/javascript/prototype.md","lastUpdated":1670330848000}'),r={name:"notes/javascript/prototype.md"},E=s("h1",{id:"原型",tabindex:"-1"},[n("原型 "),s("a",{class:"header-anchor",href:"#原型","aria-label":'Permalink to "原型"'},"​")],-1),y=s("div",{class:"tip custom-block"},[s("p",{class:"custom-block-title"},"Prototype"),s("p",null,"关于原型的学习记录")],-1),i={id:"创建一个对象",tabindex:"-1"},F=s("a",{class:"header-anchor",href:"#创建一个对象","aria-label":'Permalink to "创建一个对象 <Badge text="FIRST" type="warn"/>"'},"​",-1),d=l(`<p><strong>1. 工厂模式</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">createObject</span><span style="color:#E1E4E8;">() {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> o </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">Object</span><span style="color:#E1E4E8;">();</span></span>
 <span class="line"><span style="color:#E1E4E8;">  o.name </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;Hello World&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  o.</span><span style="color:#B392F0;">sayName</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {</span></span>
diff --git a/assets/notes_javascript_prototype.md.b24cb541.lean.js b/assets/notes_javascript_prototype.md.36c69f43.lean.js
similarity index 96%
rename from assets/notes_javascript_prototype.md.b24cb541.lean.js
rename to assets/notes_javascript_prototype.md.36c69f43.lean.js
index bd7eca5..5a2858e 100644
--- a/assets/notes_javascript_prototype.md.b24cb541.lean.js
+++ b/assets/notes_javascript_prototype.md.36c69f43.lean.js
@@ -1 +1 @@
-import{_ as o,C as e,o as c,c as t,k as s,a as n,H as p,Q as l}from"./chunks/framework.7c0fadea.js";const w=JSON.parse('{"title":"原型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/prototype.md","filePath":"notes/javascript/prototype.md","lastUpdated":1670330848000}'),r={name:"notes/javascript/prototype.md"},E=s("h1",{id:"原型",tabindex:"-1"},[n("原型 "),s("a",{class:"header-anchor",href:"#原型","aria-label":'Permalink to "原型"'},"​")],-1),y=s("div",{class:"tip custom-block"},[s("p",{class:"custom-block-title"},"Prototype"),s("p",null,"关于原型的学习记录")],-1),i={id:"创建一个对象",tabindex:"-1"},F=s("a",{class:"header-anchor",href:"#创建一个对象","aria-label":'Permalink to "创建一个对象 <Badge text="FIRST" type="warn"/>"'},"​",-1),d=l("",22),u={id:"继承",tabindex:"-1"},C=s("a",{class:"header-anchor",href:"#继承","aria-label":'Permalink to "继承 <Badge text="SECOND" type="warn"/>"'},"​",-1),h=l("",20),g={id:"proto",tabindex:"-1"},A=s("code",null,"__proto__",-1),D=s("a",{class:"header-anchor",href:"#proto","aria-label":'Permalink to "`__proto__` <Badge text="THIRD" type="warn"/>"'},"​",-1),B=l("",4),_={id:"constructor",tabindex:"-1"},b=s("a",{class:"header-anchor",href:"#constructor","aria-label":'Permalink to "constructor <Badge text="FOURTH" type="warn"/>"'},"​",-1),m=l("",3);function v(f,k,T,P,S,j){const a=e("Badge");return c(),t("div",null,[E,y,s("h2",i,[n("创建一个对象 "),p(a,{text:"FIRST",type:"warn"}),n(),F]),d,s("h2",u,[n("继承 "),p(a,{text:"SECOND",type:"warn"}),n(),C]),h,s("h2",g,[A,n(),p(a,{text:"THIRD",type:"warn"}),n(),D]),B,s("h2",_,[n("constructor "),p(a,{text:"FOURTH",type:"warn"}),n(),b]),m])}const O=o(r,[["render",v]]);export{w as __pageData,O as default};
+import{_ as o,C as e,o as c,c as t,k as s,a as n,H as p,Q as l}from"./chunks/framework.0e8ae64e.js";const w=JSON.parse('{"title":"原型","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/prototype.md","filePath":"notes/javascript/prototype.md","lastUpdated":1670330848000}'),r={name:"notes/javascript/prototype.md"},E=s("h1",{id:"原型",tabindex:"-1"},[n("原型 "),s("a",{class:"header-anchor",href:"#原型","aria-label":'Permalink to "原型"'},"​")],-1),y=s("div",{class:"tip custom-block"},[s("p",{class:"custom-block-title"},"Prototype"),s("p",null,"关于原型的学习记录")],-1),i={id:"创建一个对象",tabindex:"-1"},F=s("a",{class:"header-anchor",href:"#创建一个对象","aria-label":'Permalink to "创建一个对象 <Badge text="FIRST" type="warn"/>"'},"​",-1),d=l("",22),u={id:"继承",tabindex:"-1"},C=s("a",{class:"header-anchor",href:"#继承","aria-label":'Permalink to "继承 <Badge text="SECOND" type="warn"/>"'},"​",-1),h=l("",20),g={id:"proto",tabindex:"-1"},A=s("code",null,"__proto__",-1),D=s("a",{class:"header-anchor",href:"#proto","aria-label":'Permalink to "`__proto__` <Badge text="THIRD" type="warn"/>"'},"​",-1),B=l("",4),_={id:"constructor",tabindex:"-1"},b=s("a",{class:"header-anchor",href:"#constructor","aria-label":'Permalink to "constructor <Badge text="FOURTH" type="warn"/>"'},"​",-1),m=l("",3);function v(f,k,T,P,S,j){const a=e("Badge");return c(),t("div",null,[E,y,s("h2",i,[n("创建一个对象 "),p(a,{text:"FIRST",type:"warn"}),n(),F]),d,s("h2",u,[n("继承 "),p(a,{text:"SECOND",type:"warn"}),n(),C]),h,s("h2",g,[A,n(),p(a,{text:"THIRD",type:"warn"}),n(),D]),B,s("h2",_,[n("constructor "),p(a,{text:"FOURTH",type:"warn"}),n(),b]),m])}const O=o(r,[["render",v]]);export{w as __pageData,O as default};
diff --git a/assets/notes_javascript_scope.md.9b63d680.js b/assets/notes_javascript_scope.md.be39322f.js
similarity index 99%
rename from assets/notes_javascript_scope.md.9b63d680.js
rename to assets/notes_javascript_scope.md.be39322f.js
index 7590ffc..5c76303 100644
--- a/assets/notes_javascript_scope.md.9b63d680.js
+++ b/assets/notes_javascript_scope.md.be39322f.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"JS 作用域","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/scope.md","filePath":"notes/javascript/scope.md","lastUpdated":1670330848000}'),o={name:"notes/javascript/scope.md"},p=n(`<h1 id="js-作用域" tabindex="-1">JS 作用域 <a class="header-anchor" href="#js-作用域" aria-label="Permalink to &quot;JS 作用域&quot;">​</a></h1><p>JavaScript 动态（解释执行）语言，不是提前编译的，编译结果也不能在分布式系统上移植</p><h2 id="编译原理" tabindex="-1">编译原理 <a class="header-anchor" href="#编译原理" aria-label="Permalink to &quot;编译原理&quot;">​</a></h2><ol><li>分词/词法分析</li></ol><ul><li>词法最小单元（token） var, a, =, 1</li></ul><ol start="2"><li>解析/语法分析</li></ol><ul><li>解析成抽象语法树</li></ul><ol start="3"><li>代码生成</li></ol><ul><li>将 AST 转换位可执行代码</li></ul><blockquote><p>负责收据并维护所有声明的标识符（变量）的一系列查询，并有一定的规则来赋予这些标识符的访问权限</p></blockquote><h2 id="理解作用域" tabindex="-1">理解作用域 <a class="header-anchor" href="#理解作用域" aria-label="Permalink to &quot;理解作用域&quot;">​</a></h2><blockquote><p>程序中定义变量的区域，该位置决定了变量的生命周期 变量和函数的可访问范围，作用域控制着变量的可见性与生命周期</p></blockquote><h3 id="lhs-rhs" tabindex="-1">LHS RHS <a class="header-anchor" href="#lhs-rhs" aria-label="Permalink to &quot;LHS RHS&quot;">​</a></h3><p>赋值操作的左侧或右侧</p><ul><li>LHS(赋值操作的目标是谁)</li><li>RHS(谁是赋值操作的源头)</li></ul><h3 id="异常" tabindex="-1">异常 <a class="header-anchor" href="#异常" aria-label="Permalink to &quot;异常&quot;">​</a></h3><ul><li>查询到作用域，引用值 null 或 undefined，TypeError</li><li>未查询到作用域，ReferenceError</li></ul><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><ul><li>作用域是一套规则，用于确定在何处以及如何查找变量（标识符）</li><li>查找的目的是为了给变量赋值，就会使用 LHS 查询</li><li>获取变量的值，使用 RHS 查询</li><li>不成功的 RHS 引用会导致 ReferenceError 异常</li></ul><p><code>作用域链</code></p><blockquote><p>通过作用域来查找变量的链条称为作用域链</p></blockquote><ul><li>作用域链保证对执行环境有权访问（变量函数的有序访问）</li><li>指向变量对象 =&gt; 变量对象包含执行环境所有变量和函数的对象（当前执行上下文的变量对象）</li></ul><h2 id="词法作用域" tabindex="-1">词法作用域 <a class="header-anchor" href="#词法作用域" aria-label="Permalink to &quot;词法作用域&quot;">​</a></h2><blockquote><p>代码编译阶段就决定好，和函数如何调用的没关系 词法阶段的作用域(将变量和块作用域写在哪里决定的) 作用域是由代码中函数声明的位置来决定的，词法作用域是静态的作用域 通过词法作用域可以预测代码在执行过程中如何查找变量</p></blockquote><h3 id="闭包" tabindex="-1">闭包 <a class="header-anchor" href="#闭包" aria-label="Permalink to &quot;闭包&quot;">​</a></h3><blockquote><p>词法作用域规定，内部函数可以访问外部函数声明中的变量，当通过调用一个外部函数返回内部函数后，即使该外部函数执行结束了，但是内部函数引用外部函数的变量依然保存在内存中，把这些变量的集合成为闭包</p></blockquote><h3 id="查找作用域" tabindex="-1">查找作用域 <a class="header-anchor" href="#查找作用域" aria-label="Permalink to &quot;查找作用域&quot;">​</a></h3><ul><li>全局环境作用域</li><li>所执行的环境作用域</li></ul><blockquote><p>作用域查找会在找到第一个匹配的标识符停止（遮蔽效应） 作用域查找始终从运行时所处的最内部作用域开始，逐级向外或者向上进行，直到遇见第一个匹配的标识符为止</p></blockquote><h3 id="欺骗作用域" tabindex="-1">欺骗作用域 <a class="header-anchor" href="#欺骗作用域" aria-label="Permalink to &quot;欺骗作用域&quot;">​</a></h3><blockquote><p>eval with 会干扰作用域，降低性能</p></blockquote><h4 id="eval" tabindex="-1">eval <a class="header-anchor" href="#eval" aria-label="Permalink to &quot;eval&quot;">​</a></h4><p>接收一个字符串作为参数，可以执行字符串代码（动态生成的函数代码）</p><ul><li>严格模式中，eval 拥有自己的作用域，无法改变所在的作用域</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">foo</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">str</span><span style="color:#E1E4E8;">) {</span></span>
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"JS 作用域","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/scope.md","filePath":"notes/javascript/scope.md","lastUpdated":1670330848000}'),o={name:"notes/javascript/scope.md"},p=n(`<h1 id="js-作用域" tabindex="-1">JS 作用域 <a class="header-anchor" href="#js-作用域" aria-label="Permalink to &quot;JS 作用域&quot;">​</a></h1><p>JavaScript 动态（解释执行）语言，不是提前编译的，编译结果也不能在分布式系统上移植</p><h2 id="编译原理" tabindex="-1">编译原理 <a class="header-anchor" href="#编译原理" aria-label="Permalink to &quot;编译原理&quot;">​</a></h2><ol><li>分词/词法分析</li></ol><ul><li>词法最小单元（token） var, a, =, 1</li></ul><ol start="2"><li>解析/语法分析</li></ol><ul><li>解析成抽象语法树</li></ul><ol start="3"><li>代码生成</li></ol><ul><li>将 AST 转换位可执行代码</li></ul><blockquote><p>负责收据并维护所有声明的标识符（变量）的一系列查询，并有一定的规则来赋予这些标识符的访问权限</p></blockquote><h2 id="理解作用域" tabindex="-1">理解作用域 <a class="header-anchor" href="#理解作用域" aria-label="Permalink to &quot;理解作用域&quot;">​</a></h2><blockquote><p>程序中定义变量的区域，该位置决定了变量的生命周期 变量和函数的可访问范围，作用域控制着变量的可见性与生命周期</p></blockquote><h3 id="lhs-rhs" tabindex="-1">LHS RHS <a class="header-anchor" href="#lhs-rhs" aria-label="Permalink to &quot;LHS RHS&quot;">​</a></h3><p>赋值操作的左侧或右侧</p><ul><li>LHS(赋值操作的目标是谁)</li><li>RHS(谁是赋值操作的源头)</li></ul><h3 id="异常" tabindex="-1">异常 <a class="header-anchor" href="#异常" aria-label="Permalink to &quot;异常&quot;">​</a></h3><ul><li>查询到作用域，引用值 null 或 undefined，TypeError</li><li>未查询到作用域，ReferenceError</li></ul><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><ul><li>作用域是一套规则，用于确定在何处以及如何查找变量（标识符）</li><li>查找的目的是为了给变量赋值，就会使用 LHS 查询</li><li>获取变量的值，使用 RHS 查询</li><li>不成功的 RHS 引用会导致 ReferenceError 异常</li></ul><p><code>作用域链</code></p><blockquote><p>通过作用域来查找变量的链条称为作用域链</p></blockquote><ul><li>作用域链保证对执行环境有权访问（变量函数的有序访问）</li><li>指向变量对象 =&gt; 变量对象包含执行环境所有变量和函数的对象（当前执行上下文的变量对象）</li></ul><h2 id="词法作用域" tabindex="-1">词法作用域 <a class="header-anchor" href="#词法作用域" aria-label="Permalink to &quot;词法作用域&quot;">​</a></h2><blockquote><p>代码编译阶段就决定好，和函数如何调用的没关系 词法阶段的作用域(将变量和块作用域写在哪里决定的) 作用域是由代码中函数声明的位置来决定的，词法作用域是静态的作用域 通过词法作用域可以预测代码在执行过程中如何查找变量</p></blockquote><h3 id="闭包" tabindex="-1">闭包 <a class="header-anchor" href="#闭包" aria-label="Permalink to &quot;闭包&quot;">​</a></h3><blockquote><p>词法作用域规定，内部函数可以访问外部函数声明中的变量，当通过调用一个外部函数返回内部函数后，即使该外部函数执行结束了，但是内部函数引用外部函数的变量依然保存在内存中，把这些变量的集合成为闭包</p></blockquote><h3 id="查找作用域" tabindex="-1">查找作用域 <a class="header-anchor" href="#查找作用域" aria-label="Permalink to &quot;查找作用域&quot;">​</a></h3><ul><li>全局环境作用域</li><li>所执行的环境作用域</li></ul><blockquote><p>作用域查找会在找到第一个匹配的标识符停止（遮蔽效应） 作用域查找始终从运行时所处的最内部作用域开始，逐级向外或者向上进行，直到遇见第一个匹配的标识符为止</p></blockquote><h3 id="欺骗作用域" tabindex="-1">欺骗作用域 <a class="header-anchor" href="#欺骗作用域" aria-label="Permalink to &quot;欺骗作用域&quot;">​</a></h3><blockquote><p>eval with 会干扰作用域，降低性能</p></blockquote><h4 id="eval" tabindex="-1">eval <a class="header-anchor" href="#eval" aria-label="Permalink to &quot;eval&quot;">​</a></h4><p>接收一个字符串作为参数，可以执行字符串代码（动态生成的函数代码）</p><ul><li>严格模式中，eval 拥有自己的作用域，无法改变所在的作用域</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">foo</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">str</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#9ECBFF;">&#39;use strict&#39;</span><span style="color:#E1E4E8;">; </span><span style="color:#6A737D;">// 无法改变所在的作用域 输入 ReferenceError: a is not defined</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">eval</span><span style="color:#E1E4E8;">(str);</span></span>
 <span class="line"><span style="color:#E1E4E8;">  console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(a); </span><span style="color:#6A737D;">// 改变了全局作用域 输出 1</span></span>
diff --git a/assets/notes_javascript_scope.md.9b63d680.lean.js b/assets/notes_javascript_scope.md.be39322f.lean.js
similarity index 71%
rename from assets/notes_javascript_scope.md.9b63d680.lean.js
rename to assets/notes_javascript_scope.md.be39322f.lean.js
index 78987cd..7bef6ee 100644
--- a/assets/notes_javascript_scope.md.9b63d680.lean.js
+++ b/assets/notes_javascript_scope.md.be39322f.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"JS 作用域","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/scope.md","filePath":"notes/javascript/scope.md","lastUpdated":1670330848000}'),o={name:"notes/javascript/scope.md"},p=n("",46),e=[p];function t(c,r,i,E,y,h){return a(),l("div",null,e)}const b=s(o,[["render",t]]);export{u as __pageData,b as default};
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"JS 作用域","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/scope.md","filePath":"notes/javascript/scope.md","lastUpdated":1670330848000}'),o={name:"notes/javascript/scope.md"},p=n("",46),e=[p];function t(c,r,i,E,y,h){return a(),l("div",null,e)}const b=s(o,[["render",t]]);export{u as __pageData,b as default};
diff --git a/assets/notes_javascript_storage-struct.md.43266820.js b/assets/notes_javascript_storage-struct.md.0cab0c00.js
similarity index 96%
rename from assets/notes_javascript_storage-struct.md.43266820.js
rename to assets/notes_javascript_storage-struct.md.0cab0c00.js
index dab2f77..e271f70 100644
--- a/assets/notes_javascript_storage-struct.md.43266820.js
+++ b/assets/notes_javascript_storage-struct.md.0cab0c00.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as o}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"JS 的存储结构","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/storage-struct.md","filePath":"notes/javascript/storage-struct.md","lastUpdated":1670330848000}'),r={name:"notes/javascript/storage-struct.md"},l=o('<h1 id="js-的存储结构" tabindex="-1">JS 的存储结构 <a class="header-anchor" href="#js-的存储结构" aria-label="Permalink to &quot;JS 的存储结构&quot;">​</a></h1><h2 id="栈结构" tabindex="-1">栈结构 <a class="header-anchor" href="#栈结构" aria-label="Permalink to &quot;栈结构&quot;">​</a></h2><h3 id="调用栈" tabindex="-1">调用栈 <a class="header-anchor" href="#调用栈" aria-label="Permalink to &quot;调用栈&quot;">​</a></h3><blockquote><p>管理函数调用的关系的一种数据结构</p></blockquote><h3 id="函数调用" tabindex="-1">函数调用 <a class="header-anchor" href="#函数调用" aria-label="Permalink to &quot;函数调用&quot;">​</a></h3><blockquote><p>运行一个函数，函数名称跟着一对小括号执行</p></blockquote><h3 id="栈" tabindex="-1">栈 <a class="header-anchor" href="#栈" aria-label="Permalink to &quot;栈&quot;">​</a></h3><blockquote><p>一种数据结构，后进先出</p></blockquote><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><blockquote><p>在执行上下文创建以后，JavaScript 引擎会将执行上下文压入栈中，把这种管理执行上下文称为执行上下文栈，即调用栈 函数执行完毕之后，JavaScript 引擎会将函数的上下文出栈</p></blockquote><h3 id="栈溢出" tabindex="-1">栈溢出 <a class="header-anchor" href="#栈溢出" aria-label="Permalink to &quot;栈溢出&quot;">​</a></h3><blockquote><p>调用栈是有大小的（容量限制），超过一定数目，就会栈溢出</p></blockquote><h2 id="内存空间" tabindex="-1">内存空间 <a class="header-anchor" href="#内存空间" aria-label="Permalink to &quot;内存空间&quot;">​</a></h2><p>代码空间、栈空间、堆空间</p><blockquote><p>基本原始类型</p></blockquote><p>Number, String, Boolean, Undefined, Null, Symbol, BigInt(存放安全数据，超出范围安全处理)</p><blockquote><p>引用类型</p></blockquote><p>Object</p><h3 id="代码空间" tabindex="-1">代码空间 <a class="header-anchor" href="#代码空间" aria-label="Permalink to &quot;代码空间&quot;">​</a></h3><p>存放可执行代码</p><h3 id="栈空间" tabindex="-1">栈空间 <a class="header-anchor" href="#栈空间" aria-label="Permalink to &quot;栈空间&quot;">​</a></h3><p>基本原始类型数据存放与栈空间中（调用栈）</p><h3 id="堆空间" tabindex="-1">堆空间 <a class="header-anchor" href="#堆空间" aria-label="Permalink to &quot;堆空间&quot;">​</a></h3><p>引用类型存放与堆空间中（存放的是引用地址）</p><h2 id="js-内存管理-变量分配" tabindex="-1">JS 内存管理 变量分配 <a class="header-anchor" href="#js-内存管理-变量分配" aria-label="Permalink to &quot;JS 内存管理 变量分配&quot;">​</a></h2><h3 id="静态区" tabindex="-1">静态区 <a class="header-anchor" href="#静态区" aria-label="Permalink to &quot;静态区&quot;">​</a></h3><ul><li>存放全局变量（基本类型）</li></ul><h3 id="调用栈-1" tabindex="-1">调用栈 <a class="header-anchor" href="#调用栈-1" aria-label="Permalink to &quot;调用栈&quot;">​</a></h3><ul><li>栈中执行上下文（作用域链 = 变量对象、this 指向环境）</li><li>只能读写自己栈帧的内存</li><li>调用栈调用结束自然销毁，实时性高</li></ul><h3 id="堆" tabindex="-1">堆 <a class="header-anchor" href="#堆" aria-label="Permalink to &quot;堆&quot;">​</a></h3><ul><li>对象、数组、函数（引用类型）</li><li>动态的读写</li><li>不具备很高的实时性，由单独的 gc 线程控制</li></ul>',31),i=[l];function h(c,n,s,d,u,b){return e(),t("div",null,i)}const k=a(r,[["render",h]]);export{p as __pageData,k as default};
+import{_ as a,o as e,c as t,Q as o}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"JS 的存储结构","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/storage-struct.md","filePath":"notes/javascript/storage-struct.md","lastUpdated":1670330848000}'),r={name:"notes/javascript/storage-struct.md"},l=o('<h1 id="js-的存储结构" tabindex="-1">JS 的存储结构 <a class="header-anchor" href="#js-的存储结构" aria-label="Permalink to &quot;JS 的存储结构&quot;">​</a></h1><h2 id="栈结构" tabindex="-1">栈结构 <a class="header-anchor" href="#栈结构" aria-label="Permalink to &quot;栈结构&quot;">​</a></h2><h3 id="调用栈" tabindex="-1">调用栈 <a class="header-anchor" href="#调用栈" aria-label="Permalink to &quot;调用栈&quot;">​</a></h3><blockquote><p>管理函数调用的关系的一种数据结构</p></blockquote><h3 id="函数调用" tabindex="-1">函数调用 <a class="header-anchor" href="#函数调用" aria-label="Permalink to &quot;函数调用&quot;">​</a></h3><blockquote><p>运行一个函数，函数名称跟着一对小括号执行</p></blockquote><h3 id="栈" tabindex="-1">栈 <a class="header-anchor" href="#栈" aria-label="Permalink to &quot;栈&quot;">​</a></h3><blockquote><p>一种数据结构，后进先出</p></blockquote><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><blockquote><p>在执行上下文创建以后，JavaScript 引擎会将执行上下文压入栈中，把这种管理执行上下文称为执行上下文栈，即调用栈 函数执行完毕之后，JavaScript 引擎会将函数的上下文出栈</p></blockquote><h3 id="栈溢出" tabindex="-1">栈溢出 <a class="header-anchor" href="#栈溢出" aria-label="Permalink to &quot;栈溢出&quot;">​</a></h3><blockquote><p>调用栈是有大小的（容量限制），超过一定数目，就会栈溢出</p></blockquote><h2 id="内存空间" tabindex="-1">内存空间 <a class="header-anchor" href="#内存空间" aria-label="Permalink to &quot;内存空间&quot;">​</a></h2><p>代码空间、栈空间、堆空间</p><blockquote><p>基本原始类型</p></blockquote><p>Number, String, Boolean, Undefined, Null, Symbol, BigInt(存放安全数据，超出范围安全处理)</p><blockquote><p>引用类型</p></blockquote><p>Object</p><h3 id="代码空间" tabindex="-1">代码空间 <a class="header-anchor" href="#代码空间" aria-label="Permalink to &quot;代码空间&quot;">​</a></h3><p>存放可执行代码</p><h3 id="栈空间" tabindex="-1">栈空间 <a class="header-anchor" href="#栈空间" aria-label="Permalink to &quot;栈空间&quot;">​</a></h3><p>基本原始类型数据存放与栈空间中（调用栈）</p><h3 id="堆空间" tabindex="-1">堆空间 <a class="header-anchor" href="#堆空间" aria-label="Permalink to &quot;堆空间&quot;">​</a></h3><p>引用类型存放与堆空间中（存放的是引用地址）</p><h2 id="js-内存管理-变量分配" tabindex="-1">JS 内存管理 变量分配 <a class="header-anchor" href="#js-内存管理-变量分配" aria-label="Permalink to &quot;JS 内存管理 变量分配&quot;">​</a></h2><h3 id="静态区" tabindex="-1">静态区 <a class="header-anchor" href="#静态区" aria-label="Permalink to &quot;静态区&quot;">​</a></h3><ul><li>存放全局变量（基本类型）</li></ul><h3 id="调用栈-1" tabindex="-1">调用栈 <a class="header-anchor" href="#调用栈-1" aria-label="Permalink to &quot;调用栈&quot;">​</a></h3><ul><li>栈中执行上下文（作用域链 = 变量对象、this 指向环境）</li><li>只能读写自己栈帧的内存</li><li>调用栈调用结束自然销毁，实时性高</li></ul><h3 id="堆" tabindex="-1">堆 <a class="header-anchor" href="#堆" aria-label="Permalink to &quot;堆&quot;">​</a></h3><ul><li>对象、数组、函数（引用类型）</li><li>动态的读写</li><li>不具备很高的实时性，由单独的 gc 线程控制</li></ul>',31),i=[l];function h(c,n,s,d,u,b){return e(),t("div",null,i)}const k=a(r,[["render",h]]);export{p as __pageData,k as default};
diff --git a/assets/notes_javascript_storage-struct.md.43266820.lean.js b/assets/notes_javascript_storage-struct.md.0cab0c00.lean.js
similarity index 73%
rename from assets/notes_javascript_storage-struct.md.43266820.lean.js
rename to assets/notes_javascript_storage-struct.md.0cab0c00.lean.js
index e08543b..c3307f8 100644
--- a/assets/notes_javascript_storage-struct.md.43266820.lean.js
+++ b/assets/notes_javascript_storage-struct.md.0cab0c00.lean.js
@@ -1 +1 @@
-import{_ as a,o as e,c as t,Q as o}from"./chunks/framework.7c0fadea.js";const p=JSON.parse('{"title":"JS 的存储结构","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/storage-struct.md","filePath":"notes/javascript/storage-struct.md","lastUpdated":1670330848000}'),r={name:"notes/javascript/storage-struct.md"},l=o("",31),i=[l];function h(c,n,s,d,u,b){return e(),t("div",null,i)}const k=a(r,[["render",h]]);export{p as __pageData,k as default};
+import{_ as a,o as e,c as t,Q as o}from"./chunks/framework.0e8ae64e.js";const p=JSON.parse('{"title":"JS 的存储结构","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/storage-struct.md","filePath":"notes/javascript/storage-struct.md","lastUpdated":1670330848000}'),r={name:"notes/javascript/storage-struct.md"},l=o("",31),i=[l];function h(c,n,s,d,u,b){return e(),t("div",null,i)}const k=a(r,[["render",h]]);export{p as __pageData,k as default};
diff --git a/assets/notes_javascript_this.md.532a6f9a.js b/assets/notes_javascript_this.md.e080543e.js
similarity index 99%
rename from assets/notes_javascript_this.md.532a6f9a.js
rename to assets/notes_javascript_this.md.e080543e.js
index d7ebdd2..56a616f 100644
--- a/assets/notes_javascript_this.md.532a6f9a.js
+++ b/assets/notes_javascript_this.md.e080543e.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"关于 this","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/this.md","filePath":"notes/javascript/this.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/this.md"},o=l(`<h1 id="关于-this" tabindex="-1">关于 this <a class="header-anchor" href="#关于-this" aria-label="Permalink to &quot;关于 this&quot;">​</a></h1><blockquote><p>this 提供一种优雅的方式来隐式传递一个对象的引用（自动引用合适的上下文对象）</p></blockquote><div class="tip custom-block"><p class="custom-block-title">this</p><p>this 的绑定和函数声明的位置没有任何关系，只取决函数的调用方式（当一个函数调用时，会创建一个活动记录 or 执行上下文, 这个记录会包含函数在哪里被调用、函数的调用、函数的参数等信息；this 就是记录其中的一个属性，会在函数执行的过程中调用）</p></div><h2 id="误解" tabindex="-1">误解 <a class="header-anchor" href="#误解" aria-label="Permalink to &quot;误解&quot;">​</a></h2><ul><li>❎ 指向函数（所有 JavaScript 函数都可以看成对象）本身</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 具名函数</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"关于 this","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/this.md","filePath":"notes/javascript/this.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/this.md"},o=l(`<h1 id="关于-this" tabindex="-1">关于 this <a class="header-anchor" href="#关于-this" aria-label="Permalink to &quot;关于 this&quot;">​</a></h1><blockquote><p>this 提供一种优雅的方式来隐式传递一个对象的引用（自动引用合适的上下文对象）</p></blockquote><div class="tip custom-block"><p class="custom-block-title">this</p><p>this 的绑定和函数声明的位置没有任何关系，只取决函数的调用方式（当一个函数调用时，会创建一个活动记录 or 执行上下文, 这个记录会包含函数在哪里被调用、函数的调用、函数的参数等信息；this 就是记录其中的一个属性，会在函数执行的过程中调用）</p></div><h2 id="误解" tabindex="-1">误解 <a class="header-anchor" href="#误解" aria-label="Permalink to &quot;误解&quot;">​</a></h2><ul><li>❎ 指向函数（所有 JavaScript 函数都可以看成对象）本身</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 具名函数</span></span>
 <span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">foo</span><span style="color:#E1E4E8;">() {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#6A737D;">// 不可行</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">this</span><span style="color:#E1E4E8;">.count</span><span style="color:#F97583;">++</span><span style="color:#E1E4E8;">;</span></span>
diff --git a/assets/notes_javascript_this.md.532a6f9a.lean.js b/assets/notes_javascript_this.md.e080543e.lean.js
similarity index 71%
rename from assets/notes_javascript_this.md.532a6f9a.lean.js
rename to assets/notes_javascript_this.md.e080543e.lean.js
index 899a484..ba7b498 100644
--- a/assets/notes_javascript_this.md.532a6f9a.lean.js
+++ b/assets/notes_javascript_this.md.e080543e.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"关于 this","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/this.md","filePath":"notes/javascript/this.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/this.md"},o=l("",47),e=[o];function c(t,r,E,y,i,F){return n(),a("div",null,e)}const u=s(p,[["render",c]]);export{h as __pageData,u as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"关于 this","description":"","frontmatter":{},"headers":[],"relativePath":"notes/javascript/this.md","filePath":"notes/javascript/this.md","lastUpdated":1670330848000}'),p={name:"notes/javascript/this.md"},o=l("",47),e=[o];function c(t,r,E,y,i,F){return n(),a("div",null,e)}const u=s(p,[["render",c]]);export{h as __pageData,u as default};
diff --git a/assets/notes_nodejs_ansi.md.b4c1b09e.js b/assets/notes_nodejs_ansi.md.0e90e8a3.js
similarity index 96%
rename from assets/notes_nodejs_ansi.md.b4c1b09e.js
rename to assets/notes_nodejs_ansi.md.0e90e8a3.js
index 9004391..fc50672 100644
--- a/assets/notes_nodejs_ansi.md.b4c1b09e.js
+++ b/assets/notes_nodejs_ansi.md.0e90e8a3.js
@@ -1 +1 @@
-import{_ as t,o as d,c as e,Q as a}from"./chunks/framework.7c0fadea.js";const I=JSON.parse('{"title":"ANSI escape sequences","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/ansi.md","filePath":"notes/nodejs/ansi.md","lastUpdated":1682600590000}'),r={name:"notes/nodejs/ansi.md"},o=a('<h1 id="ansi-escape-sequences" tabindex="-1">ANSI escape sequences <a class="header-anchor" href="#ansi-escape-sequences" aria-label="Permalink to &quot;ANSI escape sequences&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">C0 C1</p><p>C0 与 C1 是 ISO/IEC 2022 定义的控制字符集，C0 控制字符集的码位范围是 hex00-1F，C1 控制字符集的码位范围是 hex80-9F</p></div><p>ANSI 转义序列</p><h2 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h2><p>一种带内信号的转义序列标准，用于控制视频文本终端上的的光标位置、颜色和其他选项</p><h2 id="转义序列" tabindex="-1">转义序列 <a class="header-anchor" href="#转义序列" aria-label="Permalink to &quot;转义序列&quot;">​</a></h2><p>所有序列都以 ASCII 字符 ESC（27/十六进制 0x1b）开头，第二个字节则是 0x40-0x5F（ASCII @A-Z[\\]^_）范围内的字符</p><blockquote><p>除 ESC 之外的其他 C0 代码</p></blockquote><ul><li>BEL</li><li>BS</li><li>CR</li><li>LF</li><li>FF</li><li>TAB</li><li>VT</li><li>SO</li><li>SI</li></ul><h2 id="csi-序列" tabindex="-1">CSI 序列 <a class="header-anchor" href="#csi-序列" aria-label="Permalink to &quot;CSI 序列&quot;">​</a></h2><p>CSI 序列由 <code>ESC [</code>、若干个（包括 0 个）参数字节、若干个中间字节，以及一个最终字节组成</p><blockquote><p>CSI 序列在 <code>ESC [</code>之后各个组成部分的字符范围</p></blockquote><table><thead><tr><th>组成部分</th><th>字符范围</th><th>ASCII</th></tr></thead><tbody><tr><td>参数字节</td><td>0x30–0x3F</td><td>0–9:;&lt;=&gt;?</td></tr><tr><td>中间字节</td><td>0x20–0x2F</td><td>空格、!&quot;#$%&amp;&#39;()*+,-./</td></tr><tr><td>最终字节</td><td>0x40–0x7E</td><td>@A–Z[]^_`a–z{</td></tr></tbody></table><blockquote><p>部分 ANSI 控制序列</p></blockquote><table><thead><tr><th>代码</th><th>名称</th><th>作用</th></tr></thead><tbody><tr><td>CSI n A</td><td>光标上移</td><td>光标向指定的方向移动 n 格，光标在屏幕边缘，无效</td></tr><tr><td>CSI n B</td><td>光标下移</td><td></td></tr><tr><td>CSI n C</td><td>光标前移</td><td></td></tr><tr><td>CSI n D</td><td>光标后移</td><td></td></tr><tr><td>CSI n E</td><td>光标移到下一行</td><td>光标移动到下面第 n（默认 1）行的开头</td></tr><tr><td>CSI n F</td><td>光标移到上一行</td><td>光标移动到上面第 n（默认 1）行的开头</td></tr><tr><td>CSI n G</td><td>光标后移</td><td>光标移动到第 n（默认 1）列</td></tr><tr><td>CSI n;m H</td><td>光标位置</td><td>光标移动到第 n 行、第 m 列。值从 1 开始，且默认为 1（左上角）</td></tr><tr><td>CSI n J</td><td>擦除显示</td><td>清除屏幕的部分区域（取值 0 1 2）</td></tr><tr><td>CSI n K</td><td>擦除行</td><td>清除行内的部分区域（取值 0 1 2）</td></tr><tr><td>CSI n S</td><td>向上滚动</td><td>整页向上滚动 n（默认 1）行</td></tr><tr><td>CSI n T</td><td>向下滚动</td><td>整页向下滚动 n（默认 1）行</td></tr><tr><td>CSI n m</td><td>SGR - 选择图形再现</td><td>设置 SGR 参数，包括文字颜色（CSI 0m 重置/常规）</td></tr></tbody></table><h1 id="更多" tabindex="-1">更多 <a class="header-anchor" href="#更多" aria-label="Permalink to &quot;更多&quot;">​</a></h1><p><a href="https://gist.github.com/fnky/458719343aabd01cfb17a3a4f7296797" target="_blank" rel="noreferrer">更多阅读</a></p>',17),n=[o];function s(l,i,c,h,S,p){return d(),e("div",null,n)}const u=t(r,[["render",s]]);export{I as __pageData,u as default};
+import{_ as t,o as d,c as e,Q as a}from"./chunks/framework.0e8ae64e.js";const I=JSON.parse('{"title":"ANSI escape sequences","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/ansi.md","filePath":"notes/nodejs/ansi.md","lastUpdated":1682600590000}'),r={name:"notes/nodejs/ansi.md"},o=a('<h1 id="ansi-escape-sequences" tabindex="-1">ANSI escape sequences <a class="header-anchor" href="#ansi-escape-sequences" aria-label="Permalink to &quot;ANSI escape sequences&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">C0 C1</p><p>C0 与 C1 是 ISO/IEC 2022 定义的控制字符集，C0 控制字符集的码位范围是 hex00-1F，C1 控制字符集的码位范围是 hex80-9F</p></div><p>ANSI 转义序列</p><h2 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h2><p>一种带内信号的转义序列标准，用于控制视频文本终端上的的光标位置、颜色和其他选项</p><h2 id="转义序列" tabindex="-1">转义序列 <a class="header-anchor" href="#转义序列" aria-label="Permalink to &quot;转义序列&quot;">​</a></h2><p>所有序列都以 ASCII 字符 ESC（27/十六进制 0x1b）开头，第二个字节则是 0x40-0x5F（ASCII @A-Z[\\]^_）范围内的字符</p><blockquote><p>除 ESC 之外的其他 C0 代码</p></blockquote><ul><li>BEL</li><li>BS</li><li>CR</li><li>LF</li><li>FF</li><li>TAB</li><li>VT</li><li>SO</li><li>SI</li></ul><h2 id="csi-序列" tabindex="-1">CSI 序列 <a class="header-anchor" href="#csi-序列" aria-label="Permalink to &quot;CSI 序列&quot;">​</a></h2><p>CSI 序列由 <code>ESC [</code>、若干个（包括 0 个）参数字节、若干个中间字节，以及一个最终字节组成</p><blockquote><p>CSI 序列在 <code>ESC [</code>之后各个组成部分的字符范围</p></blockquote><table><thead><tr><th>组成部分</th><th>字符范围</th><th>ASCII</th></tr></thead><tbody><tr><td>参数字节</td><td>0x30–0x3F</td><td>0–9:;&lt;=&gt;?</td></tr><tr><td>中间字节</td><td>0x20–0x2F</td><td>空格、!&quot;#$%&amp;&#39;()*+,-./</td></tr><tr><td>最终字节</td><td>0x40–0x7E</td><td>@A–Z[]^_`a–z{</td></tr></tbody></table><blockquote><p>部分 ANSI 控制序列</p></blockquote><table><thead><tr><th>代码</th><th>名称</th><th>作用</th></tr></thead><tbody><tr><td>CSI n A</td><td>光标上移</td><td>光标向指定的方向移动 n 格，光标在屏幕边缘，无效</td></tr><tr><td>CSI n B</td><td>光标下移</td><td></td></tr><tr><td>CSI n C</td><td>光标前移</td><td></td></tr><tr><td>CSI n D</td><td>光标后移</td><td></td></tr><tr><td>CSI n E</td><td>光标移到下一行</td><td>光标移动到下面第 n（默认 1）行的开头</td></tr><tr><td>CSI n F</td><td>光标移到上一行</td><td>光标移动到上面第 n（默认 1）行的开头</td></tr><tr><td>CSI n G</td><td>光标后移</td><td>光标移动到第 n（默认 1）列</td></tr><tr><td>CSI n;m H</td><td>光标位置</td><td>光标移动到第 n 行、第 m 列。值从 1 开始，且默认为 1（左上角）</td></tr><tr><td>CSI n J</td><td>擦除显示</td><td>清除屏幕的部分区域（取值 0 1 2）</td></tr><tr><td>CSI n K</td><td>擦除行</td><td>清除行内的部分区域（取值 0 1 2）</td></tr><tr><td>CSI n S</td><td>向上滚动</td><td>整页向上滚动 n（默认 1）行</td></tr><tr><td>CSI n T</td><td>向下滚动</td><td>整页向下滚动 n（默认 1）行</td></tr><tr><td>CSI n m</td><td>SGR - 选择图形再现</td><td>设置 SGR 参数，包括文字颜色（CSI 0m 重置/常规）</td></tr></tbody></table><h1 id="更多" tabindex="-1">更多 <a class="header-anchor" href="#更多" aria-label="Permalink to &quot;更多&quot;">​</a></h1><p><a href="https://gist.github.com/fnky/458719343aabd01cfb17a3a4f7296797" target="_blank" rel="noreferrer">更多阅读</a></p>',17),n=[o];function s(l,i,c,h,S,p){return d(),e("div",null,n)}const u=t(r,[["render",s]]);export{I as __pageData,u as default};
diff --git a/assets/notes_nodejs_ansi.md.b4c1b09e.lean.js b/assets/notes_nodejs_ansi.md.0e90e8a3.lean.js
similarity index 70%
rename from assets/notes_nodejs_ansi.md.b4c1b09e.lean.js
rename to assets/notes_nodejs_ansi.md.0e90e8a3.lean.js
index be1cd0c..3057c56 100644
--- a/assets/notes_nodejs_ansi.md.b4c1b09e.lean.js
+++ b/assets/notes_nodejs_ansi.md.0e90e8a3.lean.js
@@ -1 +1 @@
-import{_ as t,o as d,c as e,Q as a}from"./chunks/framework.7c0fadea.js";const I=JSON.parse('{"title":"ANSI escape sequences","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/ansi.md","filePath":"notes/nodejs/ansi.md","lastUpdated":1682600590000}'),r={name:"notes/nodejs/ansi.md"},o=a("",17),n=[o];function s(l,i,c,h,S,p){return d(),e("div",null,n)}const u=t(r,[["render",s]]);export{I as __pageData,u as default};
+import{_ as t,o as d,c as e,Q as a}from"./chunks/framework.0e8ae64e.js";const I=JSON.parse('{"title":"ANSI escape sequences","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/ansi.md","filePath":"notes/nodejs/ansi.md","lastUpdated":1682600590000}'),r={name:"notes/nodejs/ansi.md"},o=a("",17),n=[o];function s(l,i,c,h,S,p){return d(),e("div",null,n)}const u=t(r,[["render",s]]);export{I as __pageData,u as default};
diff --git a/assets/notes_nodejs_event-loop.md.95affbd8.js b/assets/notes_nodejs_event-loop.md.f5078491.js
similarity index 98%
rename from assets/notes_nodejs_event-loop.md.95affbd8.js
rename to assets/notes_nodejs_event-loop.md.f5078491.js
index 92dc745..2fe84dc 100644
--- a/assets/notes_nodejs_event-loop.md.95affbd8.js
+++ b/assets/notes_nodejs_event-loop.md.f5078491.js
@@ -1,3 +1,3 @@
-import{_ as e,o as l,c as a,Q as s}from"./chunks/framework.7c0fadea.js";const k=JSON.parse('{"title":"Nodejs 事件循环","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/event-loop.md","filePath":"notes/nodejs/event-loop.md","lastUpdated":1698285484000}'),i={name:"notes/nodejs/event-loop.md"},t=s(`<h1 id="nodejs-事件循环" tabindex="-1">Nodejs 事件循环 <a class="header-anchor" href="#nodejs-事件循环" aria-label="Permalink to &quot;Nodejs 事件循环&quot;">​</a></h1><h2 id="理解" tabindex="-1">理解 <a class="header-anchor" href="#理解" aria-label="Permalink to &quot;理解&quot;">​</a></h2><h3 id="非阻塞-i-o-操作的设计机制" tabindex="-1">非阻塞 I/O 操作的设计机制 <a class="header-anchor" href="#非阻塞-i-o-操作的设计机制" aria-label="Permalink to &quot;非阻塞 I/O 操作的设计机制&quot;">​</a></h3><ul><li>Timer: 定时器运行 setTimeout setInterval</li><li>Pending Callback: 挂起的回调，执行延迟到下一个循环迭代的 I/O 回调(TCP 的错误处理延迟到这里执行)</li><li>Idle, Prepare: 仅在内部使用</li><li>Poll: 轮询，检索新的 I/O 事件，执行与 I/O 相关的回调（计时器和 setImmediated()调度之外） <ul><li>计算应该阻塞和轮询 I/O 的时间</li><li>处理轮询队列中的事件（没有被调度的计时器时） <ul><li>轮询队列为空 <ul><li>如果脚本被 setImmediate() 调度，则事件结束轮询阶段，并到 Check 阶段继续执行 setImmediate() 调度的脚本</li><li>未被 setImmediate() 调度，则事件循环将等待回调被添加到队列中，然后立即执行</li></ul></li><li>轮询队列不为空 <ul><li>事件循环将循环访问回调队列并执行他们，直到队列用尽，或者达到了与系统相关的硬性限制</li></ul></li></ul></li></ul></li><li>Check: setImmeidate 检查是否执行</li><li>Close Callback: 关闭的回调函数（socket.on(&#39;close))</li></ul><h3 id="process-nexttick-又是如何执行" tabindex="-1">process.nextTick 又是如何执行？ <a class="header-anchor" href="#process-nexttick-又是如何执行" aria-label="Permalink to &quot;process.nextTick 又是如何执行？&quot;">​</a></h3><ul><li>异步 API</li></ul><blockquote><p>任何时候再给定的阶段中调用 process.nextTick()，所以传递到 process.nextTick() 的回调将在事件循环继续之前解析。</p></blockquote><ul><li>造成任务饿死</li></ul><p>一直调用 process.nextTick() 从而导致事件循环无法到达轮询阶段（递归调用 process.nextTick() 不允许超过 V8 的最大调用堆栈大小）</p><div class="tip custom-block"><p class="custom-block-title">事件循环图</p><p>┌───────────────────────────┐ ┌─&gt;│ timers │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ │ │ pending callbacks │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ │ │ idle, prepare │ │ └─────────────┬─────────────┘ ┌───────────────┐ │ ┌─────────────┴─────────────┐ │ incoming: │ │ │ poll │&lt;─────┤ connections, │ │ └─────────────┬─────────────┘ │ data, etc. │ │ ┌─────────────┴─────────────┐ └───────────────┘ │ │ check │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ └──┤ close callbacks │ └───────────────────────────┘</p></div><h2 id="定时器-timers" tabindex="-1">定时器 timers <a class="header-anchor" href="#定时器-timers" aria-label="Permalink to &quot;定时器 timers&quot;">​</a></h2><p>本阶段执行已经被 setTimeout() 和 setInterval() 的调度回调函数</p><ul><li>执行所提供的回调的阈值，而不是用户希望其执行的确切时间（计时器回调尽可能早的运行，但是操作系统调度或其它正在运行的回调可能会存在延迟）</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 100ms !== 阈值</span></span>
+import{_ as e,o as l,c as a,Q as s}from"./chunks/framework.0e8ae64e.js";const k=JSON.parse('{"title":"Nodejs 事件循环","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/event-loop.md","filePath":"notes/nodejs/event-loop.md","lastUpdated":1698285484000}'),i={name:"notes/nodejs/event-loop.md"},t=s(`<h1 id="nodejs-事件循环" tabindex="-1">Nodejs 事件循环 <a class="header-anchor" href="#nodejs-事件循环" aria-label="Permalink to &quot;Nodejs 事件循环&quot;">​</a></h1><h2 id="理解" tabindex="-1">理解 <a class="header-anchor" href="#理解" aria-label="Permalink to &quot;理解&quot;">​</a></h2><h3 id="非阻塞-i-o-操作的设计机制" tabindex="-1">非阻塞 I/O 操作的设计机制 <a class="header-anchor" href="#非阻塞-i-o-操作的设计机制" aria-label="Permalink to &quot;非阻塞 I/O 操作的设计机制&quot;">​</a></h3><ul><li>Timer: 定时器运行 setTimeout setInterval</li><li>Pending Callback: 挂起的回调，执行延迟到下一个循环迭代的 I/O 回调(TCP 的错误处理延迟到这里执行)</li><li>Idle, Prepare: 仅在内部使用</li><li>Poll: 轮询，检索新的 I/O 事件，执行与 I/O 相关的回调（计时器和 setImmediated()调度之外） <ul><li>计算应该阻塞和轮询 I/O 的时间</li><li>处理轮询队列中的事件（没有被调度的计时器时） <ul><li>轮询队列为空 <ul><li>如果脚本被 setImmediate() 调度，则事件结束轮询阶段，并到 Check 阶段继续执行 setImmediate() 调度的脚本</li><li>未被 setImmediate() 调度，则事件循环将等待回调被添加到队列中，然后立即执行</li></ul></li><li>轮询队列不为空 <ul><li>事件循环将循环访问回调队列并执行他们，直到队列用尽，或者达到了与系统相关的硬性限制</li></ul></li></ul></li></ul></li><li>Check: setImmeidate 检查是否执行</li><li>Close Callback: 关闭的回调函数（socket.on(&#39;close))</li></ul><h3 id="process-nexttick-又是如何执行" tabindex="-1">process.nextTick 又是如何执行？ <a class="header-anchor" href="#process-nexttick-又是如何执行" aria-label="Permalink to &quot;process.nextTick 又是如何执行？&quot;">​</a></h3><ul><li>异步 API</li></ul><blockquote><p>任何时候再给定的阶段中调用 process.nextTick()，所以传递到 process.nextTick() 的回调将在事件循环继续之前解析。</p></blockquote><ul><li>造成任务饿死</li></ul><p>一直调用 process.nextTick() 从而导致事件循环无法到达轮询阶段（递归调用 process.nextTick() 不允许超过 V8 的最大调用堆栈大小）</p><div class="tip custom-block"><p class="custom-block-title">事件循环图</p><p>┌───────────────────────────┐ ┌─&gt;│ timers │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ │ │ pending callbacks │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ │ │ idle, prepare │ │ └─────────────┬─────────────┘ ┌───────────────┐ │ ┌─────────────┴─────────────┐ │ incoming: │ │ │ poll │&lt;─────┤ connections, │ │ └─────────────┬─────────────┘ │ data, etc. │ │ ┌─────────────┴─────────────┐ └───────────────┘ │ │ check │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ └──┤ close callbacks │ └───────────────────────────┘</p></div><h2 id="定时器-timers" tabindex="-1">定时器 timers <a class="header-anchor" href="#定时器-timers" aria-label="Permalink to &quot;定时器 timers&quot;">​</a></h2><p>本阶段执行已经被 setTimeout() 和 setInterval() 的调度回调函数</p><ul><li>执行所提供的回调的阈值，而不是用户希望其执行的确切时间（计时器回调尽可能早的运行，但是操作系统调度或其它正在运行的回调可能会存在延迟）</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 100ms !== 阈值</span></span>
 <span class="line"><span style="color:#B392F0;">setTimeout</span><span style="color:#E1E4E8;">(</span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {}, </span><span style="color:#79B8FF;">100</span><span style="color:#E1E4E8;">);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// 100ms !== 阈值</span></span>
 <span class="line"><span style="color:#6F42C1;">setTimeout</span><span style="color:#24292E;">(</span><span style="color:#D73A49;">function</span><span style="color:#24292E;">() {}, </span><span style="color:#005CC5;">100</span><span style="color:#24292E;">);</span></span></code></pre></div><ul><li>轮询阶段控制何时定时器执行</li></ul><h2 id="待定的回调-pending-callbacks" tabindex="-1">待定的回调 pending callbacks <a class="header-anchor" href="#待定的回调-pending-callbacks" aria-label="Permalink to &quot;待定的回调 pending callbacks&quot;">​</a></h2><p>执行延迟到下一个循环迭代的 I/O 回调</p><ul><li>挂起的回调函数（持续连接 TCP 套接字在尝试连接时接收到 <code>ECONNREFUSED</code>)</li></ul><h2 id="idle-prepare" tabindex="-1">idle prepare <a class="header-anchor" href="#idle-prepare" aria-label="Permalink to &quot;idle prepare&quot;">​</a></h2><p>系统内部使用</p><h2 id="轮询-poll" tabindex="-1">轮询 poll <a class="header-anchor" href="#轮询-poll" aria-label="Permalink to &quot;轮询 poll&quot;">​</a></h2><p>检索新的 I/O 事件，执行与 I/O 相关的回调（几乎所有情况下，除了关闭的回调函数，计时器和 setImmediate() 调度的之外）其余情况 node 将在适当的时候阻塞</p><ul><li><p>计算应该阻塞和轮询 I/O 的时间</p></li><li><p>处理轮询队列里的事件</p><ul><li>轮询队列不为空，事件循环将循环访问回调队列并同步执行他们，直到队列为空，或者达到了与系统相关的硬性限制</li><li>轮询队列为空，如果脚本被 setImmediate() 调度，则事件循环将结束轮询阶段，并继续检查阶段以执行哪些被调度的脚本；如果脚本未被 setImmediate() 调度，则事件循环将等待回调被添加到队列中，然后立即执行</li></ul></li><li><p>一旦轮询队列为空，事件循环将检查已达到阈值的计时器，如果一个或多个计时器已准备就绪，则事件循环将绕回计时器阶段以执行计时器回调</p></li></ul><h2 id="检测-check" tabindex="-1">检测 check <a class="header-anchor" href="#检测-check" aria-label="Permalink to &quot;检测 check&quot;">​</a></h2><p>setImmediate() 回调函数在这里执行</p><ul><li>轮询阶段完成后立即执行回调，轮询阶段变为空闲状态，脚本使用 setImmediate() 后被排列在队列中，则事件循环可能继续到检查阶段而不是等待</li><li>setImmediate() 事件循环中的单独阶段运行的特殊及时器（libuv API 安排回调在轮询阶段完成后立即执行）</li></ul><h2 id="关闭的回调函数-close-callbacks" tabindex="-1">关闭的回调函数 close callbacks <a class="header-anchor" href="#关闭的回调函数-close-callbacks" aria-label="Permalink to &quot;关闭的回调函数 close callbacks&quot;">​</a></h2><p>一些关闭的回调函数 socket.o(&#39;close&#39;, ...)</p><ul><li>套接字或处理函数关闭（socket.destroy())，close 事件在这个阶段发出，否则（process.nextTick()) 发出</li></ul><h2 id="settimeout-vs-setimmediate" tabindex="-1">setTimeout() VS setImmediate() <a class="header-anchor" href="#settimeout-vs-setimmediate" aria-label="Permalink to &quot;setTimeout() VS setImmediate()&quot;">​</a></h2><ul><li>setImmediate() 一旦在当前轮询阶段完成，就执行脚本</li><li>setTimeout() 轮询阶段计算出来的阈值（ms）过后运行脚本</li></ul><ol><li>主模块中运行（非确定性）</li><li>运行在 I/O 循环内调用，setImmediate 总是被优先调用</li></ol><h2 id="process-nexttick" tabindex="-1">process.nextTick <a class="header-anchor" href="#process-nexttick" aria-label="Permalink to &quot;process.nextTick&quot;">​</a></h2><ul><li><p>不是事件循环的一部分，在当前操作完成后处理 nextTickQueue，<code>允许通过递归调用来阻止I/O，阻止事件到达轮询阶段</code></p></li><li><p>保证用户代码的其余部分之后在让事件循环继续进行之前，执行其回调函数</p></li><li><p>回调置于 process.nextTick() 中，脚本仍具有运行完成的能力，允许在调用回调之前初始化所有的变量、函数</p></li><li><p>不让事件循环继续的优点，适用于让事件循环继续之前，警告用户发生错误的情况</p></li></ul><h3 id="process-nexttick-vs-setimmediate" tabindex="-1">process.nextTick() VS setImmediate() <a class="header-anchor" href="#process-nexttick-vs-setimmediate" aria-label="Permalink to &quot;process.nextTick() VS setImmediate()&quot;">​</a></h3><ul><li>process.nextTick() 在同一个阶段立即执行</li><li>setImmeidate() 在事件循环的接下来的 tick 上触发</li></ul><h3 id="为什么使用-process-nexttick" tabindex="-1">为什么使用 process.nextTick() <a class="header-anchor" href="#为什么使用-process-nexttick" aria-label="Permalink to &quot;为什么使用 process.nextTick()&quot;">​</a></h3><ol><li>允许用户处理错误，清理任何不需要的资源，或者在事件循环继续之前重试请求</li><li>让回调在栈展开后，但在事件循环继续之前运行的必要</li></ol>`,38),o=[t];function c(n,r,p,d,h,u){return l(),a("div",null,o)}const b=e(i,[["render",c]]);export{k as __pageData,b as default};
diff --git a/assets/notes_nodejs_event-loop.md.95affbd8.lean.js b/assets/notes_nodejs_event-loop.md.f5078491.lean.js
similarity index 71%
rename from assets/notes_nodejs_event-loop.md.95affbd8.lean.js
rename to assets/notes_nodejs_event-loop.md.f5078491.lean.js
index b5c8b0b..4cdb343 100644
--- a/assets/notes_nodejs_event-loop.md.95affbd8.lean.js
+++ b/assets/notes_nodejs_event-loop.md.f5078491.lean.js
@@ -1 +1 @@
-import{_ as e,o as l,c as a,Q as s}from"./chunks/framework.7c0fadea.js";const k=JSON.parse('{"title":"Nodejs 事件循环","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/event-loop.md","filePath":"notes/nodejs/event-loop.md","lastUpdated":1698285484000}'),i={name:"notes/nodejs/event-loop.md"},t=s("",38),o=[t];function c(n,r,p,d,h,u){return l(),a("div",null,o)}const b=e(i,[["render",c]]);export{k as __pageData,b as default};
+import{_ as e,o as l,c as a,Q as s}from"./chunks/framework.0e8ae64e.js";const k=JSON.parse('{"title":"Nodejs 事件循环","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/event-loop.md","filePath":"notes/nodejs/event-loop.md","lastUpdated":1698285484000}'),i={name:"notes/nodejs/event-loop.md"},t=s("",38),o=[t];function c(n,r,p,d,h,u){return l(),a("div",null,o)}const b=e(i,[["render",c]]);export{k as __pageData,b as default};
diff --git a/assets/notes_nodejs_npm.md.794dc498.js b/assets/notes_nodejs_npm.md.990b6f83.js
similarity index 93%
rename from assets/notes_nodejs_npm.md.794dc498.js
rename to assets/notes_nodejs_npm.md.990b6f83.js
index 5b75ba8..84c12f1 100644
--- a/assets/notes_nodejs_npm.md.794dc498.js
+++ b/assets/notes_nodejs_npm.md.990b6f83.js
@@ -1 +1 @@
-import{_ as l,o as i,c as e,Q as a}from"./chunks/framework.7c0fadea.js";const x=JSON.parse('{"title":"package.json","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/npm.md","filePath":"notes/nodejs/npm.md","lastUpdated":1670330848000}'),n={name:"notes/nodejs/npm.md"},o=a('<h1 id="package-json" tabindex="-1">package.json <a class="header-anchor" href="#package-json" aria-label="Permalink to &quot;package.json&quot;">​</a></h1><p>package.json 中的配置</p><h2 id="json-配置" tabindex="-1">json 配置 <a class="header-anchor" href="#json-配置" aria-label="Permalink to &quot;json 配置&quot;">​</a></h2><ul><li><p>name 包名</p></li><li><p>version 版本号</p></li><li><p>description 描述</p></li><li><p>keywords 关键词</p></li><li><p>homepage 主页</p></li><li><p>bugs 发布包 bug 日志</p><ul><li>{url: &#39;xxx&#39;, email: &#39;xxx&#39;} or [] or string</li></ul></li><li><p>license 凭证</p><ul><li>{type: &#39;ISC&#39;, url: &#39;xxx&#39;} or [] or string</li></ul></li><li><p>people fields: author contributors</p><ul><li>name, email, url</li></ul></li><li><p>funding 更新日志信息</p><ul><li>{type: &#39;xxx&#39;, url: &#39;xxx&#39;} or []</li></ul></li><li><p>files 指定哪些文件需要上传到包中（include files)</p><ul><li>exclude files === .gitignore .npmignore</li></ul></li><li><p>main 入口文件</p></li><li><p>browser 指定运行环境</p></li><li><p>bin 可执行命令</p><ul><li>{myapp: &#39;./cli.js&#39;} 默认命令为包名 npm 安装时会在 node_modules/.bin/myapp</li><li>cli.js 文件开头加入以下代码 !#/usr/bin/env node 指定运行环境变量</li></ul></li><li><p>man 手册帮助</p></li></ul>',4),p=[o];function s(t,r,c,u,d,_){return i(),e("div",null,p)}const h=l(n,[["render",s]]);export{x as __pageData,h as default};
+import{_ as l,o as i,c as e,Q as a}from"./chunks/framework.0e8ae64e.js";const x=JSON.parse('{"title":"package.json","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/npm.md","filePath":"notes/nodejs/npm.md","lastUpdated":1670330848000}'),n={name:"notes/nodejs/npm.md"},o=a('<h1 id="package-json" tabindex="-1">package.json <a class="header-anchor" href="#package-json" aria-label="Permalink to &quot;package.json&quot;">​</a></h1><p>package.json 中的配置</p><h2 id="json-配置" tabindex="-1">json 配置 <a class="header-anchor" href="#json-配置" aria-label="Permalink to &quot;json 配置&quot;">​</a></h2><ul><li><p>name 包名</p></li><li><p>version 版本号</p></li><li><p>description 描述</p></li><li><p>keywords 关键词</p></li><li><p>homepage 主页</p></li><li><p>bugs 发布包 bug 日志</p><ul><li>{url: &#39;xxx&#39;, email: &#39;xxx&#39;} or [] or string</li></ul></li><li><p>license 凭证</p><ul><li>{type: &#39;ISC&#39;, url: &#39;xxx&#39;} or [] or string</li></ul></li><li><p>people fields: author contributors</p><ul><li>name, email, url</li></ul></li><li><p>funding 更新日志信息</p><ul><li>{type: &#39;xxx&#39;, url: &#39;xxx&#39;} or []</li></ul></li><li><p>files 指定哪些文件需要上传到包中（include files)</p><ul><li>exclude files === .gitignore .npmignore</li></ul></li><li><p>main 入口文件</p></li><li><p>browser 指定运行环境</p></li><li><p>bin 可执行命令</p><ul><li>{myapp: &#39;./cli.js&#39;} 默认命令为包名 npm 安装时会在 node_modules/.bin/myapp</li><li>cli.js 文件开头加入以下代码 !#/usr/bin/env node 指定运行环境变量</li></ul></li><li><p>man 手册帮助</p></li></ul>',4),p=[o];function s(t,r,c,u,d,_){return i(),e("div",null,p)}const h=l(n,[["render",s]]);export{x as __pageData,h as default};
diff --git a/assets/notes_nodejs_npm.md.794dc498.lean.js b/assets/notes_nodejs_npm.md.990b6f83.lean.js
similarity index 70%
rename from assets/notes_nodejs_npm.md.794dc498.lean.js
rename to assets/notes_nodejs_npm.md.990b6f83.lean.js
index 6944206..ab50b18 100644
--- a/assets/notes_nodejs_npm.md.794dc498.lean.js
+++ b/assets/notes_nodejs_npm.md.990b6f83.lean.js
@@ -1 +1 @@
-import{_ as l,o as i,c as e,Q as a}from"./chunks/framework.7c0fadea.js";const x=JSON.parse('{"title":"package.json","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/npm.md","filePath":"notes/nodejs/npm.md","lastUpdated":1670330848000}'),n={name:"notes/nodejs/npm.md"},o=a("",4),p=[o];function s(t,r,c,u,d,_){return i(),e("div",null,p)}const h=l(n,[["render",s]]);export{x as __pageData,h as default};
+import{_ as l,o as i,c as e,Q as a}from"./chunks/framework.0e8ae64e.js";const x=JSON.parse('{"title":"package.json","description":"","frontmatter":{},"headers":[],"relativePath":"notes/nodejs/npm.md","filePath":"notes/nodejs/npm.md","lastUpdated":1670330848000}'),n={name:"notes/nodejs/npm.md"},o=a("",4),p=[o];function s(t,r,c,u,d,_){return i(),e("div",null,p)}const h=l(n,[["render",s]]);export{x as __pageData,h as default};
diff --git a/assets/notes_regexp_base.md.5f3b85d0.js b/assets/notes_regexp_base.md.80469b71.js
similarity index 92%
rename from assets/notes_regexp_base.md.5f3b85d0.js
rename to assets/notes_regexp_base.md.80469b71.js
index bc35a8d..cea4d98 100644
--- a/assets/notes_regexp_base.md.5f3b85d0.js
+++ b/assets/notes_regexp_base.md.80469b71.js
@@ -1 +1 @@
-import{_ as t,o as a,c as s,k as e,a as n}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"正则表达式","description":"","frontmatter":{},"headers":[],"relativePath":"notes/regexp/base.md","filePath":"notes/regexp/base.md","lastUpdated":1670330848000}'),l={name:"notes/regexp/base.md"},o=e("h1",{id:"正则表达式",tabindex:"-1"},[n("正则表达式 "),e("a",{class:"header-anchor",href:"#正则表达式","aria-label":'Permalink to "正则表达式"'},"​")],-1),r=e("table",null,[e("thead",null,[e("tr",null,[e("th",null,"元字符"),e("th",null,"描述")])]),e("tbody",null,[e("tr",null,[e("td",null,"\\"),e("td",null,"将下一个字符标记符、或一个向后引用、或一个八进制转义符。")])])],-1),d=[o,r];function c(i,_,p,h,u,m){return a(),s("div",null,d)}const x=t(l,[["render",c]]);export{b as __pageData,x as default};
+import{_ as t,o as a,c as s,k as e,a as n}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"正则表达式","description":"","frontmatter":{},"headers":[],"relativePath":"notes/regexp/base.md","filePath":"notes/regexp/base.md","lastUpdated":1670330848000}'),l={name:"notes/regexp/base.md"},o=e("h1",{id:"正则表达式",tabindex:"-1"},[n("正则表达式 "),e("a",{class:"header-anchor",href:"#正则表达式","aria-label":'Permalink to "正则表达式"'},"​")],-1),r=e("table",null,[e("thead",null,[e("tr",null,[e("th",null,"元字符"),e("th",null,"描述")])]),e("tbody",null,[e("tr",null,[e("td",null,"\\"),e("td",null,"将下一个字符标记符、或一个向后引用、或一个八进制转义符。")])])],-1),d=[o,r];function c(i,_,p,h,u,m){return a(),s("div",null,d)}const x=t(l,[["render",c]]);export{b as __pageData,x as default};
diff --git a/assets/notes_regexp_base.md.5f3b85d0.lean.js b/assets/notes_regexp_base.md.80469b71.lean.js
similarity index 92%
rename from assets/notes_regexp_base.md.5f3b85d0.lean.js
rename to assets/notes_regexp_base.md.80469b71.lean.js
index bc35a8d..cea4d98 100644
--- a/assets/notes_regexp_base.md.5f3b85d0.lean.js
+++ b/assets/notes_regexp_base.md.80469b71.lean.js
@@ -1 +1 @@
-import{_ as t,o as a,c as s,k as e,a as n}from"./chunks/framework.7c0fadea.js";const b=JSON.parse('{"title":"正则表达式","description":"","frontmatter":{},"headers":[],"relativePath":"notes/regexp/base.md","filePath":"notes/regexp/base.md","lastUpdated":1670330848000}'),l={name:"notes/regexp/base.md"},o=e("h1",{id:"正则表达式",tabindex:"-1"},[n("正则表达式 "),e("a",{class:"header-anchor",href:"#正则表达式","aria-label":'Permalink to "正则表达式"'},"​")],-1),r=e("table",null,[e("thead",null,[e("tr",null,[e("th",null,"元字符"),e("th",null,"描述")])]),e("tbody",null,[e("tr",null,[e("td",null,"\\"),e("td",null,"将下一个字符标记符、或一个向后引用、或一个八进制转义符。")])])],-1),d=[o,r];function c(i,_,p,h,u,m){return a(),s("div",null,d)}const x=t(l,[["render",c]]);export{b as __pageData,x as default};
+import{_ as t,o as a,c as s,k as e,a as n}from"./chunks/framework.0e8ae64e.js";const b=JSON.parse('{"title":"正则表达式","description":"","frontmatter":{},"headers":[],"relativePath":"notes/regexp/base.md","filePath":"notes/regexp/base.md","lastUpdated":1670330848000}'),l={name:"notes/regexp/base.md"},o=e("h1",{id:"正则表达式",tabindex:"-1"},[n("正则表达式 "),e("a",{class:"header-anchor",href:"#正则表达式","aria-label":'Permalink to "正则表达式"'},"​")],-1),r=e("table",null,[e("thead",null,[e("tr",null,[e("th",null,"元字符"),e("th",null,"描述")])]),e("tbody",null,[e("tr",null,[e("td",null,"\\"),e("td",null,"将下一个字符标记符、或一个向后引用、或一个八进制转义符。")])])],-1),d=[o,r];function c(i,_,p,h,u,m){return a(),s("div",null,d)}const x=t(l,[["render",c]]);export{b as __pageData,x as default};
diff --git a/assets/notes_regexp_unknown.md.40d387f2.js b/assets/notes_regexp_unknown.md.ffcfd74a.js
similarity index 96%
rename from assets/notes_regexp_unknown.md.40d387f2.js
rename to assets/notes_regexp_unknown.md.ffcfd74a.js
index 471fa39..98df856 100644
--- a/assets/notes_regexp_unknown.md.40d387f2.js
+++ b/assets/notes_regexp_unknown.md.ffcfd74a.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as p}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"你不知道的正则表达式","description":"","frontmatter":{},"headers":[],"relativePath":"notes/regexp/unknown.md","filePath":"notes/regexp/unknown.md","lastUpdated":1670330848000}'),l={name:"notes/regexp/unknown.md"},o=p(`<h1 id="你不知道的正则表达式" tabindex="-1">你不知道的正则表达式 <a class="header-anchor" href="#你不知道的正则表达式" aria-label="Permalink to &quot;你不知道的正则表达式&quot;">​</a></h1><h2 id="逗号分隔千分位" tabindex="-1">逗号分隔千分位 <a class="header-anchor" href="#逗号分隔千分位" aria-label="Permalink to &quot;逗号分隔千分位&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;1234567890&#39;</span><span style="color:#E1E4E8;">;</span></span>
+import{_ as s,o as a,c as n,Q as p}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"你不知道的正则表达式","description":"","frontmatter":{},"headers":[],"relativePath":"notes/regexp/unknown.md","filePath":"notes/regexp/unknown.md","lastUpdated":1670330848000}'),l={name:"notes/regexp/unknown.md"},o=p(`<h1 id="你不知道的正则表达式" tabindex="-1">你不知道的正则表达式 <a class="header-anchor" href="#你不知道的正则表达式" aria-label="Permalink to &quot;你不知道的正则表达式&quot;">​</a></h1><h2 id="逗号分隔千分位" tabindex="-1">逗号分隔千分位 <a class="header-anchor" href="#逗号分隔千分位" aria-label="Permalink to &quot;逗号分隔千分位&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;1234567890&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> reg </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">/</span><span style="color:#F97583;">\\B</span><span style="color:#DBEDFF;">(?=(</span><span style="color:#79B8FF;">\\d</span><span style="color:#F97583;">{3}</span><span style="color:#DBEDFF;">)</span><span style="color:#F97583;">+$</span><span style="color:#DBEDFF;">)</span><span style="color:#9ECBFF;">/</span><span style="color:#F97583;">g</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// 分隔</span></span>
 <span class="line"><span style="color:#E1E4E8;">a.</span><span style="color:#B392F0;">replace</span><span style="color:#E1E4E8;">(reg, </span><span style="color:#9ECBFF;">&#39;,&#39;</span><span style="color:#E1E4E8;">);</span></span>
diff --git a/assets/notes_regexp_unknown.md.40d387f2.lean.js b/assets/notes_regexp_unknown.md.ffcfd74a.lean.js
similarity index 72%
rename from assets/notes_regexp_unknown.md.40d387f2.lean.js
rename to assets/notes_regexp_unknown.md.ffcfd74a.lean.js
index ca54449..5cdcd51 100644
--- a/assets/notes_regexp_unknown.md.40d387f2.lean.js
+++ b/assets/notes_regexp_unknown.md.ffcfd74a.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as p}from"./chunks/framework.7c0fadea.js";const _=JSON.parse('{"title":"你不知道的正则表达式","description":"","frontmatter":{},"headers":[],"relativePath":"notes/regexp/unknown.md","filePath":"notes/regexp/unknown.md","lastUpdated":1670330848000}'),l={name:"notes/regexp/unknown.md"},o=p("",3),e=[o];function t(c,r,y,i,E,d){return a(),n("div",null,e)}const h=s(l,[["render",t]]);export{_ as __pageData,h as default};
+import{_ as s,o as a,c as n,Q as p}from"./chunks/framework.0e8ae64e.js";const _=JSON.parse('{"title":"你不知道的正则表达式","description":"","frontmatter":{},"headers":[],"relativePath":"notes/regexp/unknown.md","filePath":"notes/regexp/unknown.md","lastUpdated":1670330848000}'),l={name:"notes/regexp/unknown.md"},o=p("",3),e=[o];function t(c,r,y,i,E,d){return a(),n("div",null,e)}const h=s(l,[["render",t]]);export{_ as __pageData,h as default};
diff --git a/assets/notes_typescript_advanced.md.d0ace6b6.js b/assets/notes_typescript_advanced.md.13baaa4d.js
similarity index 99%
rename from assets/notes_typescript_advanced.md.d0ace6b6.js
rename to assets/notes_typescript_advanced.md.13baaa4d.js
index 0d9640c..66cf037 100644
--- a/assets/notes_typescript_advanced.md.d0ace6b6.js
+++ b/assets/notes_typescript_advanced.md.13baaa4d.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"Typescript 高级","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/advanced.md","filePath":"notes/typescript/advanced.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/advanced.md"},o=n(`<h1 id="typescript-高级" tabindex="-1">Typescript 高级 <a class="header-anchor" href="#typescript-高级" aria-label="Permalink to &quot;Typescript 高级&quot;">​</a></h1><h2 id="advanced-type" tabindex="-1">Advanced Type <a class="header-anchor" href="#advanced-type" aria-label="Permalink to &quot;Advanced Type&quot;">​</a></h2><ul><li>用户指定类型 user-defined <ul><li>标识符 is</li></ul></li><li>in 关键字</li><li>typeof 关键字</li><li>null/undefined types <ul><li>null undefined 是两种不同的类型</li><li>可选参数或者属性 --strictNullChecks 参数或者属性可以为 undefined 不能为 null</li></ul></li><li>类型断言 type-assertion <ul><li>?? = a ? &#39;&#39; : &#39;&#39;;</li><li>! = user!.id!.length = undefined</li></ul></li><li>类型别名 type-aliases <ul><li>树形结构</li></ul></li><li>interface VS type <ul><li>接口可以继承 type 可以使用交叉类型实现 &amp;</li><li>接口可以重复定义（相当于增加新的属性类型定义）type 不能重复定义会报错</li></ul></li><li>索引类型 <ul><li>keyof 关键字</li></ul></li><li>索引类型 索引签名 <ul><li>对象键指定为 string = string | number, 指定为 number, 只能为 number 类型</li></ul></li><li>映射类型 mapped types <ul><li>封装</li><li>类似 for...in 操作符，对一个已定义的类型遍历操作</li><li>不能添加新的属性定义，如果需要使用交叉类型 &amp;</li></ul></li><li>条件类型 conditional types <ul><li>?</li><li>可以配合映射类型使用</li></ul></li><li>推断类型 infer <ul><li>infer 关键字配合 extends 使用</li></ul></li></ul><h2 id="utility-types" tabindex="-1">Utility types <a class="header-anchor" href="#utility-types" aria-label="Permalink to &quot;Utility types&quot;">​</a></h2><p>实体类型</p><ul><li>Partial&lt;Type&gt; 部分属性</li><li>Readonly&lt;Type&gt; 只读属性</li><li>Record&lt;Keys, Type&gt; 记录一组 Type 类型存在 keys 的集合当中</li><li>Pick&lt;Type, Keys&gt; 选择 Type 类型中需要存在的 keys 集合</li><li>Omit&lt;Type, Keys&gt; 反向选择 Type 类型中存在的 keys 集合</li><li>Exclude&lt;Type, ExcludedUnion&gt; 排除 Type 类型中存在 ExcludedUnion 组合类型的值</li><li>Extract&lt;Type, Union&gt; 并集</li><li>NonNullable&lt;Type&gt; 去除 Type 类型中的 null undefined</li><li>Parameters&lt;Type&gt; 构造一组元组类型使用在函数参数当中</li><li>ConstructorParameters&lt;Type&gt; 构造一组元组类型或者数组类型使用在构造函数当中</li><li>ReturnType&lt;Type&gt; 返回类型</li><li>InstanceType&lt;Type&gt; 实例类型</li><li>Required&lt;Type&gt; 与 Partial 相反</li><li>ThisParameterType&lt;Type&gt; 用于 this 作为函数参数时使用</li><li>OmitThisParameter&lt;Type&gt; 如果没有 this 的绑定，可以使用此类型用作绑定 this</li><li>ThisType&lt;Type&gt; --noImplicitThis 如果没有指定规则，必须指定 this 强绑定</li></ul><h2 id="modules" tabindex="-1">Modules <a class="header-anchor" href="#modules" aria-label="Permalink to &quot;Modules&quot;">​</a></h2><p>import/export</p><blockquote><p>commonjs/requirejs(amd)/umd/system/es2015/esnext</p></blockquote><h3 id="import-a-moudle-from-side-effects-only" tabindex="-1">Import a moudle from side-effects only <a class="header-anchor" href="#import-a-moudle-from-side-effects-only" aria-label="Permalink to &quot;Import a moudle from side-effects only&quot;">​</a></h3><blockquote><p>有些模块使用了其他模块设置了一些全局状态（没有明显的导出 exports）</p></blockquote><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./my-module.js&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">import</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;./my-module.js&#39;</span><span style="color:#24292E;">;</span></span></code></pre></div><h3 id="importing-types" tabindex="-1">Importing Types <a class="header-anchor" href="#importing-types" aria-label="Permalink to &quot;Importing Types&quot;">​</a></h3><blockquote><p>typescript 3.8 可以使用 import type（为了配合 babel isolatedModules 配置）</p></blockquote><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// before</span></span>
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"Typescript 高级","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/advanced.md","filePath":"notes/typescript/advanced.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/advanced.md"},o=n(`<h1 id="typescript-高级" tabindex="-1">Typescript 高级 <a class="header-anchor" href="#typescript-高级" aria-label="Permalink to &quot;Typescript 高级&quot;">​</a></h1><h2 id="advanced-type" tabindex="-1">Advanced Type <a class="header-anchor" href="#advanced-type" aria-label="Permalink to &quot;Advanced Type&quot;">​</a></h2><ul><li>用户指定类型 user-defined <ul><li>标识符 is</li></ul></li><li>in 关键字</li><li>typeof 关键字</li><li>null/undefined types <ul><li>null undefined 是两种不同的类型</li><li>可选参数或者属性 --strictNullChecks 参数或者属性可以为 undefined 不能为 null</li></ul></li><li>类型断言 type-assertion <ul><li>?? = a ? &#39;&#39; : &#39;&#39;;</li><li>! = user!.id!.length = undefined</li></ul></li><li>类型别名 type-aliases <ul><li>树形结构</li></ul></li><li>interface VS type <ul><li>接口可以继承 type 可以使用交叉类型实现 &amp;</li><li>接口可以重复定义（相当于增加新的属性类型定义）type 不能重复定义会报错</li></ul></li><li>索引类型 <ul><li>keyof 关键字</li></ul></li><li>索引类型 索引签名 <ul><li>对象键指定为 string = string | number, 指定为 number, 只能为 number 类型</li></ul></li><li>映射类型 mapped types <ul><li>封装</li><li>类似 for...in 操作符，对一个已定义的类型遍历操作</li><li>不能添加新的属性定义，如果需要使用交叉类型 &amp;</li></ul></li><li>条件类型 conditional types <ul><li>?</li><li>可以配合映射类型使用</li></ul></li><li>推断类型 infer <ul><li>infer 关键字配合 extends 使用</li></ul></li></ul><h2 id="utility-types" tabindex="-1">Utility types <a class="header-anchor" href="#utility-types" aria-label="Permalink to &quot;Utility types&quot;">​</a></h2><p>实体类型</p><ul><li>Partial&lt;Type&gt; 部分属性</li><li>Readonly&lt;Type&gt; 只读属性</li><li>Record&lt;Keys, Type&gt; 记录一组 Type 类型存在 keys 的集合当中</li><li>Pick&lt;Type, Keys&gt; 选择 Type 类型中需要存在的 keys 集合</li><li>Omit&lt;Type, Keys&gt; 反向选择 Type 类型中存在的 keys 集合</li><li>Exclude&lt;Type, ExcludedUnion&gt; 排除 Type 类型中存在 ExcludedUnion 组合类型的值</li><li>Extract&lt;Type, Union&gt; 并集</li><li>NonNullable&lt;Type&gt; 去除 Type 类型中的 null undefined</li><li>Parameters&lt;Type&gt; 构造一组元组类型使用在函数参数当中</li><li>ConstructorParameters&lt;Type&gt; 构造一组元组类型或者数组类型使用在构造函数当中</li><li>ReturnType&lt;Type&gt; 返回类型</li><li>InstanceType&lt;Type&gt; 实例类型</li><li>Required&lt;Type&gt; 与 Partial 相反</li><li>ThisParameterType&lt;Type&gt; 用于 this 作为函数参数时使用</li><li>OmitThisParameter&lt;Type&gt; 如果没有 this 的绑定，可以使用此类型用作绑定 this</li><li>ThisType&lt;Type&gt; --noImplicitThis 如果没有指定规则，必须指定 this 强绑定</li></ul><h2 id="modules" tabindex="-1">Modules <a class="header-anchor" href="#modules" aria-label="Permalink to &quot;Modules&quot;">​</a></h2><p>import/export</p><blockquote><p>commonjs/requirejs(amd)/umd/system/es2015/esnext</p></blockquote><h3 id="import-a-moudle-from-side-effects-only" tabindex="-1">Import a moudle from side-effects only <a class="header-anchor" href="#import-a-moudle-from-side-effects-only" aria-label="Permalink to &quot;Import a moudle from side-effects only&quot;">​</a></h3><blockquote><p>有些模块使用了其他模块设置了一些全局状态（没有明显的导出 exports）</p></blockquote><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./my-module.js&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">import</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;./my-module.js&#39;</span><span style="color:#24292E;">;</span></span></code></pre></div><h3 id="importing-types" tabindex="-1">Importing Types <a class="header-anchor" href="#importing-types" aria-label="Permalink to &quot;Importing Types&quot;">​</a></h3><blockquote><p>typescript 3.8 可以使用 import type（为了配合 babel isolatedModules 配置）</p></blockquote><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// before</span></span>
 <span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> { apiResponseType } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./api&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// now</span></span>
 <span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">type</span><span style="color:#E1E4E8;"> { apiResponseType } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./api&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// before</span></span>
diff --git a/assets/notes_typescript_advanced.md.d0ace6b6.lean.js b/assets/notes_typescript_advanced.md.13baaa4d.lean.js
similarity index 72%
rename from assets/notes_typescript_advanced.md.d0ace6b6.lean.js
rename to assets/notes_typescript_advanced.md.13baaa4d.lean.js
index ed5ac7d..34016e9 100644
--- a/assets/notes_typescript_advanced.md.d0ace6b6.lean.js
+++ b/assets/notes_typescript_advanced.md.13baaa4d.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.7c0fadea.js";const m=JSON.parse('{"title":"Typescript 高级","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/advanced.md","filePath":"notes/typescript/advanced.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/advanced.md"},o=n("",80),e=[o];function t(c,r,i,y,E,d){return a(),l("div",null,e)}const F=s(p,[["render",t]]);export{m as __pageData,F as default};
+import{_ as s,o as a,c as l,Q as n}from"./chunks/framework.0e8ae64e.js";const m=JSON.parse('{"title":"Typescript 高级","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/advanced.md","filePath":"notes/typescript/advanced.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/advanced.md"},o=n("",80),e=[o];function t(c,r,i,y,E,d){return a(),l("div",null,e)}const F=s(p,[["render",t]]);export{m as __pageData,F as default};
diff --git a/assets/notes_typescript_basic.md.75a51f21.js b/assets/notes_typescript_basic.md.7f81406b.js
similarity index 99%
rename from assets/notes_typescript_basic.md.75a51f21.js
rename to assets/notes_typescript_basic.md.7f81406b.js
index f8db2e0..95091ba 100644
--- a/assets/notes_typescript_basic.md.75a51f21.js
+++ b/assets/notes_typescript_basic.md.7f81406b.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"Typescript 基础","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/basic.md","filePath":"notes/typescript/basic.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/basic.md"},o=l(`<h1 id="typescript-基础" tabindex="-1">Typescript 基础 <a class="header-anchor" href="#typescript-基础" aria-label="Permalink to &quot;Typescript 基础&quot;">​</a></h1><h2 id="tsconfig-json-jsconfig-json-文件" tabindex="-1">tsconfig.json/jsconfig.json 文件 <a class="header-anchor" href="#tsconfig-json-jsconfig-json-文件" aria-label="Permalink to &quot;tsconfig.json/jsconfig.json 文件&quot;">​</a></h2><h3 id="配置参数" tabindex="-1">配置参数 <a class="header-anchor" href="#配置参数" aria-label="Permalink to &quot;配置参数&quot;">​</a></h3><div class="language-md vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#79B8FF;font-weight:bold;"># compilerOptions</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"Typescript 基础","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/basic.md","filePath":"notes/typescript/basic.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/basic.md"},o=l(`<h1 id="typescript-基础" tabindex="-1">Typescript 基础 <a class="header-anchor" href="#typescript-基础" aria-label="Permalink to &quot;Typescript 基础&quot;">​</a></h1><h2 id="tsconfig-json-jsconfig-json-文件" tabindex="-1">tsconfig.json/jsconfig.json 文件 <a class="header-anchor" href="#tsconfig-json-jsconfig-json-文件" aria-label="Permalink to &quot;tsconfig.json/jsconfig.json 文件&quot;">​</a></h2><h3 id="配置参数" tabindex="-1">配置参数 <a class="header-anchor" href="#配置参数" aria-label="Permalink to &quot;配置参数&quot;">​</a></h3><div class="language-md vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#79B8FF;font-weight:bold;"># compilerOptions</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#85E89D;">&gt; 常见配置介绍</span></span>
 <span class="line"></span>
diff --git a/assets/notes_typescript_basic.md.75a51f21.lean.js b/assets/notes_typescript_basic.md.7f81406b.lean.js
similarity index 71%
rename from assets/notes_typescript_basic.md.75a51f21.lean.js
rename to assets/notes_typescript_basic.md.7f81406b.lean.js
index 4fcb814..6ce0319 100644
--- a/assets/notes_typescript_basic.md.75a51f21.lean.js
+++ b/assets/notes_typescript_basic.md.7f81406b.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const u=JSON.parse('{"title":"Typescript 基础","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/basic.md","filePath":"notes/typescript/basic.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/basic.md"},o=l("",76),e=[o];function t(c,r,y,E,i,F){return n(),a("div",null,e)}const g=s(p,[["render",t]]);export{u as __pageData,g as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const u=JSON.parse('{"title":"Typescript 基础","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/basic.md","filePath":"notes/typescript/basic.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/basic.md"},o=l("",76),e=[o];function t(c,r,y,E,i,F){return n(),a("div",null,e)}const g=s(p,[["render",t]]);export{u as __pageData,g as default};
diff --git a/assets/notes_typescript_lib-struct.md.04de5da6.js b/assets/notes_typescript_lib-struct.md.214381a8.js
similarity index 99%
rename from assets/notes_typescript_lib-struct.md.04de5da6.js
rename to assets/notes_typescript_lib-struct.md.214381a8.js
index 3aa0e0e..2095f71 100644
--- a/assets/notes_typescript_lib-struct.md.04de5da6.js
+++ b/assets/notes_typescript_lib-struct.md.214381a8.js
@@ -1,4 +1,4 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"Typescript 文件结构定义","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/lib-struct.md","filePath":"notes/typescript/lib-struct.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/lib-struct.md"},o=l(`<h1 id="typescript-文件结构定义" tabindex="-1">Typescript 文件结构定义 <a class="header-anchor" href="#typescript-文件结构定义" aria-label="Permalink to &quot;Typescript 文件结构定义&quot;">​</a></h1><blockquote><p>如何定义 typescript 类型文件（记录一些定义文件的细节）</p></blockquote><h2 id="模块化" tabindex="-1">模块化 <a class="header-anchor" href="#模块化" aria-label="Permalink to &quot;模块化&quot;">​</a></h2><p>es6/nodejs/umd/amd/SystemJs</p><h2 id="模块模板" tabindex="-1">模块模板 <a class="header-anchor" href="#模块模板" aria-label="Permalink to &quot;模块模板&quot;">​</a></h2><p>module.d.ts/module-class.d.ts/module-functon.d.ts/module-plugin.d.ts</p><h3 id="module-d-ts" tabindex="-1">module.d.ts <a class="header-anchor" href="#module-d-ts" aria-label="Permalink to &quot;module.d.ts&quot;">​</a></h3><ul><li>export = &amp; import xx = require()</li></ul><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// tsconfig.json =&gt; esModuleInterop: true</span></span>
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"Typescript 文件结构定义","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/lib-struct.md","filePath":"notes/typescript/lib-struct.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/lib-struct.md"},o=l(`<h1 id="typescript-文件结构定义" tabindex="-1">Typescript 文件结构定义 <a class="header-anchor" href="#typescript-文件结构定义" aria-label="Permalink to &quot;Typescript 文件结构定义&quot;">​</a></h1><blockquote><p>如何定义 typescript 类型文件（记录一些定义文件的细节）</p></blockquote><h2 id="模块化" tabindex="-1">模块化 <a class="header-anchor" href="#模块化" aria-label="Permalink to &quot;模块化&quot;">​</a></h2><p>es6/nodejs/umd/amd/SystemJs</p><h2 id="模块模板" tabindex="-1">模块模板 <a class="header-anchor" href="#模块模板" aria-label="Permalink to &quot;模块模板&quot;">​</a></h2><p>module.d.ts/module-class.d.ts/module-functon.d.ts/module-plugin.d.ts</p><h3 id="module-d-ts" tabindex="-1">module.d.ts <a class="header-anchor" href="#module-d-ts" aria-label="Permalink to &quot;module.d.ts&quot;">​</a></h3><ul><li>export = &amp; import xx = require()</li></ul><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// tsconfig.json =&gt; esModuleInterop: true</span></span>
 <span class="line"><span style="color:#F97583;">declare</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">a</span><span style="color:#E1E4E8;">()</span><span style="color:#F97583;">:</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">string</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#F97583;">export</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">default</span><span style="color:#E1E4E8;"> a;</span></span>
 <span class="line"><span style="color:#6A737D;">// or</span></span>
diff --git a/assets/notes_typescript_lib-struct.md.04de5da6.lean.js b/assets/notes_typescript_lib-struct.md.214381a8.lean.js
similarity index 73%
rename from assets/notes_typescript_lib-struct.md.04de5da6.lean.js
rename to assets/notes_typescript_lib-struct.md.214381a8.lean.js
index 14a1e18..63680d5 100644
--- a/assets/notes_typescript_lib-struct.md.04de5da6.lean.js
+++ b/assets/notes_typescript_lib-struct.md.214381a8.lean.js
@@ -1 +1 @@
-import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.7c0fadea.js";const h=JSON.parse('{"title":"Typescript 文件结构定义","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/lib-struct.md","filePath":"notes/typescript/lib-struct.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/lib-struct.md"},o=l("",31),e=[o];function t(c,r,y,i,E,d){return a(),n("div",null,e)}const F=s(p,[["render",t]]);export{h as __pageData,F as default};
+import{_ as s,o as a,c as n,Q as l}from"./chunks/framework.0e8ae64e.js";const h=JSON.parse('{"title":"Typescript 文件结构定义","description":"","frontmatter":{},"headers":[],"relativePath":"notes/typescript/lib-struct.md","filePath":"notes/typescript/lib-struct.md","lastUpdated":1670330848000}'),p={name:"notes/typescript/lib-struct.md"},o=l("",31),e=[o];function t(c,r,y,i,E,d){return a(),n("div",null,e)}const F=s(p,[["render",t]]);export{h as __pageData,F as default};
diff --git a/assets/source-code_index.md.3b974e67.js b/assets/source-code_index.md.c3b56127.js
similarity index 88%
rename from assets/source-code_index.md.3b974e67.js
rename to assets/source-code_index.md.c3b56127.js
index 6a59c96..5b380a9 100644
--- a/assets/source-code_index.md.3b974e67.js
+++ b/assets/source-code_index.md.c3b56127.js
@@ -1 +1 @@
-import{_ as a,o as t,c as o,k as e,a as s}from"./chunks/framework.7c0fadea.js";const x=JSON.parse('{"title":"导航","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/index.md","filePath":"source-code/index.md","lastUpdated":1670330848000}'),r={name:"source-code/index.md"},c=e("h1",{id:"导航",tabindex:"-1"},[s("导航 "),e("a",{class:"header-anchor",href:"#导航","aria-label":'Permalink to "导航"'},"​")],-1),d=[c];function n(i,_,l,p,h,m){return t(),o("div",null,d)}const u=a(r,[["render",n]]);export{x as __pageData,u as default};
+import{_ as a,o as t,c as o,k as e,a as s}from"./chunks/framework.0e8ae64e.js";const x=JSON.parse('{"title":"导航","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/index.md","filePath":"source-code/index.md","lastUpdated":1670330848000}'),r={name:"source-code/index.md"},c=e("h1",{id:"导航",tabindex:"-1"},[s("导航 "),e("a",{class:"header-anchor",href:"#导航","aria-label":'Permalink to "导航"'},"​")],-1),d=[c];function n(i,_,l,p,h,m){return t(),o("div",null,d)}const u=a(r,[["render",n]]);export{x as __pageData,u as default};
diff --git a/assets/source-code_index.md.3b974e67.lean.js b/assets/source-code_index.md.c3b56127.lean.js
similarity index 88%
rename from assets/source-code_index.md.3b974e67.lean.js
rename to assets/source-code_index.md.c3b56127.lean.js
index 6a59c96..5b380a9 100644
--- a/assets/source-code_index.md.3b974e67.lean.js
+++ b/assets/source-code_index.md.c3b56127.lean.js
@@ -1 +1 @@
-import{_ as a,o as t,c as o,k as e,a as s}from"./chunks/framework.7c0fadea.js";const x=JSON.parse('{"title":"导航","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/index.md","filePath":"source-code/index.md","lastUpdated":1670330848000}'),r={name:"source-code/index.md"},c=e("h1",{id:"导航",tabindex:"-1"},[s("导航 "),e("a",{class:"header-anchor",href:"#导航","aria-label":'Permalink to "导航"'},"​")],-1),d=[c];function n(i,_,l,p,h,m){return t(),o("div",null,d)}const u=a(r,[["render",n]]);export{x as __pageData,u as default};
+import{_ as a,o as t,c as o,k as e,a as s}from"./chunks/framework.0e8ae64e.js";const x=JSON.parse('{"title":"导航","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/index.md","filePath":"source-code/index.md","lastUpdated":1670330848000}'),r={name:"source-code/index.md"},c=e("h1",{id:"导航",tabindex:"-1"},[s("导航 "),e("a",{class:"header-anchor",href:"#导航","aria-label":'Permalink to "导航"'},"​")],-1),d=[c];function n(i,_,l,p,h,m){return t(),o("div",null,d)}const u=a(r,[["render",n]]);export{x as __pageData,u as default};
diff --git a/assets/source-code_react_api_context.md.f71ef236.js b/assets/source-code_react_api_context.md.cb6576d9.js
similarity index 99%
rename from assets/source-code_react_api_context.md.f71ef236.js
rename to assets/source-code_react_api_context.md.cb6576d9.js
index 24d7a8b..deba131 100644
--- a/assets/source-code_react_api_context.md.f71ef236.js
+++ b/assets/source-code_react_api_context.md.cb6576d9.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const F=JSON.parse('{"title":"Context","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/react/api/context.md","filePath":"source-code/react/api/context.md","lastUpdated":1670330848000}'),p={name:"source-code/react/api/context.md"},o=l(`<h1 id="context" tabindex="-1">Context <a class="header-anchor" href="#context" aria-label="Permalink to &quot;Context&quot;">​</a></h1><ul><li>15.3</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> PropTypes </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;prop-types&#39;</span><span style="color:#E1E4E8;">;</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const F=JSON.parse('{"title":"Context","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/react/api/context.md","filePath":"source-code/react/api/context.md","lastUpdated":1670330848000}'),p={name:"source-code/react/api/context.md"},o=l(`<h1 id="context" tabindex="-1">Context <a class="header-anchor" href="#context" aria-label="Permalink to &quot;Context&quot;">​</a></h1><ul><li>15.3</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> PropTypes </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;prop-types&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#6A737D;">/* parents component */</span></span>
 <span class="line"><span style="color:#F97583;">class</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">Parent</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">extends</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">React</span><span style="color:#E1E4E8;">.</span><span style="color:#B392F0;">Component</span><span style="color:#E1E4E8;"> {</span></span>
diff --git a/assets/source-code_react_api_context.md.f71ef236.lean.js b/assets/source-code_react_api_context.md.cb6576d9.lean.js
similarity index 72%
rename from assets/source-code_react_api_context.md.f71ef236.lean.js
rename to assets/source-code_react_api_context.md.cb6576d9.lean.js
index 2257365..805d370 100644
--- a/assets/source-code_react_api_context.md.f71ef236.lean.js
+++ b/assets/source-code_react_api_context.md.cb6576d9.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const F=JSON.parse('{"title":"Context","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/react/api/context.md","filePath":"source-code/react/api/context.md","lastUpdated":1670330848000}'),p={name:"source-code/react/api/context.md"},o=l("",7),e=[o];function t(c,r,E,y,i,d){return n(),a("div",null,e)}const u=s(p,[["render",t]]);export{F as __pageData,u as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const F=JSON.parse('{"title":"Context","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/react/api/context.md","filePath":"source-code/react/api/context.md","lastUpdated":1670330848000}'),p={name:"source-code/react/api/context.md"},o=l("",7),e=[o];function t(c,r,E,y,i,d){return n(),a("div",null,e)}const u=s(p,[["render",t]]);export{F as __pageData,u as default};
diff --git a/assets/source-code_react_api_ref.md.041146b3.js b/assets/source-code_react_api_ref.md.955d1f79.js
similarity index 98%
rename from assets/source-code_react_api_ref.md.041146b3.js
rename to assets/source-code_react_api_ref.md.955d1f79.js
index 2b582c5..dd14e50 100644
--- a/assets/source-code_react_api_ref.md.041146b3.js
+++ b/assets/source-code_react_api_ref.md.955d1f79.js
@@ -1,4 +1,4 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const F=JSON.parse('{"title":"Ref","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/react/api/ref.md","filePath":"source-code/react/api/ref.md","lastUpdated":1670330848000}'),p={name:"source-code/react/api/ref.md"},o=l(`<h1 id="ref" tabindex="-1">Ref <a class="header-anchor" href="#ref" aria-label="Permalink to &quot;Ref&quot;">​</a></h1><p><code>react ref</code></p><ul><li><ol><li>使用 ref 在具体的 dom 元素上或者 class 组件上</li></ol></li></ul><div class="language-jsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 1. 直接创建</span></span>
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const F=JSON.parse('{"title":"Ref","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/react/api/ref.md","filePath":"source-code/react/api/ref.md","lastUpdated":1670330848000}'),p={name:"source-code/react/api/ref.md"},o=l(`<h1 id="ref" tabindex="-1">Ref <a class="header-anchor" href="#ref" aria-label="Permalink to &quot;Ref&quot;">​</a></h1><p><code>react ref</code></p><ul><li><ol><li>使用 ref 在具体的 dom 元素上或者 class 组件上</li></ol></li></ul><div class="language-jsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 1. 直接创建</span></span>
 <span class="line"><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">ref</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> React.</span><span style="color:#B392F0;">createRef</span><span style="color:#E1E4E8;">();</span></span>
 <span class="line"><span style="color:#6A737D;">// ref ==&gt; { currnt: dom }</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">ref</span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;">{ref}&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
diff --git a/assets/source-code_react_api_ref.md.041146b3.lean.js b/assets/source-code_react_api_ref.md.955d1f79.lean.js
similarity index 71%
rename from assets/source-code_react_api_ref.md.041146b3.lean.js
rename to assets/source-code_react_api_ref.md.955d1f79.lean.js
index a79b936..385d9ad 100644
--- a/assets/source-code_react_api_ref.md.041146b3.lean.js
+++ b/assets/source-code_react_api_ref.md.955d1f79.lean.js
@@ -1 +1 @@
-import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.7c0fadea.js";const F=JSON.parse('{"title":"Ref","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/react/api/ref.md","filePath":"source-code/react/api/ref.md","lastUpdated":1670330848000}'),p={name:"source-code/react/api/ref.md"},o=l("",6),e=[o];function t(r,c,E,y,i,d){return n(),a("div",null,e)}const A=s(p,[["render",t]]);export{F as __pageData,A as default};
+import{_ as s,o as n,c as a,Q as l}from"./chunks/framework.0e8ae64e.js";const F=JSON.parse('{"title":"Ref","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/react/api/ref.md","filePath":"source-code/react/api/ref.md","lastUpdated":1670330848000}'),p={name:"source-code/react/api/ref.md"},o=l("",6),e=[o];function t(r,c,E,y,i,d){return n(),a("div",null,e)}const A=s(p,[["render",t]]);export{F as __pageData,A as default};
diff --git a/assets/source-code_vue_index.md.55141804.lean.js b/assets/source-code_vue_index.md.59347e5f.js
similarity index 88%
rename from assets/source-code_vue_index.md.55141804.lean.js
rename to assets/source-code_vue_index.md.59347e5f.js
index a2ef46d..045efc2 100644
--- a/assets/source-code_vue_index.md.55141804.lean.js
+++ b/assets/source-code_vue_index.md.59347e5f.js
@@ -1 +1 @@
-import{_ as a,o as t,c as o,k as e,a as s}from"./chunks/framework.7c0fadea.js";const f=JSON.parse('{"title":"开始","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/vue/index.md","filePath":"source-code/vue/index.md","lastUpdated":1670330848000}'),r={name:"source-code/vue/index.md"},c=e("h1",{id:"开始",tabindex:"-1"},[s("开始 "),e("a",{class:"header-anchor",href:"#开始","aria-label":'Permalink to "开始"'},"​")],-1),d=[c];function n(i,_,l,p,u,h){return t(),o("div",null,d)}const x=a(r,[["render",n]]);export{f as __pageData,x as default};
+import{_ as a,o as t,c as o,k as e,a as s}from"./chunks/framework.0e8ae64e.js";const f=JSON.parse('{"title":"开始","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/vue/index.md","filePath":"source-code/vue/index.md","lastUpdated":1670330848000}'),r={name:"source-code/vue/index.md"},c=e("h1",{id:"开始",tabindex:"-1"},[s("开始 "),e("a",{class:"header-anchor",href:"#开始","aria-label":'Permalink to "开始"'},"​")],-1),d=[c];function n(i,_,l,p,u,h){return t(),o("div",null,d)}const x=a(r,[["render",n]]);export{f as __pageData,x as default};
diff --git a/assets/source-code_vue_index.md.55141804.js b/assets/source-code_vue_index.md.59347e5f.lean.js
similarity index 88%
rename from assets/source-code_vue_index.md.55141804.js
rename to assets/source-code_vue_index.md.59347e5f.lean.js
index a2ef46d..045efc2 100644
--- a/assets/source-code_vue_index.md.55141804.js
+++ b/assets/source-code_vue_index.md.59347e5f.lean.js
@@ -1 +1 @@
-import{_ as a,o as t,c as o,k as e,a as s}from"./chunks/framework.7c0fadea.js";const f=JSON.parse('{"title":"开始","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/vue/index.md","filePath":"source-code/vue/index.md","lastUpdated":1670330848000}'),r={name:"source-code/vue/index.md"},c=e("h1",{id:"开始",tabindex:"-1"},[s("开始 "),e("a",{class:"header-anchor",href:"#开始","aria-label":'Permalink to "开始"'},"​")],-1),d=[c];function n(i,_,l,p,u,h){return t(),o("div",null,d)}const x=a(r,[["render",n]]);export{f as __pageData,x as default};
+import{_ as a,o as t,c as o,k as e,a as s}from"./chunks/framework.0e8ae64e.js";const f=JSON.parse('{"title":"开始","description":"","frontmatter":{},"headers":[],"relativePath":"source-code/vue/index.md","filePath":"source-code/vue/index.md","lastUpdated":1670330848000}'),r={name:"source-code/vue/index.md"},c=e("h1",{id:"开始",tabindex:"-1"},[s("开始 "),e("a",{class:"header-anchor",href:"#开始","aria-label":'Permalink to "开始"'},"​")],-1),d=[c];function n(i,_,l,p,u,h){return t(),o("div",null,d)}const x=a(r,[["render",n]]);export{f as __pageData,x as default};
diff --git a/assets/style.1381d0e1.css b/assets/style.1381d0e1.css
deleted file mode 100644
index 8d3ea42..0000000
--- a/assets/style.1381d0e1.css
+++ /dev/null
@@ -1 +0,0 @@
-@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/learning-docs2/assets/inter-roman-cyrillic.5f2c6c8c.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/learning-docs2/assets/inter-roman-cyrillic-ext.e75737ce.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/learning-docs2/assets/inter-roman-greek.d5a6d92a.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/learning-docs2/assets/inter-roman-greek-ext.ab0619bc.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/learning-docs2/assets/inter-roman-latin-ext.0030eebd.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/learning-docs2/assets/inter-roman-vietnamese.14ce25a6.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/learning-docs2/assets/inter-italic-cyrillic.ea42a392.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/learning-docs2/assets/inter-italic-cyrillic-ext.33bd5a8e.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/learning-docs2/assets/inter-italic-greek.8f4463c4.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/learning-docs2/assets/inter-italic-greek-ext.4fbe9427.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/learning-docs2/assets/inter-italic-latin.bd3b6f56.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/learning-docs2/assets/inter-italic-latin-ext.bd8920cc.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/learning-docs2/assets/inter-italic-vietnamese.6ce511fb.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}@font-face{font-family:Chinese Quotes;src:local("PingFang SC Regular"),local("PingFang SC"),local("SimHei"),local("Source Han Sans SC");unicode-range:U+2018,U+2019,U+201C,U+201D}:root{--vp-c-white: #ffffff;--vp-c-black: #000000;--vp-c-neutral: var(--vp-c-black);--vp-c-neutral-inverse: var(--vp-c-white)}.dark{--vp-c-neutral: var(--vp-c-white);--vp-c-neutral-inverse: var(--vp-c-black)}:root{--vp-c-gray-1: #dddde3;--vp-c-gray-2: #e4e4e9;--vp-c-gray-3: #ebebef;--vp-c-gray-soft: rgba(142, 150, 170, .14);--vp-c-indigo-1: #3451b2;--vp-c-indigo-2: #3a5ccc;--vp-c-indigo-3: #5672cd;--vp-c-indigo-soft: rgba(100, 108, 255, .14);--vp-c-green-1: #18794e;--vp-c-green-2: #299764;--vp-c-green-3: #30a46c;--vp-c-green-soft: rgba(16, 185, 129, .14);--vp-c-yellow-1: #915930;--vp-c-yellow-2: #946300;--vp-c-yellow-3: #9f6a00;--vp-c-yellow-soft: rgba(234, 179, 8, .14);--vp-c-red-1: #b8272c;--vp-c-red-2: #d5393e;--vp-c-red-3: #e0575b;--vp-c-red-soft: rgba(244, 63, 94, .14);--vp-c-sponsor: #db2777}.dark{--vp-c-gray-1: #515c67;--vp-c-gray-2: #414853;--vp-c-gray-3: #32363f;--vp-c-gray-soft: rgba(101, 117, 133, .16);--vp-c-indigo-1: #a8b1ff;--vp-c-indigo-2: #5c73e7;--vp-c-indigo-3: #3e63dd;--vp-c-indigo-soft: rgba(100, 108, 255, .16);--vp-c-green-1: #3dd68c;--vp-c-green-2: #30a46c;--vp-c-green-3: #298459;--vp-c-green-soft: rgba(16, 185, 129, .16);--vp-c-yellow-1: #f9b44e;--vp-c-yellow-2: #da8b17;--vp-c-yellow-3: #a46a0a;--vp-c-yellow-soft: rgba(234, 179, 8, .16);--vp-c-red-1: #f66f81;--vp-c-red-2: #f14158;--vp-c-red-3: #b62a3c;--vp-c-red-soft: rgba(244, 63, 94, .16)}:root{--vp-c-bg: #ffffff;--vp-c-bg-alt: #f6f6f7;--vp-c-bg-elv: #ffffff;--vp-c-bg-soft: #f6f6f7}.dark{--vp-c-bg: #1b1b1f;--vp-c-bg-alt: #161618;--vp-c-bg-elv: #202127;--vp-c-bg-soft: #202127}:root{--vp-c-border: #c2c2c4;--vp-c-divider: #e2e2e3;--vp-c-gutter: #e2e2e3}.dark{--vp-c-border: #3c3f44;--vp-c-divider: #2e2e32;--vp-c-gutter: #000000}:root{--vp-c-text-1: rgba(60, 60, 67);--vp-c-text-2: rgba(60, 60, 67, .78);--vp-c-text-3: rgba(60, 60, 67, .56)}.dark{--vp-c-text-1: rgba(255, 255, 245, .86);--vp-c-text-2: rgba(235, 235, 245, .6);--vp-c-text-3: rgba(235, 235, 245, .38)}:root{--vp-c-default-1: var(--vp-c-gray-1);--vp-c-default-2: var(--vp-c-gray-2);--vp-c-default-3: var(--vp-c-gray-3);--vp-c-default-soft: var(--vp-c-gray-soft);--vp-c-brand-1: var(--vp-c-indigo-1);--vp-c-brand-2: var(--vp-c-indigo-2);--vp-c-brand-3: var(--vp-c-indigo-3);--vp-c-brand-soft: var(--vp-c-indigo-soft);--vp-c-brand: var(--vp-c-brand-1);--vp-c-tip-1: var(--vp-c-brand-1);--vp-c-tip-2: var(--vp-c-brand-2);--vp-c-tip-3: var(--vp-c-brand-3);--vp-c-tip-soft: var(--vp-c-brand-soft);--vp-c-warning-1: var(--vp-c-yellow-1);--vp-c-warning-2: var(--vp-c-yellow-2);--vp-c-warning-3: var(--vp-c-yellow-3);--vp-c-warning-soft: var(--vp-c-yellow-soft);--vp-c-danger-1: var(--vp-c-red-1);--vp-c-danger-2: var(--vp-c-red-2);--vp-c-danger-3: var(--vp-c-red-3);--vp-c-danger-soft: var(--vp-c-red-soft)}:root{--vp-font-family-base: "Chinese Quotes", "Inter var", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--vp-font-family-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}:root{--vp-shadow-1: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06);--vp-shadow-2: 0 3px 12px rgba(0, 0, 0, .07), 0 1px 4px rgba(0, 0, 0, .07);--vp-shadow-3: 0 12px 32px rgba(0, 0, 0, .1), 0 2px 6px rgba(0, 0, 0, .08);--vp-shadow-4: 0 14px 44px rgba(0, 0, 0, .12), 0 3px 9px rgba(0, 0, 0, .12);--vp-shadow-5: 0 18px 56px rgba(0, 0, 0, .16), 0 4px 12px rgba(0, 0, 0, .16)}:root{--vp-z-index-footer: 10;--vp-z-index-local-nav: 20;--vp-z-index-nav: 30;--vp-z-index-layout-top: 40;--vp-z-index-backdrop: 50;--vp-z-index-sidebar: 60}:root{--vp-icon-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' height='20' width='20' stroke='rgba(128,128,128,1)' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2'/%3E%3C/svg%3E");--vp-icon-copied: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' height='20' width='20' stroke='rgba(128,128,128,1)' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2m-6 9 2 2 4-4'/%3E%3C/svg%3E")}:root{--vp-layout-max-width: 1440px}:root{--vp-header-anchor-symbol: "#"}:root{--vp-code-line-height: 1.7;--vp-code-font-size: .875em;--vp-code-color: var(--vp-c-brand-1);--vp-code-link-color: var(--vp-c-brand-1);--vp-code-link-hover-color: var(--vp-c-brand-2);--vp-code-bg: var(--vp-c-default-soft);--vp-code-block-color: var(--vp-c-text-2);--vp-code-block-bg: var(--vp-c-bg-alt);--vp-code-block-divider-color: var(--vp-c-gutter);--vp-code-lang-color: var(--vp-c-text-3);--vp-code-line-highlight-color: var(--vp-c-default-soft);--vp-code-line-number-color: var(--vp-c-text-3);--vp-code-line-diff-add-color: var(--vp-c-green-soft);--vp-code-line-diff-add-symbol-color: var(--vp-c-green-1);--vp-code-line-diff-remove-color: var(--vp-c-red-soft);--vp-code-line-diff-remove-symbol-color: var(--vp-c-red-1);--vp-code-line-warning-color: var(--vp-c-yellow-soft);--vp-code-line-error-color: var(--vp-c-red-soft);--vp-code-copy-code-border-color: var(--vp-c-divider);--vp-code-copy-code-bg: var(--vp-c-bg-soft);--vp-code-copy-code-hover-border-color: var(--vp-c-divider);--vp-code-copy-code-hover-bg: var(--vp-c-bg);--vp-code-copy-code-active-text: var(--vp-c-text-2);--vp-code-copy-copied-text-content: "Copied";--vp-code-tab-divider: var(--vp-code-block-divider-color);--vp-code-tab-text-color: var(--vp-c-text-2);--vp-code-tab-bg: var(--vp-code-block-bg);--vp-code-tab-hover-text-color: var(--vp-c-text-1);--vp-code-tab-active-text-color: var(--vp-c-text-1);--vp-code-tab-active-bar-color: var(--vp-c-brand-1)}:root{--vp-button-brand-border: transparent;--vp-button-brand-text: var(--vp-c-white);--vp-button-brand-bg: var(--vp-c-brand-3);--vp-button-brand-hover-border: transparent;--vp-button-brand-hover-text: var(--vp-c-white);--vp-button-brand-hover-bg: var(--vp-c-brand-2);--vp-button-brand-active-border: transparent;--vp-button-brand-active-text: var(--vp-c-white);--vp-button-brand-active-bg: var(--vp-c-brand-1);--vp-button-alt-border: transparent;--vp-button-alt-text: var(--vp-c-text-1);--vp-button-alt-bg: var(--vp-c-default-3);--vp-button-alt-hover-border: transparent;--vp-button-alt-hover-text: var(--vp-c-text-1);--vp-button-alt-hover-bg: var(--vp-c-default-2);--vp-button-alt-active-border: transparent;--vp-button-alt-active-text: var(--vp-c-text-1);--vp-button-alt-active-bg: var(--vp-c-default-1);--vp-button-sponsor-border: var(--vp-c-text-2);--vp-button-sponsor-text: var(--vp-c-text-2);--vp-button-sponsor-bg: transparent;--vp-button-sponsor-hover-border: var(--vp-c-sponsor);--vp-button-sponsor-hover-text: var(--vp-c-sponsor);--vp-button-sponsor-hover-bg: transparent;--vp-button-sponsor-active-border: var(--vp-c-sponsor);--vp-button-sponsor-active-text: var(--vp-c-sponsor);--vp-button-sponsor-active-bg: transparent}:root{--vp-custom-block-font-size: 14px;--vp-custom-block-code-font-size: 13px;--vp-custom-block-info-border: transparent;--vp-custom-block-info-text: var(--vp-c-text-1);--vp-custom-block-info-bg: var(--vp-c-default-soft);--vp-custom-block-info-code-bg: var(--vp-c-default-soft);--vp-custom-block-tip-border: transparent;--vp-custom-block-tip-text: var(--vp-c-text-1);--vp-custom-block-tip-bg: var(--vp-c-brand-soft);--vp-custom-block-tip-code-bg: var(--vp-c-brand-soft);--vp-custom-block-warning-border: transparent;--vp-custom-block-warning-text: var(--vp-c-text-1);--vp-custom-block-warning-bg: var(--vp-c-warning-soft);--vp-custom-block-warning-code-bg: var(--vp-c-warning-soft);--vp-custom-block-danger-border: transparent;--vp-custom-block-danger-text: var(--vp-c-text-1);--vp-custom-block-danger-bg: var(--vp-c-danger-soft);--vp-custom-block-danger-code-bg: var(--vp-c-danger-soft);--vp-custom-block-details-border: var(--vp-custom-block-info-border);--vp-custom-block-details-text: var(--vp-custom-block-info-text);--vp-custom-block-details-bg: var(--vp-custom-block-info-bg);--vp-custom-block-details-code-bg: var(--vp-custom-block-info-code-bg)}:root{--vp-input-border-color: var(--vp-c-border);--vp-input-bg-color: var(--vp-c-bg-alt);--vp-input-switch-bg-color: var(--vp-c-gray-soft)}:root{--vp-nav-height: 64px;--vp-nav-bg-color: var(--vp-c-bg);--vp-nav-screen-bg-color: var(--vp-c-bg);--vp-nav-logo-height: 24px}.hide-nav{--vp-nav-height: 0px}.hide-nav .VPSidebar{--vp-nav-height: 22px}:root{--vp-local-nav-bg-color: var(--vp-c-bg)}:root{--vp-sidebar-width: 272px;--vp-sidebar-bg-color: var(--vp-c-bg-alt)}:root{--vp-backdrop-bg-color: rgba(0, 0, 0, .6)}:root{--vp-home-hero-name-color: var(--vp-c-brand-1);--vp-home-hero-name-background: transparent;--vp-home-hero-image-background-image: none;--vp-home-hero-image-filter: none}:root{--vp-badge-info-border: transparent;--vp-badge-info-text: var(--vp-c-text-2);--vp-badge-info-bg: var(--vp-c-default-soft);--vp-badge-tip-border: transparent;--vp-badge-tip-text: var(--vp-c-brand-1);--vp-badge-tip-bg: var(--vp-c-brand-soft);--vp-badge-warning-border: transparent;--vp-badge-warning-text: var(--vp-c-warning-1);--vp-badge-warning-bg: var(--vp-c-warning-soft);--vp-badge-danger-border: transparent;--vp-badge-danger-text: var(--vp-c-danger-1);--vp-badge-danger-bg: var(--vp-c-danger-soft)}:root{--vp-carbon-ads-text-color: var(--vp-c-text-1);--vp-carbon-ads-poweredby-color: var(--vp-c-text-2);--vp-carbon-ads-bg-color: var(--vp-c-bg-soft);--vp-carbon-ads-hover-text-color: var(--vp-c-brand-1);--vp-carbon-ads-hover-poweredby-color: var(--vp-c-text-1)}:root{--vp-local-search-bg: var(--vp-c-bg);--vp-local-search-result-bg: var(--vp-c-bg);--vp-local-search-result-border: var(--vp-c-divider);--vp-local-search-result-selected-bg: var(--vp-c-bg);--vp-local-search-result-selected-border: var(--vp-c-brand-1);--vp-local-search-highlight-bg: var(--vp-c-brand-1);--vp-local-search-highlight-text: var(--vp-c-neutral-inverse)}@media (prefers-reduced-motion: reduce){*,:before,:after{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important;transition-duration:0s!important;transition-delay:0s!important}}*,:before,:after{box-sizing:border-box}html{line-height:1.4;font-size:16px;-webkit-text-size-adjust:100%}html.dark{color-scheme:dark}body{margin:0;width:100%;min-width:320px;min-height:100vh;line-height:24px;font-family:var(--vp-font-family-base);font-size:16px;font-weight:400;color:var(--vp-c-text-1);background-color:var(--vp-c-bg);direction:ltr;font-synthesis:style;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}main{display:block}h1,h2,h3,h4,h5,h6{margin:0;line-height:24px;font-size:16px;font-weight:400}p{margin:0}strong,b{font-weight:600}a,area,button,[role=button],input,label,select,summary,textarea{touch-action:manipulation}a{color:inherit;text-decoration:inherit}ol,ul{list-style:none;margin:0;padding:0}blockquote{margin:0}pre,code,kbd,samp{font-family:var(--vp-font-family-mono)}img,svg,video,canvas,audio,iframe,embed,object{display:block}figure{margin:0}img,video{max-width:100%;height:auto}button,input,optgroup,select,textarea{border:0;padding:0;line-height:inherit;color:inherit}button{padding:0;font-family:inherit;background-color:transparent;background-image:none}button:enabled,[role=button]:enabled{cursor:pointer}button:focus,button:focus-visible{outline:1px dotted;outline:4px auto -webkit-focus-ring-color}button:focus:not(:focus-visible){outline:none!important}input:focus,textarea:focus,select:focus{outline:none}table{border-collapse:collapse}input{background-color:transparent}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:var(--vp-c-text-3)}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:var(--vp-c-text-3)}input::placeholder,textarea::placeholder{color:var(--vp-c-text-3)}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}textarea{resize:vertical}select{-webkit-appearance:none}fieldset{margin:0;padding:0}h1,h2,h3,h4,h5,h6,li,p{overflow-wrap:break-word}vite-error-overlay{z-index:9999}mjx-container{display:inline-block;margin:auto 2px -2px}mjx-container>svg{margin:auto}.visually-hidden{position:absolute;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden}.custom-block{border:1px solid transparent;border-radius:8px;padding:16px 16px 8px;line-height:24px;font-size:var(--vp-custom-block-font-size);color:var(--vp-c-text-2)}.custom-block.info{border-color:var(--vp-custom-block-info-border);color:var(--vp-custom-block-info-text);background-color:var(--vp-custom-block-info-bg)}.custom-block.info a,.custom-block.info code{color:var(--vp-c-brand-1)}.custom-block.info a:hover{color:var(--vp-c-brand-2)}.custom-block.info code{background-color:var(--vp-custom-block-info-code-bg)}.custom-block.tip{border-color:var(--vp-custom-block-tip-border);color:var(--vp-custom-block-tip-text);background-color:var(--vp-custom-block-tip-bg)}.custom-block.tip a,.custom-block.tip code{color:var(--vp-c-brand-1)}.custom-block.tip a:hover{color:var(--vp-c-brand-2)}.custom-block.tip code{background-color:var(--vp-custom-block-tip-code-bg)}.custom-block.warning{border-color:var(--vp-custom-block-warning-border);color:var(--vp-custom-block-warning-text);background-color:var(--vp-custom-block-warning-bg)}.custom-block.warning a,.custom-block.warning code{color:var(--vp-c-warning-1)}.custom-block.warning a:hover{color:var(--vp-c-warning-2)}.custom-block.warning code{background-color:var(--vp-custom-block-warning-code-bg)}.custom-block.danger{border-color:var(--vp-custom-block-danger-border);color:var(--vp-custom-block-danger-text);background-color:var(--vp-custom-block-danger-bg)}.custom-block.danger a,.custom-block.danger code{color:var(--vp-c-danger-1)}.custom-block.danger a:hover{color:var(--vp-c-danger-2)}.custom-block.danger code{background-color:var(--vp-custom-block-danger-code-bg)}.custom-block.details{border-color:var(--vp-custom-block-details-border);color:var(--vp-custom-block-details-text);background-color:var(--vp-custom-block-details-bg)}.custom-block.details a{color:var(--vp-c-brand-1)}.custom-block.details a:hover{color:var(--vp-c-brand-2)}.custom-block.details code{background-color:var(--vp-custom-block-details-code-bg)}.custom-block-title{font-weight:600}.custom-block p+p{margin:8px 0}.custom-block.details summary{margin:0 0 8px;font-weight:700;cursor:pointer}.custom-block.details summary+p{margin:8px 0}.custom-block a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px;transition:opacity .25s}.custom-block a:hover{opacity:.75}.custom-block code{font-size:var(--vp-custom-block-code-font-size)}.custom-block.custom-block th,.custom-block.custom-block blockquote>p{font-size:var(--vp-custom-block-font-size);color:inherit}.dark .vp-code-light{display:none}html:not(.dark) .vp-code-dark{display:none}.vp-code-group{margin-top:16px}.vp-code-group .tabs{position:relative;display:flex;margin-right:-24px;margin-left:-24px;padding:0 12px;background-color:var(--vp-code-tab-bg);overflow-x:auto;overflow-y:hidden;box-shadow:inset 0 -1px var(--vp-code-tab-divider)}@media (min-width: 640px){.vp-code-group .tabs{margin-right:0;margin-left:0;border-radius:8px 8px 0 0}}.vp-code-group .tabs input{position:fixed;opacity:0;pointer-events:none}.vp-code-group .tabs label{position:relative;display:inline-block;border-bottom:1px solid transparent;padding:0 12px;line-height:48px;font-size:14px;font-weight:500;color:var(--vp-code-tab-text-color);white-space:nowrap;cursor:pointer;transition:color .25s}.vp-code-group .tabs label:after{position:absolute;right:8px;bottom:-1px;left:8px;z-index:1;height:2px;border-radius:2px;content:"";background-color:transparent;transition:background-color .25s}.vp-code-group label:hover{color:var(--vp-code-tab-hover-text-color)}.vp-code-group input:checked+label{color:var(--vp-code-tab-active-text-color)}.vp-code-group input:checked+label:after{background-color:var(--vp-code-tab-active-bar-color)}.vp-code-group div[class*=language-],.vp-block{display:none;margin-top:0!important;border-top-left-radius:0!important;border-top-right-radius:0!important}.vp-code-group div[class*=language-].active,.vp-block.active{display:block}.vp-block{padding:20px 24px}.vp-doc h1,.vp-doc h2,.vp-doc h3,.vp-doc h4,.vp-doc h5,.vp-doc h6{position:relative;font-weight:600;outline:none}.vp-doc h1{letter-spacing:-.02em;line-height:40px;font-size:28px}.vp-doc h2{margin:48px 0 16px;border-top:1px solid var(--vp-c-divider);padding-top:24px;letter-spacing:-.02em;line-height:32px;font-size:24px}.vp-doc h3{margin:32px 0 0;letter-spacing:-.01em;line-height:28px;font-size:20px}.vp-doc .header-anchor{position:absolute;top:0;left:0;margin-left:-.87em;font-weight:500;-webkit-user-select:none;user-select:none;opacity:0;text-decoration:none;transition:color .25s,opacity .25s}.vp-doc .header-anchor:before{content:var(--vp-header-anchor-symbol)}.vp-doc h1:hover .header-anchor,.vp-doc h1 .header-anchor:focus,.vp-doc h2:hover .header-anchor,.vp-doc h2 .header-anchor:focus,.vp-doc h3:hover .header-anchor,.vp-doc h3 .header-anchor:focus,.vp-doc h4:hover .header-anchor,.vp-doc h4 .header-anchor:focus,.vp-doc h5:hover .header-anchor,.vp-doc h5 .header-anchor:focus,.vp-doc h6:hover .header-anchor,.vp-doc h6 .header-anchor:focus{opacity:1}@media (min-width: 768px){.vp-doc h1{letter-spacing:-.02em;line-height:40px;font-size:32px}}.vp-doc h2 .header-anchor{top:24px}.vp-doc p,.vp-doc summary{margin:16px 0}.vp-doc p{line-height:28px}.vp-doc blockquote{margin:16px 0;border-left:2px solid var(--vp-c-divider);padding-left:16px;transition:border-color .5s}.vp-doc blockquote>p{margin:0;font-size:16px;color:var(--vp-c-text-2);transition:color .5s}.vp-doc a{font-weight:500;color:var(--vp-c-brand-1);text-decoration:underline;text-underline-offset:2px;transition:color .25s,opacity .25s}.vp-doc a:hover{color:var(--vp-c-brand-2)}.vp-doc strong{font-weight:600}.vp-doc ul,.vp-doc ol{padding-left:1.25rem;margin:16px 0}.vp-doc ul{list-style:disc}.vp-doc ol{list-style:decimal}.vp-doc li+li{margin-top:8px}.vp-doc li>ol,.vp-doc li>ul{margin:8px 0 0}.vp-doc table{display:block;border-collapse:collapse;margin:20px 0;overflow-x:auto}.vp-doc tr{border-top:1px solid var(--vp-c-divider);transition:background-color .5s}.vp-doc tr:nth-child(2n){background-color:var(--vp-c-bg-soft)}.vp-doc th,.vp-doc td{border:1px solid var(--vp-c-divider);padding:8px 16px}.vp-doc th{text-align:left;font-size:14px;font-weight:600;color:var(--vp-c-text-2);background-color:var(--vp-c-bg-soft)}.vp-doc td{font-size:14px}.vp-doc hr{margin:16px 0;border:none;border-top:1px solid var(--vp-c-divider)}.vp-doc .custom-block{margin:16px 0}.vp-doc .custom-block p{margin:8px 0;line-height:24px}.vp-doc .custom-block p:first-child{margin:0}.vp-doc .custom-block div[class*=language-]{margin:8px 0;border-radius:8px}.vp-doc .custom-block div[class*=language-] code{font-weight:400;background-color:transparent}.vp-doc .custom-block .vp-code-group .tabs{margin:0;border-radius:8px 8px 0 0}.vp-doc :not(pre,h1,h2,h3,h4,h5,h6)>code{font-size:var(--vp-code-font-size);color:var(--vp-code-color)}.vp-doc :not(pre)>code{border-radius:4px;padding:3px 6px;background-color:var(--vp-code-bg);transition:color .25s,background-color .5s}.vp-doc a>code{color:var(--vp-code-link-color)}.vp-doc a:hover>code{color:var(--vp-code-link-hover-color)}.vp-doc h1>code,.vp-doc h2>code,.vp-doc h3>code{font-size:.9em}.vp-doc div[class*=language-],.vp-block{position:relative;margin:16px -24px;background-color:var(--vp-code-block-bg);overflow-x:auto;transition:background-color .5s}@media (min-width: 640px){.vp-doc div[class*=language-],.vp-block{border-radius:8px;margin:16px 0}}@media (max-width: 639px){.vp-doc li div[class*=language-]{border-radius:8px 0 0 8px}}.vp-doc div[class*=language-]+div[class*=language-],.vp-doc div[class$=-api]+div[class*=language-],.vp-doc div[class*=language-]+div[class$=-api]>div[class*=language-]{margin-top:-8px}.vp-doc [class*=language-] pre,.vp-doc [class*=language-] code{direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}.vp-doc [class*=language-] pre{position:relative;z-index:1;margin:0;padding:20px 0;background:transparent;overflow-x:auto}.vp-doc [class*=language-] code{display:block;padding:0 24px;width:fit-content;min-width:100%;line-height:var(--vp-code-line-height);font-size:var(--vp-code-font-size);color:var(--vp-code-block-color);transition:color .5s}.vp-doc [class*=language-] code .highlighted{background-color:var(--vp-code-line-highlight-color);transition:background-color .5s;margin:0 -24px;padding:0 24px;width:calc(100% + 48px);display:inline-block}.vp-doc [class*=language-] code .highlighted.error{background-color:var(--vp-code-line-error-color)}.vp-doc [class*=language-] code .highlighted.warning{background-color:var(--vp-code-line-warning-color)}.vp-doc [class*=language-] code .diff{transition:background-color .5s;margin:0 -24px;padding:0 24px;width:calc(100% + 48px);display:inline-block}.vp-doc [class*=language-] code .diff:before{position:absolute;left:10px}.vp-doc [class*=language-] .has-focused-lines .line:not(.has-focus){filter:blur(.095rem);opacity:.4;transition:filter .35s,opacity .35s}.vp-doc [class*=language-] .has-focused-lines .line:not(.has-focus){opacity:.7;transition:filter .35s,opacity .35s}.vp-doc [class*=language-]:hover .has-focused-lines .line:not(.has-focus){filter:blur(0);opacity:1}.vp-doc [class*=language-] code .diff.remove{background-color:var(--vp-code-line-diff-remove-color);opacity:.7}.vp-doc [class*=language-] code .diff.remove:before{content:"-";color:var(--vp-code-line-diff-remove-symbol-color)}.vp-doc [class*=language-] code .diff.add{background-color:var(--vp-code-line-diff-add-color)}.vp-doc [class*=language-] code .diff.add:before{content:"+";color:var(--vp-code-line-diff-add-symbol-color)}.vp-doc div[class*=language-].line-numbers-mode{padding-left:32px}.vp-doc .line-numbers-wrapper{position:absolute;top:0;bottom:0;left:0;z-index:3;border-right:1px solid var(--vp-code-block-divider-color);padding-top:20px;width:32px;text-align:center;font-family:var(--vp-font-family-mono);line-height:var(--vp-code-line-height);font-size:var(--vp-code-font-size);color:var(--vp-code-line-number-color);transition:border-color .5s,color .5s}.vp-doc [class*=language-]>button.copy{direction:ltr;position:absolute;top:12px;right:12px;z-index:3;border:1px solid var(--vp-code-copy-code-border-color);border-radius:4px;width:40px;height:40px;background-color:var(--vp-code-copy-code-bg);opacity:0;cursor:pointer;background-image:var(--vp-icon-copy);background-position:50%;background-size:20px;background-repeat:no-repeat;transition:border-color .25s,background-color .25s,opacity .25s}.vp-doc [class*=language-]:hover>button.copy,.vp-doc [class*=language-]>button.copy:focus{opacity:1}.vp-doc [class*=language-]>button.copy:hover,.vp-doc [class*=language-]>button.copy.copied{border-color:var(--vp-code-copy-code-hover-border-color);background-color:var(--vp-code-copy-code-hover-bg)}.vp-doc [class*=language-]>button.copy.copied,.vp-doc [class*=language-]>button.copy:hover.copied{border-radius:0 4px 4px 0;background-color:var(--vp-code-copy-code-hover-bg);background-image:var(--vp-icon-copied)}.vp-doc [class*=language-]>button.copy.copied:before,.vp-doc [class*=language-]>button.copy:hover.copied:before{position:relative;top:-1px;transform:translate(calc(-100% - 1px));display:flex;justify-content:center;align-items:center;border:1px solid var(--vp-code-copy-code-hover-border-color);border-right:0;border-radius:4px 0 0 4px;padding:0 10px;width:fit-content;height:40px;text-align:center;font-size:12px;font-weight:500;color:var(--vp-code-copy-code-active-text);background-color:var(--vp-code-copy-code-hover-bg);white-space:nowrap;content:var(--vp-code-copy-copied-text-content)}.vp-doc [class*=language-]>span.lang{position:absolute;top:2px;right:8px;z-index:2;font-size:12px;font-weight:500;color:var(--vp-code-lang-color);transition:color .4s,opacity .4s}.vp-doc [class*=language-]:hover>button.copy+span.lang,.vp-doc [class*=language-]>button.copy:focus+span.lang{opacity:0}.vp-doc .VPTeamMembers{margin-top:24px}.vp-doc .VPTeamMembers.small.count-1 .container{margin:0!important;max-width:calc((100% - 24px)/2)!important}.vp-doc .VPTeamMembers.small.count-2 .container,.vp-doc .VPTeamMembers.small.count-3 .container{max-width:100%!important}.vp-doc .VPTeamMembers.medium.count-1 .container{margin:0!important;max-width:calc((100% - 24px)/2)!important}:is(.vp-external-link-icon,.vp-doc a[href*="://"],.vp-doc a[target=_blank]):not(.no-icon):after{display:inline-block;margin-top:-1px;margin-left:4px;width:11px;height:11px;background:currentColor;color:var(--vp-c-text-3);flex-shrink:0;--icon: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' %3E%3Cpath d='M0 0h24v24H0V0z' fill='none' /%3E%3Cpath d='M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z' /%3E%3C/svg%3E");-webkit-mask-image:var(--icon);mask-image:var(--icon)}.vp-external-link-icon:after{content:""}.vp-sponsor{border-radius:16px;overflow:hidden}.vp-sponsor.aside{border-radius:12px}.vp-sponsor-section+.vp-sponsor-section{margin-top:4px}.vp-sponsor-tier{margin-bottom:4px;text-align:center;letter-spacing:1px;line-height:24px;width:100%;font-weight:600;color:var(--vp-c-text-2);background-color:var(--vp-c-bg-soft)}.vp-sponsor.normal .vp-sponsor-tier{padding:13px 0 11px;font-size:14px}.vp-sponsor.aside .vp-sponsor-tier{padding:9px 0 7px;font-size:12px}.vp-sponsor-grid+.vp-sponsor-tier{margin-top:4px}.vp-sponsor-grid{display:flex;flex-wrap:wrap;gap:4px}.vp-sponsor-grid.xmini .vp-sponsor-grid-link{height:64px}.vp-sponsor-grid.xmini .vp-sponsor-grid-image{max-width:64px;max-height:22px}.vp-sponsor-grid.mini .vp-sponsor-grid-link{height:72px}.vp-sponsor-grid.mini .vp-sponsor-grid-image{max-width:96px;max-height:24px}.vp-sponsor-grid.small .vp-sponsor-grid-link{height:96px}.vp-sponsor-grid.small .vp-sponsor-grid-image{max-width:96px;max-height:24px}.vp-sponsor-grid.medium .vp-sponsor-grid-link{height:112px}.vp-sponsor-grid.medium .vp-sponsor-grid-image{max-width:120px;max-height:36px}.vp-sponsor-grid.big .vp-sponsor-grid-link{height:184px}.vp-sponsor-grid.big .vp-sponsor-grid-image{max-width:192px;max-height:56px}.vp-sponsor-grid[data-vp-grid="2"] .vp-sponsor-grid-item{width:calc((100% - 4px)/2)}.vp-sponsor-grid[data-vp-grid="3"] .vp-sponsor-grid-item{width:calc((100% - 4px * 2) / 3)}.vp-sponsor-grid[data-vp-grid="4"] .vp-sponsor-grid-item{width:calc((100% - 12px)/4)}.vp-sponsor-grid[data-vp-grid="5"] .vp-sponsor-grid-item{width:calc((100% - 16px)/5)}.vp-sponsor-grid[data-vp-grid="6"] .vp-sponsor-grid-item{width:calc((100% - 4px * 5) / 6)}.vp-sponsor-grid-item{flex-shrink:0;width:100%;background-color:var(--vp-c-bg-soft);transition:background-color .25s}.vp-sponsor-grid-item:hover{background-color:var(--vp-c-default-soft)}.vp-sponsor-grid-item:hover .vp-sponsor-grid-image{filter:grayscale(0) invert(0)}.vp-sponsor-grid-item.empty:hover{background-color:var(--vp-c-bg-soft)}.dark .vp-sponsor-grid-item:hover{background-color:var(--vp-c-white)}.dark .vp-sponsor-grid-item.empty:hover{background-color:var(--vp-c-bg-soft)}.vp-sponsor-grid-link{display:flex}.vp-sponsor-grid-box{display:flex;justify-content:center;align-items:center;width:100%}.vp-sponsor-grid-image{max-width:100%;filter:grayscale(1);transition:filter .25s}.dark .vp-sponsor-grid-image{filter:grayscale(1) invert(1)}.VPBadge[data-v-9613cc9f]{display:inline-block;margin-left:2px;border:1px solid transparent;border-radius:12px;padding:0 10px;line-height:22px;font-size:12px;font-weight:500;transform:translateY(-2px)}.vp-doc h1>.VPBadge[data-v-9613cc9f]{margin-top:4px;vertical-align:top}.vp-doc h2>.VPBadge[data-v-9613cc9f]{margin-top:3px;padding:0 8px;vertical-align:top}.vp-doc h3>.VPBadge[data-v-9613cc9f]{vertical-align:middle}.vp-doc h4>.VPBadge[data-v-9613cc9f],.vp-doc h5>.VPBadge[data-v-9613cc9f],.vp-doc h6>.VPBadge[data-v-9613cc9f]{vertical-align:middle;line-height:18px}.VPBadge.info[data-v-9613cc9f]{border-color:var(--vp-badge-info-border);color:var(--vp-badge-info-text);background-color:var(--vp-badge-info-bg)}.VPBadge.tip[data-v-9613cc9f]{border-color:var(--vp-badge-tip-border);color:var(--vp-badge-tip-text);background-color:var(--vp-badge-tip-bg)}.VPBadge.warning[data-v-9613cc9f]{border-color:var(--vp-badge-warning-border);color:var(--vp-badge-warning-text);background-color:var(--vp-badge-warning-bg)}.VPBadge.danger[data-v-9613cc9f]{border-color:var(--vp-badge-danger-border);color:var(--vp-badge-danger-text);background-color:var(--vp-badge-danger-bg)}.VPBackdrop[data-v-c79a1216]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--vp-z-index-backdrop);background:var(--vp-backdrop-bg-color);transition:opacity .5s}.VPBackdrop.fade-enter-from[data-v-c79a1216],.VPBackdrop.fade-leave-to[data-v-c79a1216]{opacity:0}.VPBackdrop.fade-leave-active[data-v-c79a1216]{transition-duration:.25s}@media (min-width: 1280px){.VPBackdrop[data-v-c79a1216]{display:none}}.NotFound[data-v-f87ff6e4]{padding:64px 24px 96px;text-align:center}@media (min-width: 768px){.NotFound[data-v-f87ff6e4]{padding:96px 32px 168px}}.code[data-v-f87ff6e4]{line-height:64px;font-size:64px;font-weight:600}.title[data-v-f87ff6e4]{padding-top:12px;letter-spacing:2px;line-height:20px;font-size:20px;font-weight:700}.divider[data-v-f87ff6e4]{margin:24px auto 18px;width:64px;height:1px;background-color:var(--vp-c-divider)}.quote[data-v-f87ff6e4]{margin:0 auto;max-width:256px;font-size:14px;font-weight:500;color:var(--vp-c-text-2)}.action[data-v-f87ff6e4]{padding-top:20px}.link[data-v-f87ff6e4]{display:inline-block;border:1px solid var(--vp-c-brand-1);border-radius:16px;padding:3px 16px;font-size:14px;font-weight:500;color:var(--vp-c-brand-1);transition:border-color .25s,color .25s}.link[data-v-f87ff6e4]:hover{border-color:var(--vp-c-brand-2);color:var(--vp-c-brand-2)}.root[data-v-d0ee3533]{position:relative;z-index:1}.nested[data-v-d0ee3533]{padding-left:16px}.outline-link[data-v-d0ee3533]{display:block;line-height:28px;color:var(--vp-c-text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .5s;font-weight:400}.outline-link[data-v-d0ee3533]:hover,.outline-link.active[data-v-d0ee3533]{color:var(--vp-c-text-1);transition:color .25s}.outline-link.nested[data-v-d0ee3533]{padding-left:13px}.VPDocAsideOutline[data-v-d330b1bb]{display:none}.VPDocAsideOutline.has-outline[data-v-d330b1bb]{display:block}.content[data-v-d330b1bb]{position:relative;border-left:1px solid var(--vp-c-divider);padding-left:16px;font-size:13px;font-weight:500}.outline-marker[data-v-d330b1bb]{position:absolute;top:32px;left:-1px;z-index:0;opacity:0;width:2px;border-radius:2px;height:18px;background-color:var(--vp-c-brand-1);transition:top .25s cubic-bezier(0,1,.5,1),background-color .5s,opacity .25s}.outline-title[data-v-d330b1bb]{letter-spacing:.4px;line-height:28px;font-size:13px;font-weight:600}.VPDocAside[data-v-3f215769]{display:flex;flex-direction:column;flex-grow:1}.spacer[data-v-3f215769]{flex-grow:1}.VPDocAside[data-v-3f215769] .spacer+.VPDocAsideSponsors,.VPDocAside[data-v-3f215769] .spacer+.VPDocAsideCarbonAds{margin-top:24px}.VPDocAside[data-v-3f215769] .VPDocAsideSponsors+.VPDocAsideCarbonAds{margin-top:16px}.VPLastUpdated[data-v-7e05ebdb]{line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-2)}@media (min-width: 640px){.VPLastUpdated[data-v-7e05ebdb]{line-height:32px;font-size:14px;font-weight:500}}.VPDocFooter[data-v-ef5dee53]{margin-top:64px}.edit-info[data-v-ef5dee53]{padding-bottom:18px}@media (min-width: 640px){.edit-info[data-v-ef5dee53]{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px}}.edit-link-button[data-v-ef5dee53]{display:flex;align-items:center;border:0;line-height:32px;font-size:14px;font-weight:500;color:var(--vp-c-brand-1);transition:color .25s}.edit-link-button[data-v-ef5dee53]:hover{color:var(--vp-c-brand-2)}.edit-link-icon[data-v-ef5dee53]{margin-right:8px;width:14px;height:14px;fill:currentColor}.prev-next[data-v-ef5dee53]{border-top:1px solid var(--vp-c-divider);padding-top:24px;display:grid;grid-row-gap:8px}@media (min-width: 640px){.prev-next[data-v-ef5dee53]{grid-template-columns:repeat(2,1fr);grid-column-gap:16px}}.pager-link[data-v-ef5dee53]{display:block;border:1px solid var(--vp-c-divider);border-radius:8px;padding:11px 16px 13px;width:100%;height:100%;transition:border-color .25s}.pager-link[data-v-ef5dee53]:hover{border-color:var(--vp-c-brand-1)}.pager-link.next[data-v-ef5dee53]{margin-left:auto;text-align:right}.desc[data-v-ef5dee53]{display:block;line-height:20px;font-size:12px;font-weight:500;color:var(--vp-c-text-2)}.title[data-v-ef5dee53]{display:block;line-height:20px;font-size:14px;font-weight:500;color:var(--vp-c-brand-1);transition:color .25s}.VPDocOutlineDropdown[data-v-eadfb36b]{margin-bottom:48px}.VPDocOutlineDropdown button[data-v-eadfb36b]{display:block;font-size:14px;font-weight:500;line-height:24px;border:1px solid var(--vp-c-border);padding:4px 12px;color:var(--vp-c-text-2);background-color:var(--vp-c-default-soft);border-radius:8px;transition:color .5s}.VPDocOutlineDropdown button[data-v-eadfb36b]:hover{color:var(--vp-c-text-1);transition:color .25s}.VPDocOutlineDropdown button.open[data-v-eadfb36b]{color:var(--vp-c-text-1)}.icon[data-v-eadfb36b]{display:inline-block;vertical-align:middle;width:16px;height:16px;fill:currentColor}[data-v-eadfb36b] .outline-link{font-size:14px;font-weight:400}.open>.icon[data-v-eadfb36b]{transform:rotate(90deg)}.items[data-v-eadfb36b]{margin-top:12px;border-left:1px solid var(--vp-c-divider)}.VPDoc[data-v-6b87e69f]{padding:32px 24px 96px;width:100%}.VPDoc .VPDocOutlineDropdown[data-v-6b87e69f]{display:none}@media (min-width: 960px) and (max-width: 1279px){.VPDoc .VPDocOutlineDropdown[data-v-6b87e69f]{display:block}}@media (min-width: 768px){.VPDoc[data-v-6b87e69f]{padding:48px 32px 128px}}@media (min-width: 960px){.VPDoc[data-v-6b87e69f]{padding:32px 32px 0}.VPDoc:not(.has-sidebar) .container[data-v-6b87e69f]{display:flex;justify-content:center;max-width:992px}.VPDoc:not(.has-sidebar) .content[data-v-6b87e69f]{max-width:752px}}@media (min-width: 1280px){.VPDoc .container[data-v-6b87e69f]{display:flex;justify-content:center}.VPDoc .aside[data-v-6b87e69f]{display:block}}@media (min-width: 1440px){.VPDoc:not(.has-sidebar) .content[data-v-6b87e69f]{max-width:784px}.VPDoc:not(.has-sidebar) .container[data-v-6b87e69f]{max-width:1104px}}.container[data-v-6b87e69f]{margin:0 auto;width:100%}.aside[data-v-6b87e69f]{position:relative;display:none;order:2;flex-grow:1;padding-left:32px;width:100%;max-width:256px}.left-aside[data-v-6b87e69f]{order:1;padding-left:unset;padding-right:32px}.aside-container[data-v-6b87e69f]{position:fixed;top:0;padding-top:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + var(--vp-doc-top-height, 0px) + 32px);width:224px;height:100vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none}.aside-container[data-v-6b87e69f]::-webkit-scrollbar{display:none}.aside-curtain[data-v-6b87e69f]{position:fixed;bottom:0;z-index:10;width:224px;height:32px;background:linear-gradient(transparent,var(--vp-c-bg) 70%)}.aside-content[data-v-6b87e69f]{display:flex;flex-direction:column;min-height:calc(100vh - (var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 32px));padding-bottom:32px}.content[data-v-6b87e69f]{position:relative;margin:0 auto;width:100%}@media (min-width: 960px){.content[data-v-6b87e69f]{padding:0 32px 128px}}@media (min-width: 1280px){.content[data-v-6b87e69f]{order:1;margin:0;min-width:640px}}.content-container[data-v-6b87e69f]{margin:0 auto}.VPDoc.has-aside .content-container[data-v-6b87e69f]{max-width:688px}.external-link-icon-enabled[data-v-6b87e69f] :is(.vp-doc a[href*="://"],.vp-doc a[target=_blank]):after{content:"";color:currentColor}.VPButton[data-v-c1c5efc1]{display:inline-block;border:1px solid transparent;text-align:center;font-weight:600;white-space:nowrap;transition:color .25s,border-color .25s,background-color .25s}.VPButton[data-v-c1c5efc1]:active{transition:color .1s,border-color .1s,background-color .1s}.VPButton.medium[data-v-c1c5efc1]{border-radius:20px;padding:0 20px;line-height:38px;font-size:14px}.VPButton.big[data-v-c1c5efc1]{border-radius:24px;padding:0 24px;line-height:46px;font-size:16px}.VPButton.brand[data-v-c1c5efc1]{border-color:var(--vp-button-brand-border);color:var(--vp-button-brand-text);background-color:var(--vp-button-brand-bg)}.VPButton.brand[data-v-c1c5efc1]:hover{border-color:var(--vp-button-brand-hover-border);color:var(--vp-button-brand-hover-text);background-color:var(--vp-button-brand-hover-bg)}.VPButton.brand[data-v-c1c5efc1]:active{border-color:var(--vp-button-brand-active-border);color:var(--vp-button-brand-active-text);background-color:var(--vp-button-brand-active-bg)}.VPButton.alt[data-v-c1c5efc1]{border-color:var(--vp-button-alt-border);color:var(--vp-button-alt-text);background-color:var(--vp-button-alt-bg)}.VPButton.alt[data-v-c1c5efc1]:hover{border-color:var(--vp-button-alt-hover-border);color:var(--vp-button-alt-hover-text);background-color:var(--vp-button-alt-hover-bg)}.VPButton.alt[data-v-c1c5efc1]:active{border-color:var(--vp-button-alt-active-border);color:var(--vp-button-alt-active-text);background-color:var(--vp-button-alt-active-bg)}.VPButton.sponsor[data-v-c1c5efc1]{border-color:var(--vp-button-sponsor-border);color:var(--vp-button-sponsor-text);background-color:var(--vp-button-sponsor-bg)}.VPButton.sponsor[data-v-c1c5efc1]:hover{border-color:var(--vp-button-sponsor-hover-border);color:var(--vp-button-sponsor-hover-text);background-color:var(--vp-button-sponsor-hover-bg)}.VPButton.sponsor[data-v-c1c5efc1]:active{border-color:var(--vp-button-sponsor-active-border);color:var(--vp-button-sponsor-active-text);background-color:var(--vp-button-sponsor-active-bg)}html:not(.dark) .VPImage.dark[data-v-8426fc1a]{display:none}.dark .VPImage.light[data-v-8426fc1a]{display:none}.VPHero[data-v-da5d1713]{margin-top:calc((var(--vp-nav-height) + var(--vp-layout-top-height, 0px)) * -1);padding:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 48px) 24px 48px}@media (min-width: 640px){.VPHero[data-v-da5d1713]{padding:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 80px) 48px 64px}}@media (min-width: 960px){.VPHero[data-v-da5d1713]{padding:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 80px) 64px 64px}}.container[data-v-da5d1713]{display:flex;flex-direction:column;margin:0 auto;max-width:1152px}@media (min-width: 960px){.container[data-v-da5d1713]{flex-direction:row}}.main[data-v-da5d1713]{position:relative;z-index:10;order:2;flex-grow:1;flex-shrink:0}.VPHero.has-image .container[data-v-da5d1713]{text-align:center}@media (min-width: 960px){.VPHero.has-image .container[data-v-da5d1713]{text-align:left}}@media (min-width: 960px){.main[data-v-da5d1713]{order:1;width:calc((100% / 3) * 2)}.VPHero.has-image .main[data-v-da5d1713]{max-width:592px}}.name[data-v-da5d1713],.text[data-v-da5d1713]{max-width:392px;letter-spacing:-.4px;line-height:40px;font-size:32px;font-weight:700;white-space:pre-wrap}.VPHero.has-image .name[data-v-da5d1713],.VPHero.has-image .text[data-v-da5d1713]{margin:0 auto}.name[data-v-da5d1713]{color:var(--vp-home-hero-name-color)}.clip[data-v-da5d1713]{background:var(--vp-home-hero-name-background);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:var(--vp-home-hero-name-color)}@media (min-width: 640px){.name[data-v-da5d1713],.text[data-v-da5d1713]{max-width:576px;line-height:56px;font-size:48px}}@media (min-width: 960px){.name[data-v-da5d1713],.text[data-v-da5d1713]{line-height:64px;font-size:56px}.VPHero.has-image .name[data-v-da5d1713],.VPHero.has-image .text[data-v-da5d1713]{margin:0}}.tagline[data-v-da5d1713]{padding-top:8px;max-width:392px;line-height:28px;font-size:18px;font-weight:500;white-space:pre-wrap;color:var(--vp-c-text-2)}.VPHero.has-image .tagline[data-v-da5d1713]{margin:0 auto}@media (min-width: 640px){.tagline[data-v-da5d1713]{padding-top:12px;max-width:576px;line-height:32px;font-size:20px}}@media (min-width: 960px){.tagline[data-v-da5d1713]{line-height:36px;font-size:24px}.VPHero.has-image .tagline[data-v-da5d1713]{margin:0}}.actions[data-v-da5d1713]{display:flex;flex-wrap:wrap;margin:-6px;padding-top:24px}.VPHero.has-image .actions[data-v-da5d1713]{justify-content:center}@media (min-width: 640px){.actions[data-v-da5d1713]{padding-top:32px}}@media (min-width: 960px){.VPHero.has-image .actions[data-v-da5d1713]{justify-content:flex-start}}.action[data-v-da5d1713]{flex-shrink:0;padding:6px}.image[data-v-da5d1713]{order:1;margin:-76px -24px -48px}@media (min-width: 640px){.image[data-v-da5d1713]{margin:-108px -24px -48px}}@media (min-width: 960px){.image[data-v-da5d1713]{flex-grow:1;order:2;margin:0;min-height:100%}}.image-container[data-v-da5d1713]{position:relative;margin:0 auto;width:320px;height:320px}@media (min-width: 640px){.image-container[data-v-da5d1713]{width:392px;height:392px}}@media (min-width: 960px){.image-container[data-v-da5d1713]{display:flex;justify-content:center;align-items:center;width:100%;height:100%;transform:translate(-32px,-32px)}}.image-bg[data-v-da5d1713]{position:absolute;top:50%;left:50%;border-radius:50%;width:192px;height:192px;background-image:var(--vp-home-hero-image-background-image);filter:var(--vp-home-hero-image-filter);transform:translate(-50%,-50%)}@media (min-width: 640px){.image-bg[data-v-da5d1713]{width:256px;height:256px}}@media (min-width: 960px){.image-bg[data-v-da5d1713]{width:320px;height:320px}}[data-v-da5d1713] .image-src{position:absolute;top:50%;left:50%;max-width:192px;max-height:192px;transform:translate(-50%,-50%)}@media (min-width: 640px){[data-v-da5d1713] .image-src{max-width:256px;max-height:256px}}@media (min-width: 960px){[data-v-da5d1713] .image-src{max-width:320px;max-height:320px}}.VPFeature[data-v-33204567]{display:block;border:1px solid var(--vp-c-bg-soft);border-radius:12px;height:100%;background-color:var(--vp-c-bg-soft);transition:border-color .25s,background-color .25s}.VPFeature.link[data-v-33204567]:hover{border-color:var(--vp-c-brand-1)}.box[data-v-33204567]{display:flex;flex-direction:column;padding:24px;height:100%}.box[data-v-33204567]>.VPImage{margin-bottom:20px}.icon[data-v-33204567]{display:flex;justify-content:center;align-items:center;margin-bottom:20px;border-radius:6px;background-color:var(--vp-c-default-soft);width:48px;height:48px;font-size:24px;transition:background-color .25s}.title[data-v-33204567]{line-height:24px;font-size:16px;font-weight:600}.details[data-v-33204567]{flex-grow:1;padding-top:8px;line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-2)}.link-text[data-v-33204567]{padding-top:8px}.link-text-value[data-v-33204567]{display:flex;align-items:center;font-size:14px;font-weight:500;color:var(--vp-c-brand-1)}.link-text-icon[data-v-33204567]{display:inline-block;margin-left:6px;width:14px;height:14px;fill:currentColor}.VPFeatures[data-v-a6181336]{position:relative;padding:0 24px}@media (min-width: 640px){.VPFeatures[data-v-a6181336]{padding:0 48px}}@media (min-width: 960px){.VPFeatures[data-v-a6181336]{padding:0 64px}}.container[data-v-a6181336]{margin:0 auto;max-width:1152px}.items[data-v-a6181336]{display:flex;flex-wrap:wrap;margin:-8px}.item[data-v-a6181336]{padding:8px;width:100%}@media (min-width: 640px){.item.grid-2[data-v-a6181336],.item.grid-4[data-v-a6181336],.item.grid-6[data-v-a6181336]{width:50%}}@media (min-width: 768px){.item.grid-2[data-v-a6181336],.item.grid-4[data-v-a6181336]{width:50%}.item.grid-3[data-v-a6181336],.item.grid-6[data-v-a6181336]{width:calc(100% / 3)}}@media (min-width: 960px){.item.grid-4[data-v-a6181336]{width:25%}}.VPHome[data-v-d82743a8]{padding-bottom:96px}.VPHome[data-v-d82743a8] .VPHomeSponsors{margin-top:112px;margin-bottom:-128px}@media (min-width: 768px){.VPHome[data-v-d82743a8]{padding-bottom:128px}}.VPContent[data-v-669faec9]{flex-grow:1;flex-shrink:0;margin:var(--vp-layout-top-height, 0px) auto 0;width:100%}.VPContent.is-home[data-v-669faec9]{width:100%;max-width:100%}.VPContent.has-sidebar[data-v-669faec9]{margin:0}@media (min-width: 960px){.VPContent[data-v-669faec9]{padding-top:var(--vp-nav-height)}.VPContent.has-sidebar[data-v-669faec9]{margin:var(--vp-layout-top-height, 0px) 0 0;padding-left:var(--vp-sidebar-width)}}@media (min-width: 1440px){.VPContent.has-sidebar[data-v-669faec9]{padding-right:calc((100vw - var(--vp-layout-max-width)) / 2);padding-left:calc((100vw - var(--vp-layout-max-width)) / 2 + var(--vp-sidebar-width))}}.VPFooter[data-v-e03eb2e1]{position:relative;z-index:var(--vp-z-index-footer);border-top:1px solid var(--vp-c-gutter);padding:32px 24px;background-color:var(--vp-c-bg)}.VPFooter.has-sidebar[data-v-e03eb2e1]{display:none}@media (min-width: 768px){.VPFooter[data-v-e03eb2e1]{padding:32px}}.container[data-v-e03eb2e1]{margin:0 auto;max-width:var(--vp-layout-max-width);text-align:center}.message[data-v-e03eb2e1],.copyright[data-v-e03eb2e1]{line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-2)}.VPLocalNavOutlineDropdown[data-v-1c15a60a]{padding:12px 20px 11px}.VPLocalNavOutlineDropdown button[data-v-1c15a60a]{display:block;font-size:12px;font-weight:500;line-height:24px;color:var(--vp-c-text-2);transition:color .5s;position:relative}.VPLocalNavOutlineDropdown button[data-v-1c15a60a]:hover{color:var(--vp-c-text-1);transition:color .25s}.VPLocalNavOutlineDropdown button.open[data-v-1c15a60a]{color:var(--vp-c-text-1)}.icon[data-v-1c15a60a]{display:inline-block;vertical-align:middle;margin-left:2px;width:14px;height:14px;fill:currentColor}[data-v-1c15a60a] .outline-link{font-size:14px;padding:2px 0}.open>.icon[data-v-1c15a60a]{transform:rotate(90deg)}.items[data-v-1c15a60a]{position:absolute;top:64px;right:16px;left:16px;display:grid;gap:1px;border:1px solid var(--vp-c-border);border-radius:8px;background-color:var(--vp-c-gutter);max-height:calc(var(--vp-vh, 100vh) - 86px);overflow:hidden auto;box-shadow:var(--vp-shadow-3)}.header[data-v-1c15a60a]{background-color:var(--vp-c-bg-soft)}.top-link[data-v-1c15a60a]{display:block;padding:0 16px;line-height:48px;font-size:14px;font-weight:500;color:var(--vp-c-brand-1)}.outline[data-v-1c15a60a]{padding:8px 0;background-color:var(--vp-c-bg-soft)}.flyout-enter-active[data-v-1c15a60a]{transition:all .2s ease-out}.flyout-leave-active[data-v-1c15a60a]{transition:all .15s ease-in}.flyout-enter-from[data-v-1c15a60a],.flyout-leave-to[data-v-1c15a60a]{opacity:0;transform:translateY(-16px)}.VPLocalNav[data-v-79c8c1df]{position:sticky;top:0;left:0;z-index:var(--vp-z-index-local-nav);display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--vp-c-gutter);border-bottom:1px solid var(--vp-c-gutter);padding-top:var(--vp-layout-top-height, 0px);width:100%;background-color:var(--vp-local-nav-bg-color)}.VPLocalNav.fixed[data-v-79c8c1df]{position:fixed}.VPLocalNav.reached-top[data-v-79c8c1df]{border-top-color:transparent}@media (min-width: 960px){.VPLocalNav[data-v-79c8c1df]{display:none}}.menu[data-v-79c8c1df]{display:flex;align-items:center;padding:12px 24px 11px;line-height:24px;font-size:12px;font-weight:500;color:var(--vp-c-text-2);transition:color .5s}.menu[data-v-79c8c1df]:hover{color:var(--vp-c-text-1);transition:color .25s}@media (min-width: 768px){.menu[data-v-79c8c1df]{padding:0 32px}}.menu-icon[data-v-79c8c1df]{margin-right:8px;width:16px;height:16px;fill:currentColor}.VPOutlineDropdown[data-v-79c8c1df]{padding:12px 24px 11px}@media (min-width: 768px){.VPOutlineDropdown[data-v-79c8c1df]{padding:12px 32px 11px}}.VPSwitch[data-v-b1685198]{position:relative;border-radius:11px;display:block;width:40px;height:22px;flex-shrink:0;border:1px solid var(--vp-input-border-color);background-color:var(--vp-input-switch-bg-color);transition:border-color .25s!important}.VPSwitch[data-v-b1685198]:hover{border-color:var(--vp-c-brand-1)}.check[data-v-b1685198]{position:absolute;top:1px;left:1px;width:18px;height:18px;border-radius:50%;background-color:var(--vp-c-neutral-inverse);box-shadow:var(--vp-shadow-1);transition:transform .25s!important}.icon[data-v-b1685198]{position:relative;display:block;width:18px;height:18px;border-radius:50%;overflow:hidden}.icon[data-v-b1685198] svg{position:absolute;top:3px;left:3px;width:12px;height:12px;fill:var(--vp-c-text-2)}.dark .icon[data-v-b1685198] svg{fill:var(--vp-c-text-1);transition:opacity .25s!important}.sun[data-v-ce54a7d1]{opacity:1}.moon[data-v-ce54a7d1],.dark .sun[data-v-ce54a7d1]{opacity:0}.dark .moon[data-v-ce54a7d1]{opacity:1}.dark .VPSwitchAppearance[data-v-ce54a7d1] .check{transform:translate(18px)}.VPNavBarAppearance[data-v-e6aabb21]{display:none}@media (min-width: 1280px){.VPNavBarAppearance[data-v-e6aabb21]{display:flex;align-items:center}}.VPMenuGroup+.VPMenuLink[data-v-43f1e123]{margin:12px -12px 0;border-top:1px solid var(--vp-c-divider);padding:12px 12px 0}.link[data-v-43f1e123]{display:block;border-radius:6px;padding:0 12px;line-height:32px;font-size:14px;font-weight:500;color:var(--vp-c-text-1);white-space:nowrap;transition:background-color .25s,color .25s}.link[data-v-43f1e123]:hover{color:var(--vp-c-brand-1);background-color:var(--vp-c-default-soft)}.link.active[data-v-43f1e123]{color:var(--vp-c-brand-1)}.VPMenuGroup[data-v-69e747b5]{margin:12px -12px 0;border-top:1px solid var(--vp-c-divider);padding:12px 12px 0}.VPMenuGroup[data-v-69e747b5]:first-child{margin-top:0;border-top:0;padding-top:0}.VPMenuGroup+.VPMenuGroup[data-v-69e747b5]{margin-top:12px;border-top:1px solid var(--vp-c-divider)}.title[data-v-69e747b5]{padding:0 12px;line-height:32px;font-size:14px;font-weight:600;color:var(--vp-c-text-2);white-space:nowrap;transition:color .25s}.VPMenu[data-v-e7ea1737]{border-radius:12px;padding:12px;min-width:128px;border:1px solid var(--vp-c-divider);background-color:var(--vp-c-bg-elv);box-shadow:var(--vp-shadow-3);transition:background-color .5s;max-height:calc(100vh - var(--vp-nav-height));overflow-y:auto}.VPMenu[data-v-e7ea1737] .group{margin:0 -12px;padding:0 12px 12px}.VPMenu[data-v-e7ea1737] .group+.group{border-top:1px solid var(--vp-c-divider);padding:11px 12px 12px}.VPMenu[data-v-e7ea1737] .group:last-child{padding-bottom:0}.VPMenu[data-v-e7ea1737] .group+.item{border-top:1px solid var(--vp-c-divider);padding:11px 16px 0}.VPMenu[data-v-e7ea1737] .item{padding:0 16px;white-space:nowrap}.VPMenu[data-v-e7ea1737] .label{flex-grow:1;line-height:28px;font-size:12px;font-weight:500;color:var(--vp-c-text-2);transition:color .5s}.VPMenu[data-v-e7ea1737] .action{padding-left:24px}.VPFlyout[data-v-9c007e85]{position:relative}.VPFlyout[data-v-9c007e85]:hover{color:var(--vp-c-brand-1);transition:color .25s}.VPFlyout:hover .text[data-v-9c007e85]{color:var(--vp-c-text-2)}.VPFlyout:hover .icon[data-v-9c007e85]{fill:var(--vp-c-text-2)}.VPFlyout.active .text[data-v-9c007e85]{color:var(--vp-c-brand-1)}.VPFlyout.active:hover .text[data-v-9c007e85]{color:var(--vp-c-brand-2)}.VPFlyout:hover .menu[data-v-9c007e85],.button[aria-expanded=true]+.menu[data-v-9c007e85]{opacity:1;visibility:visible;transform:translateY(0)}.button[aria-expanded=false]+.menu[data-v-9c007e85]{opacity:0;visibility:hidden;transform:translateY(0)}.button[data-v-9c007e85]{display:flex;align-items:center;padding:0 12px;height:var(--vp-nav-height);color:var(--vp-c-text-1);transition:color .5s}.text[data-v-9c007e85]{display:flex;align-items:center;line-height:var(--vp-nav-height);font-size:14px;font-weight:500;color:var(--vp-c-text-1);transition:color .25s}.option-icon[data-v-9c007e85]{margin-right:0;width:16px;height:16px;fill:currentColor}.text-icon[data-v-9c007e85]{margin-left:4px;width:14px;height:14px;fill:currentColor}.icon[data-v-9c007e85]{width:20px;height:20px;fill:currentColor;transition:fill .25s}.menu[data-v-9c007e85]{position:absolute;top:calc(var(--vp-nav-height) / 2 + 20px);right:0;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s,transform .25s}.VPSocialLink[data-v-f80f8133]{display:flex;justify-content:center;align-items:center;width:36px;height:36px;color:var(--vp-c-text-2);transition:color .5s}.VPSocialLink[data-v-f80f8133]:hover{color:var(--vp-c-text-1);transition:color .25s}.VPSocialLink[data-v-f80f8133]>svg{width:20px;height:20px;fill:currentColor}.VPSocialLinks[data-v-7bc22406]{display:flex;justify-content:center}.VPNavBarExtra[data-v-40855f84]{display:none;margin-right:-12px}@media (min-width: 768px){.VPNavBarExtra[data-v-40855f84]{display:block}}@media (min-width: 1280px){.VPNavBarExtra[data-v-40855f84]{display:none}}.trans-title[data-v-40855f84]{padding:0 24px 0 12px;line-height:32px;font-size:14px;font-weight:700;color:var(--vp-c-text-1)}.item.appearance[data-v-40855f84],.item.social-links[data-v-40855f84]{display:flex;align-items:center;padding:0 12px}.item.appearance[data-v-40855f84]{min-width:176px}.appearance-action[data-v-40855f84]{margin-right:-2px}.social-links-list[data-v-40855f84]{margin:-4px -8px}.VPNavBarHamburger[data-v-e5dd9c1c]{display:flex;justify-content:center;align-items:center;width:48px;height:var(--vp-nav-height)}@media (min-width: 768px){.VPNavBarHamburger[data-v-e5dd9c1c]{display:none}}.container[data-v-e5dd9c1c]{position:relative;width:16px;height:14px;overflow:hidden}.VPNavBarHamburger:hover .top[data-v-e5dd9c1c]{top:0;left:0;transform:translate(4px)}.VPNavBarHamburger:hover .middle[data-v-e5dd9c1c]{top:6px;left:0;transform:translate(0)}.VPNavBarHamburger:hover .bottom[data-v-e5dd9c1c]{top:12px;left:0;transform:translate(8px)}.VPNavBarHamburger.active .top[data-v-e5dd9c1c]{top:6px;transform:translate(0) rotate(225deg)}.VPNavBarHamburger.active .middle[data-v-e5dd9c1c]{top:6px;transform:translate(16px)}.VPNavBarHamburger.active .bottom[data-v-e5dd9c1c]{top:6px;transform:translate(0) rotate(135deg)}.VPNavBarHamburger.active:hover .top[data-v-e5dd9c1c],.VPNavBarHamburger.active:hover .middle[data-v-e5dd9c1c],.VPNavBarHamburger.active:hover .bottom[data-v-e5dd9c1c]{background-color:var(--vp-c-text-2);transition:top .25s,background-color .25s,transform .25s}.top[data-v-e5dd9c1c],.middle[data-v-e5dd9c1c],.bottom[data-v-e5dd9c1c]{position:absolute;width:16px;height:2px;background-color:var(--vp-c-text-1);transition:top .25s,background-color .5s,transform .25s}.top[data-v-e5dd9c1c]{top:0;left:0;transform:translate(0)}.middle[data-v-e5dd9c1c]{top:6px;left:0;transform:translate(8px)}.bottom[data-v-e5dd9c1c]{top:12px;left:0;transform:translate(4px)}.VPNavBarMenuLink[data-v-42ef59de]{display:flex;align-items:center;padding:0 12px;line-height:var(--vp-nav-height);font-size:14px;font-weight:500;color:var(--vp-c-text-1);transition:color .25s}.VPNavBarMenuLink.active[data-v-42ef59de],.VPNavBarMenuLink[data-v-42ef59de]:hover{color:var(--vp-c-brand-1)}.VPNavBarMenu[data-v-7f418b0f]{display:none}@media (min-width: 768px){.VPNavBarMenu[data-v-7f418b0f]{display:flex}}/*! @docsearch/css 3.5.2 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */:root{--docsearch-primary-color:#5468ff;--docsearch-text-color:#1c1e21;--docsearch-spacing:12px;--docsearch-icon-stroke-width:1.4;--docsearch-highlight-color:var(--docsearch-primary-color);--docsearch-muted-color:#969faf;--docsearch-container-background:rgba(101,108,133,.8);--docsearch-logo-color:#5468ff;--docsearch-modal-width:560px;--docsearch-modal-height:600px;--docsearch-modal-background:#f5f6f7;--docsearch-modal-shadow:inset 1px 1px 0 0 hsla(0,0%,100%,.5),0 3px 8px 0 #555a64;--docsearch-searchbox-height:56px;--docsearch-searchbox-background:#ebedf0;--docsearch-searchbox-focus-background:#fff;--docsearch-searchbox-shadow:inset 0 0 0 2px var(--docsearch-primary-color);--docsearch-hit-height:56px;--docsearch-hit-color:#444950;--docsearch-hit-active-color:#fff;--docsearch-hit-background:#fff;--docsearch-hit-shadow:0 1px 3px 0 #d4d9e1;--docsearch-key-gradient:linear-gradient(-225deg,#d5dbe4,#f8f8f8);--docsearch-key-shadow:inset 0 -2px 0 0 #cdcde6,inset 0 0 1px 1px #fff,0 1px 2px 1px rgba(30,35,90,.4);--docsearch-footer-height:44px;--docsearch-footer-background:#fff;--docsearch-footer-shadow:0 -1px 0 0 #e0e3e8,0 -3px 6px 0 rgba(69,98,155,.12)}html[data-theme=dark]{--docsearch-text-color:#f5f6f7;--docsearch-container-background:rgba(9,10,17,.8);--docsearch-modal-background:#15172a;--docsearch-modal-shadow:inset 1px 1px 0 0 #2c2e40,0 3px 8px 0 #000309;--docsearch-searchbox-background:#090a11;--docsearch-searchbox-focus-background:#000;--docsearch-hit-color:#bec3c9;--docsearch-hit-shadow:none;--docsearch-hit-background:#090a11;--docsearch-key-gradient:linear-gradient(-26.5deg,#565872,#31355b);--docsearch-key-shadow:inset 0 -2px 0 0 #282d55,inset 0 0 1px 1px #51577d,0 2px 2px 0 rgba(3,4,9,.3);--docsearch-footer-background:#1e2136;--docsearch-footer-shadow:inset 0 1px 0 0 rgba(73,76,106,.5),0 -4px 8px 0 rgba(0,0,0,.2);--docsearch-logo-color:#fff;--docsearch-muted-color:#7f8497}.DocSearch-Button{align-items:center;background:var(--docsearch-searchbox-background);border:0;border-radius:40px;color:var(--docsearch-muted-color);cursor:pointer;display:flex;font-weight:500;height:36px;justify-content:space-between;margin:0 0 0 16px;padding:0 8px;-webkit-user-select:none;user-select:none}.DocSearch-Button:active,.DocSearch-Button:focus,.DocSearch-Button:hover{background:var(--docsearch-searchbox-focus-background);box-shadow:var(--docsearch-searchbox-shadow);color:var(--docsearch-text-color);outline:none}.DocSearch-Button-Container{align-items:center;display:flex}.DocSearch-Search-Icon{stroke-width:1.6}.DocSearch-Button .DocSearch-Search-Icon{color:var(--docsearch-text-color)}.DocSearch-Button-Placeholder{font-size:1rem;padding:0 12px 0 6px}.DocSearch-Button-Keys{display:flex;min-width:calc(40px + .8em)}.DocSearch-Button-Key{align-items:center;background:var(--docsearch-key-gradient);border-radius:3px;box-shadow:var(--docsearch-key-shadow);color:var(--docsearch-muted-color);display:flex;height:18px;justify-content:center;margin-right:.4em;position:relative;padding:0 0 2px;border:0;top:-1px;width:20px}@media (max-width:768px){.DocSearch-Button-Keys,.DocSearch-Button-Placeholder{display:none}}.DocSearch--active{overflow:hidden!important}.DocSearch-Container,.DocSearch-Container *{box-sizing:border-box}.DocSearch-Container{background-color:var(--docsearch-container-background);height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:200}.DocSearch-Container a{text-decoration:none}.DocSearch-Link{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;color:var(--docsearch-highlight-color);cursor:pointer;font:inherit;margin:0;padding:0}.DocSearch-Modal{background:var(--docsearch-modal-background);border-radius:6px;box-shadow:var(--docsearch-modal-shadow);flex-direction:column;margin:60px auto auto;max-width:var(--docsearch-modal-width);position:relative}.DocSearch-SearchBar{display:flex;padding:var(--docsearch-spacing) var(--docsearch-spacing) 0}.DocSearch-Form{align-items:center;background:var(--docsearch-searchbox-focus-background);border-radius:4px;box-shadow:var(--docsearch-searchbox-shadow);display:flex;height:var(--docsearch-searchbox-height);margin:0;padding:0 var(--docsearch-spacing);position:relative;width:100%}.DocSearch-Input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;color:var(--docsearch-text-color);flex:1;font:inherit;font-size:1.2em;height:100%;outline:none;padding:0 0 0 8px;width:80%}.DocSearch-Input::placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input::-webkit-search-cancel-button,.DocSearch-Input::-webkit-search-decoration,.DocSearch-Input::-webkit-search-results-button,.DocSearch-Input::-webkit-search-results-decoration{display:none}.DocSearch-LoadingIndicator,.DocSearch-MagnifierLabel,.DocSearch-Reset{margin:0;padding:0}.DocSearch-MagnifierLabel,.DocSearch-Reset{align-items:center;color:var(--docsearch-highlight-color);display:flex;justify-content:center}.DocSearch-Container--Stalled .DocSearch-MagnifierLabel,.DocSearch-LoadingIndicator{display:none}.DocSearch-Container--Stalled .DocSearch-LoadingIndicator{align-items:center;color:var(--docsearch-highlight-color);display:flex;justify-content:center}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Reset{animation:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;right:0;stroke-width:var(--docsearch-icon-stroke-width)}}.DocSearch-Reset{animation:fade-in .1s ease-in forwards;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;padding:2px;right:0;stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Reset[hidden]{display:none}.DocSearch-Reset:hover{color:var(--docsearch-highlight-color)}.DocSearch-LoadingIndicator svg,.DocSearch-MagnifierLabel svg{height:24px;width:24px}.DocSearch-Cancel{display:none}.DocSearch-Dropdown{max-height:calc(var(--docsearch-modal-height) - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height));min-height:var(--docsearch-spacing);overflow-y:auto;overflow-y:overlay;padding:0 var(--docsearch-spacing);scrollbar-color:var(--docsearch-muted-color) var(--docsearch-modal-background);scrollbar-width:thin}.DocSearch-Dropdown::-webkit-scrollbar{width:12px}.DocSearch-Dropdown::-webkit-scrollbar-track{background:transparent}.DocSearch-Dropdown::-webkit-scrollbar-thumb{background-color:var(--docsearch-muted-color);border:3px solid var(--docsearch-modal-background);border-radius:20px}.DocSearch-Dropdown ul{list-style:none;margin:0;padding:0}.DocSearch-Label{font-size:.75em;line-height:1.6em}.DocSearch-Help,.DocSearch-Label{color:var(--docsearch-muted-color)}.DocSearch-Help{font-size:.9em;margin:0;-webkit-user-select:none;user-select:none}.DocSearch-Title{font-size:1.2em}.DocSearch-Logo a{display:flex}.DocSearch-Logo svg{color:var(--docsearch-logo-color);margin-left:8px}.DocSearch-Hits:last-of-type{margin-bottom:24px}.DocSearch-Hits mark{background:none;color:var(--docsearch-highlight-color)}.DocSearch-HitsFooter{color:var(--docsearch-muted-color);display:flex;font-size:.85em;justify-content:center;margin-bottom:var(--docsearch-spacing);padding:var(--docsearch-spacing)}.DocSearch-HitsFooter a{border-bottom:1px solid;color:inherit}.DocSearch-Hit{border-radius:4px;display:flex;padding-bottom:4px;position:relative}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit--deleting{transition:none}}.DocSearch-Hit--deleting{opacity:0;transition:all .25s linear}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit--favoriting{transition:none}}.DocSearch-Hit--favoriting{transform:scale(0);transform-origin:top center;transition:all .25s linear;transition-delay:.25s}.DocSearch-Hit a{background:var(--docsearch-hit-background);border-radius:4px;box-shadow:var(--docsearch-hit-shadow);display:block;padding-left:var(--docsearch-spacing);width:100%}.DocSearch-Hit-source{background:var(--docsearch-modal-background);color:var(--docsearch-highlight-color);font-size:.85em;font-weight:600;line-height:32px;margin:0 -4px;padding:8px 4px 0;position:sticky;top:0;z-index:10}.DocSearch-Hit-Tree{color:var(--docsearch-muted-color);height:var(--docsearch-hit-height);opacity:.5;stroke-width:var(--docsearch-icon-stroke-width);width:24px}.DocSearch-Hit[aria-selected=true] a{background-color:var(--docsearch-highlight-color)}.DocSearch-Hit[aria-selected=true] mark{text-decoration:underline}.DocSearch-Hit-Container{align-items:center;color:var(--docsearch-hit-color);display:flex;flex-direction:row;height:var(--docsearch-hit-height);padding:0 var(--docsearch-spacing) 0 0}.DocSearch-Hit-icon{height:20px;width:20px}.DocSearch-Hit-action,.DocSearch-Hit-icon{color:var(--docsearch-muted-color);stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Hit-action{align-items:center;display:flex;height:22px;width:22px}.DocSearch-Hit-action svg{display:block;height:18px;width:18px}.DocSearch-Hit-action+.DocSearch-Hit-action{margin-left:6px}.DocSearch-Hit-action-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:50%;color:inherit;cursor:pointer;padding:2px}svg.DocSearch-Hit-Select-Icon{display:none}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Select-Icon{display:block}.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:background-color .1s ease-in}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{transition:none}}.DocSearch-Hit-action-button:focus path,.DocSearch-Hit-action-button:hover path{fill:#fff}.DocSearch-Hit-content-wrapper{display:flex;flex:1 1 auto;flex-direction:column;font-weight:500;justify-content:center;line-height:1.2em;margin:0 8px;overflow-x:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;width:80%}.DocSearch-Hit-title{font-size:.9em}.DocSearch-Hit-path{color:var(--docsearch-muted-color);font-size:.75em}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-action,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-icon,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-path,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-text,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-title,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Tree,.DocSearch-Hit[aria-selected=true] mark{color:var(--docsearch-hit-active-color)!important}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:none}}.DocSearch-ErrorScreen,.DocSearch-NoResults,.DocSearch-StartScreen{font-size:.9em;margin:0 auto;padding:36px 0;text-align:center;width:80%}.DocSearch-Screen-Icon{color:var(--docsearch-muted-color);padding-bottom:12px}.DocSearch-NoResults-Prefill-List{display:inline-block;padding-bottom:24px;text-align:left}.DocSearch-NoResults-Prefill-List ul{display:inline-block;padding:8px 0 0}.DocSearch-NoResults-Prefill-List li{list-style-position:inside;list-style-type:"» "}.DocSearch-Prefill{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:1em;color:var(--docsearch-highlight-color);cursor:pointer;display:inline-block;font-size:1em;font-weight:700;padding:0}.DocSearch-Prefill:focus,.DocSearch-Prefill:hover{outline:none;text-decoration:underline}.DocSearch-Footer{align-items:center;background:var(--docsearch-footer-background);border-radius:0 0 8px 8px;box-shadow:var(--docsearch-footer-shadow);display:flex;flex-direction:row-reverse;flex-shrink:0;height:var(--docsearch-footer-height);justify-content:space-between;padding:0 var(--docsearch-spacing);position:relative;-webkit-user-select:none;user-select:none;width:100%;z-index:300}.DocSearch-Commands{color:var(--docsearch-muted-color);display:flex;list-style:none;margin:0;padding:0}.DocSearch-Commands li{align-items:center;display:flex}.DocSearch-Commands li:not(:last-of-type){margin-right:.8em}.DocSearch-Commands-Key{align-items:center;background:var(--docsearch-key-gradient);border-radius:2px;box-shadow:var(--docsearch-key-shadow);display:flex;height:18px;justify-content:center;margin-right:.4em;padding:0 0 1px;color:var(--docsearch-muted-color);border:0;width:20px}@media (max-width:768px){:root{--docsearch-spacing:10px;--docsearch-footer-height:40px}.DocSearch-Dropdown{height:100%}.DocSearch-Container{height:100vh;height:-webkit-fill-available;height:calc(var(--docsearch-vh, 1vh)*100);position:absolute}.DocSearch-Footer{border-radius:0;bottom:0;position:absolute}.DocSearch-Hit-content-wrapper{display:flex;position:relative;width:80%}.DocSearch-Modal{border-radius:0;box-shadow:none;height:100vh;height:-webkit-fill-available;height:calc(var(--docsearch-vh, 1vh)*100);margin:0;max-width:100%;width:100%}.DocSearch-Dropdown{max-height:calc(var(--docsearch-vh, 1vh)*100 - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height))}.DocSearch-Cancel{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;color:var(--docsearch-highlight-color);cursor:pointer;display:inline-block;flex:none;font:inherit;font-size:1em;font-weight:500;margin-left:var(--docsearch-spacing);outline:none;overflow:hidden;padding:0;-webkit-user-select:none;user-select:none;white-space:nowrap}.DocSearch-Commands,.DocSearch-Hit-Tree{display:none}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}[class*=DocSearch]{--docsearch-primary-color: var(--vp-c-brand-1);--docsearch-highlight-color: var(--docsearch-primary-color);--docsearch-text-color: var(--vp-c-text-1);--docsearch-muted-color: var(--vp-c-text-2);--docsearch-searchbox-shadow: none;--docsearch-searchbox-background: transparent;--docsearch-searchbox-focus-background: transparent;--docsearch-key-gradient: transparent;--docsearch-key-shadow: none;--docsearch-modal-background: var(--vp-c-bg-soft);--docsearch-footer-background: var(--vp-c-bg)}.dark [class*=DocSearch]{--docsearch-modal-shadow: none;--docsearch-footer-shadow: none;--docsearch-logo-color: var(--vp-c-text-2);--docsearch-hit-background: var(--vp-c-default-soft);--docsearch-hit-color: var(--vp-c-text-2);--docsearch-hit-shadow: none}.DocSearch-Button{display:flex;justify-content:center;align-items:center;margin:0;padding:0;width:48px;height:55px;background:transparent;transition:border-color .25s}.DocSearch-Button:hover{background:transparent}.DocSearch-Button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}.DocSearch-Button:focus:not(:focus-visible){outline:none!important}@media (min-width: 768px){.DocSearch-Button{justify-content:flex-start;border:1px solid transparent;border-radius:8px;padding:0 10px 0 12px;width:100%;height:40px;background-color:var(--vp-c-bg-alt)}.DocSearch-Button:hover{border-color:var(--vp-c-brand-1);background:var(--vp-c-bg-alt)}}.DocSearch-Button .DocSearch-Button-Container{display:flex;align-items:center}.DocSearch-Button .DocSearch-Search-Icon{position:relative;width:16px;height:16px;color:var(--vp-c-text-1);fill:currentColor;transition:color .5s}.DocSearch-Button:hover .DocSearch-Search-Icon{color:var(--vp-c-text-1)}@media (min-width: 768px){.DocSearch-Button .DocSearch-Search-Icon{top:1px;margin-right:8px;width:14px;height:14px;color:var(--vp-c-text-2)}}.DocSearch-Button .DocSearch-Button-Placeholder{display:none;margin-top:2px;padding:0 16px 0 0;font-size:13px;font-weight:500;color:var(--vp-c-text-2);transition:color .5s}.DocSearch-Button:hover .DocSearch-Button-Placeholder{color:var(--vp-c-text-1)}@media (min-width: 768px){.DocSearch-Button .DocSearch-Button-Placeholder{display:inline-block}}.DocSearch-Button .DocSearch-Button-Keys{direction:ltr;display:none;min-width:auto}@media (min-width: 768px){.DocSearch-Button .DocSearch-Button-Keys{display:flex;align-items:center}}.DocSearch-Button .DocSearch-Button-Key{display:block;margin:2px 0 0;border:1px solid var(--vp-c-divider);border-right:none;border-radius:4px 0 0 4px;padding-left:6px;min-width:0;width:auto;height:22px;line-height:22px;font-family:var(--vp-font-family-base);font-size:12px;font-weight:500;transition:color .5s,border-color .5s}.DocSearch-Button .DocSearch-Button-Key+.DocSearch-Button-Key{border-right:1px solid var(--vp-c-divider);border-left:none;border-radius:0 4px 4px 0;padding-left:2px;padding-right:6px}.DocSearch-Button .DocSearch-Button-Key:first-child{font-size:0!important}.DocSearch-Button .DocSearch-Button-Key:first-child:after{content:"Ctrl";font-size:12px;letter-spacing:normal;color:var(--docsearch-muted-color)}.mac .DocSearch-Button .DocSearch-Button-Key:first-child:after{content:"⌘"}.DocSearch-Button .DocSearch-Button-Key:first-child>*{display:none}.VPNavBarSearch{display:flex;align-items:center}@media (min-width: 768px){.VPNavBarSearch{flex-grow:1;padding-left:24px}}@media (min-width: 960px){.VPNavBarSearch{padding-left:32px}}.dark .DocSearch-Footer{border-top:1px solid var(--vp-c-divider)}.DocSearch-Form{border:1px solid var(--vp-c-brand-1);background-color:var(--vp-c-white)}.dark .DocSearch-Form{background-color:var(--vp-c-default-soft)}.DocSearch-Screen-Icon>svg{margin:auto}.VPNavBarSocialLinks[data-v-0394ad82]{display:none}@media (min-width: 1280px){.VPNavBarSocialLinks[data-v-0394ad82]{display:flex;align-items:center}}.title[data-v-86d1bed8]{display:flex;align-items:center;border-bottom:1px solid transparent;width:100%;height:var(--vp-nav-height);font-size:16px;font-weight:600;color:var(--vp-c-text-1);transition:opacity .25s}@media (min-width: 960px){.title[data-v-86d1bed8]{flex-shrink:0}.VPNavBarTitle.has-sidebar .title[data-v-86d1bed8]{border-bottom-color:var(--vp-c-divider)}}[data-v-86d1bed8] .logo{margin-right:8px;height:var(--vp-nav-logo-height)}.VPNavBarTranslations[data-v-74abcbb9]{display:none}@media (min-width: 1280px){.VPNavBarTranslations[data-v-74abcbb9]{display:flex;align-items:center}}.title[data-v-74abcbb9]{padding:0 24px 0 12px;line-height:32px;font-size:14px;font-weight:700;color:var(--vp-c-text-1)}.VPNavBar[data-v-a0fd61f4]{position:relative;border-bottom:1px solid transparent;padding:0 8px 0 24px;height:var(--vp-nav-height);pointer-events:none;white-space:nowrap}@media (min-width: 768px){.VPNavBar[data-v-a0fd61f4]{padding:0 32px}}@media (min-width: 960px){.VPNavBar.has-sidebar[data-v-a0fd61f4]{padding:0}.VPNavBar[data-v-a0fd61f4]:not(.has-sidebar):not(.top){border-bottom-color:var(--vp-c-gutter);background-color:var(--vp-nav-bg-color)}}.container[data-v-a0fd61f4]{display:flex;justify-content:space-between;margin:0 auto;max-width:calc(var(--vp-layout-max-width) - 64px);height:var(--vp-nav-height);pointer-events:none}.container>.title[data-v-a0fd61f4],.container>.content[data-v-a0fd61f4]{pointer-events:none}.container[data-v-a0fd61f4] *{pointer-events:auto}@media (min-width: 960px){.VPNavBar.has-sidebar .container[data-v-a0fd61f4]{max-width:100%}}.title[data-v-a0fd61f4]{flex-shrink:0;height:calc(var(--vp-nav-height) - 1px);transition:background-color .5s}@media (min-width: 960px){.VPNavBar.has-sidebar .title[data-v-a0fd61f4]{position:absolute;top:0;left:0;z-index:2;padding:0 32px;width:var(--vp-sidebar-width);height:var(--vp-nav-height);background-color:transparent}}@media (min-width: 1440px){.VPNavBar.has-sidebar .title[data-v-a0fd61f4]{padding-left:max(32px,calc((100% - (var(--vp-layout-max-width) - 64px)) / 2));width:calc((100% - (var(--vp-layout-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px)}}.content[data-v-a0fd61f4]{flex-grow:1}@media (min-width: 960px){.VPNavBar.has-sidebar .content[data-v-a0fd61f4]{position:relative;z-index:1;padding-right:32px;padding-left:var(--vp-sidebar-width)}}@media (min-width: 1440px){.VPNavBar.has-sidebar .content[data-v-a0fd61f4]{padding-right:calc((100vw - var(--vp-layout-max-width)) / 2 + 32px);padding-left:calc((100vw - var(--vp-layout-max-width)) / 2 + var(--vp-sidebar-width))}}.content-body[data-v-a0fd61f4]{display:flex;justify-content:flex-end;align-items:center;height:calc(var(--vp-nav-height) - 1px);transition:background-color .5s}@media (min-width: 960px){.VPNavBar:not(.top) .content-body[data-v-a0fd61f4]{position:relative;background-color:var(--vp-nav-bg-color)}}@media (max-width: 767px){.content-body[data-v-a0fd61f4]{column-gap:.5rem}}.menu+.translations[data-v-a0fd61f4]:before,.menu+.appearance[data-v-a0fd61f4]:before,.menu+.social-links[data-v-a0fd61f4]:before,.translations+.appearance[data-v-a0fd61f4]:before,.appearance+.social-links[data-v-a0fd61f4]:before{margin-right:8px;margin-left:8px;width:1px;height:24px;background-color:var(--vp-c-divider);content:""}.menu+.appearance[data-v-a0fd61f4]:before,.translations+.appearance[data-v-a0fd61f4]:before{margin-right:16px}.appearance+.social-links[data-v-a0fd61f4]:before{margin-left:16px}.social-links[data-v-a0fd61f4]{margin-right:-8px}@media (min-width: 960px){.VPNavBar.has-sidebar .curtain[data-v-a0fd61f4]{position:absolute;right:0;bottom:-31px;width:calc(100% - var(--vp-sidebar-width));height:32px}.VPNavBar.has-sidebar .curtain[data-v-a0fd61f4]:before{display:block;width:100%;height:32px;background:linear-gradient(var(--vp-c-bg),transparent 70%);content:""}}@media (min-width: 1440px){.VPNavBar.has-sidebar .curtain[data-v-a0fd61f4]{width:calc(100% - ((100vw - var(--vp-layout-max-width)) / 2 + var(--vp-sidebar-width)))}}.VPNavScreenAppearance[data-v-add8f686]{display:flex;justify-content:space-between;align-items:center;border-radius:8px;padding:12px 14px 12px 16px;background-color:var(--vp-c-bg-soft)}.text[data-v-add8f686]{line-height:24px;font-size:12px;font-weight:500;color:var(--vp-c-text-2)}.VPNavScreenMenuLink[data-v-05f27b2a]{display:block;border-bottom:1px solid var(--vp-c-divider);padding:12px 0 11px;line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-1);transition:border-color .25s,color .25s}.VPNavScreenMenuLink[data-v-05f27b2a]:hover{color:var(--vp-c-brand-1)}.VPNavScreenMenuGroupLink[data-v-19976ae1]{display:block;margin-left:12px;line-height:32px;font-size:14px;font-weight:400;color:var(--vp-c-text-1);transition:color .25s}.VPNavScreenMenuGroupLink[data-v-19976ae1]:hover{color:var(--vp-c-brand-1)}.VPNavScreenMenuGroupSection[data-v-8133b170]{display:block}.title[data-v-8133b170]{line-height:32px;font-size:13px;font-weight:700;color:var(--vp-c-text-2);transition:color .25s}.VPNavScreenMenuGroup[data-v-1ecb84e7]{border-bottom:1px solid var(--vp-c-divider);height:48px;overflow:hidden;transition:border-color .5s}.VPNavScreenMenuGroup .items[data-v-1ecb84e7]{visibility:hidden}.VPNavScreenMenuGroup.open .items[data-v-1ecb84e7]{visibility:visible}.VPNavScreenMenuGroup.open[data-v-1ecb84e7]{padding-bottom:10px;height:auto}.VPNavScreenMenuGroup.open .button[data-v-1ecb84e7]{padding-bottom:6px;color:var(--vp-c-brand-1)}.VPNavScreenMenuGroup.open .button-icon[data-v-1ecb84e7]{transform:rotate(45deg)}.button[data-v-1ecb84e7]{display:flex;justify-content:space-between;align-items:center;padding:12px 4px 11px 0;width:100%;line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-1);transition:color .25s}.button[data-v-1ecb84e7]:hover{color:var(--vp-c-brand-1)}.button-icon[data-v-1ecb84e7]{width:14px;height:14px;fill:var(--vp-c-text-2);transition:fill .5s,transform .25s}.group[data-v-1ecb84e7]:first-child{padding-top:0}.group+.group[data-v-1ecb84e7],.group+.item[data-v-1ecb84e7]{padding-top:4px}.VPNavScreenTranslations[data-v-d72aa483]{height:24px;overflow:hidden}.VPNavScreenTranslations.open[data-v-d72aa483]{height:auto}.title[data-v-d72aa483]{display:flex;align-items:center;font-size:14px;font-weight:500;color:var(--vp-c-text-1)}.icon[data-v-d72aa483]{width:16px;height:16px;fill:currentColor}.icon.lang[data-v-d72aa483]{margin-right:8px}.icon.chevron[data-v-d72aa483]{margin-left:4px}.list[data-v-d72aa483]{padding:4px 0 0 24px}.link[data-v-d72aa483]{line-height:32px;font-size:13px;color:var(--vp-c-text-1)}.VPNavScreen[data-v-cc5739dd]{position:fixed;top:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 1px);right:0;bottom:0;left:0;padding:0 32px;width:100%;background-color:var(--vp-nav-screen-bg-color);overflow-y:auto;transition:background-color .5s;pointer-events:auto}.VPNavScreen.fade-enter-active[data-v-cc5739dd],.VPNavScreen.fade-leave-active[data-v-cc5739dd]{transition:opacity .25s}.VPNavScreen.fade-enter-active .container[data-v-cc5739dd],.VPNavScreen.fade-leave-active .container[data-v-cc5739dd]{transition:transform .25s ease}.VPNavScreen.fade-enter-from[data-v-cc5739dd],.VPNavScreen.fade-leave-to[data-v-cc5739dd]{opacity:0}.VPNavScreen.fade-enter-from .container[data-v-cc5739dd],.VPNavScreen.fade-leave-to .container[data-v-cc5739dd]{transform:translateY(-8px)}@media (min-width: 768px){.VPNavScreen[data-v-cc5739dd]{display:none}}.container[data-v-cc5739dd]{margin:0 auto;padding:24px 0 96px;max-width:288px}.menu+.translations[data-v-cc5739dd],.menu+.appearance[data-v-cc5739dd],.translations+.appearance[data-v-cc5739dd]{margin-top:24px}.menu+.social-links[data-v-cc5739dd]{margin-top:16px}.appearance+.social-links[data-v-cc5739dd]{margin-top:16px}.VPNav[data-v-ae24b3ad]{position:relative;top:var(--vp-layout-top-height, 0px);left:0;z-index:var(--vp-z-index-nav);width:100%;pointer-events:none;transition:background-color .5s}@media (min-width: 960px){.VPNav[data-v-ae24b3ad]{position:fixed}}.VPSidebarItem.level-0[data-v-e31bd47b]{padding-bottom:24px}.VPSidebarItem.collapsed.level-0[data-v-e31bd47b]{padding-bottom:10px}.item[data-v-e31bd47b]{position:relative;display:flex;width:100%}.VPSidebarItem.collapsible>.item[data-v-e31bd47b]{cursor:pointer}.indicator[data-v-e31bd47b]{position:absolute;top:6px;bottom:6px;left:-17px;width:2px;border-radius:2px;transition:background-color .25s}.VPSidebarItem.level-2.is-active>.item>.indicator[data-v-e31bd47b],.VPSidebarItem.level-3.is-active>.item>.indicator[data-v-e31bd47b],.VPSidebarItem.level-4.is-active>.item>.indicator[data-v-e31bd47b],.VPSidebarItem.level-5.is-active>.item>.indicator[data-v-e31bd47b]{background-color:var(--vp-c-brand-1)}.link[data-v-e31bd47b]{display:flex;align-items:center;flex-grow:1}.text[data-v-e31bd47b]{flex-grow:1;padding:4px 0;line-height:24px;font-size:14px;transition:color .25s}.VPSidebarItem.level-0 .text[data-v-e31bd47b]{font-weight:700;color:var(--vp-c-text-1)}.VPSidebarItem.level-1 .text[data-v-e31bd47b],.VPSidebarItem.level-2 .text[data-v-e31bd47b],.VPSidebarItem.level-3 .text[data-v-e31bd47b],.VPSidebarItem.level-4 .text[data-v-e31bd47b],.VPSidebarItem.level-5 .text[data-v-e31bd47b]{font-weight:500;color:var(--vp-c-text-2)}.VPSidebarItem.level-0.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-1.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-2.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-3.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-4.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-5.is-link>.item>.link:hover .text[data-v-e31bd47b]{color:var(--vp-c-brand-1)}.VPSidebarItem.level-0.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-1.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-2.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-3.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-4.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-5.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-0.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-1.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-2.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-3.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-4.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-5.has-active>.item>.link>.text[data-v-e31bd47b]{color:var(--vp-c-text-1)}.VPSidebarItem.level-0.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-1.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-2.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-3.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-4.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-5.is-active>.item .link>.text[data-v-e31bd47b]{color:var(--vp-c-brand-1)}.caret[data-v-e31bd47b]{display:flex;justify-content:center;align-items:center;margin-right:-7px;width:32px;height:32px;color:var(--vp-c-text-3);cursor:pointer;transition:color .25s;flex-shrink:0}.item:hover .caret[data-v-e31bd47b]{color:var(--vp-c-text-2)}.item:hover .caret[data-v-e31bd47b]:hover{color:var(--vp-c-text-1)}.caret-icon[data-v-e31bd47b]{width:18px;height:18px;fill:currentColor;transform:rotate(90deg);transition:transform .25s}.VPSidebarItem.collapsed .caret-icon[data-v-e31bd47b]{transform:rotate(0)}.VPSidebarItem.level-1 .items[data-v-e31bd47b],.VPSidebarItem.level-2 .items[data-v-e31bd47b],.VPSidebarItem.level-3 .items[data-v-e31bd47b],.VPSidebarItem.level-4 .items[data-v-e31bd47b],.VPSidebarItem.level-5 .items[data-v-e31bd47b]{border-left:1px solid var(--vp-c-divider);padding-left:16px}.VPSidebarItem.collapsed .items[data-v-e31bd47b]{display:none}.VPSidebar[data-v-b00e2fdd]{position:fixed;top:var(--vp-layout-top-height, 0px);bottom:0;left:0;z-index:var(--vp-z-index-sidebar);padding:32px 32px 96px;width:calc(100vw - 64px);max-width:320px;background-color:var(--vp-sidebar-bg-color);opacity:0;box-shadow:var(--vp-c-shadow-3);overflow-x:hidden;overflow-y:auto;transform:translate(-100%);transition:opacity .5s,transform .25s ease;overscroll-behavior:contain}.VPSidebar.open[data-v-b00e2fdd]{opacity:1;visibility:visible;transform:translate(0);transition:opacity .25s,transform .5s cubic-bezier(.19,1,.22,1)}.dark .VPSidebar[data-v-b00e2fdd]{box-shadow:var(--vp-shadow-1)}@media (min-width: 960px){.VPSidebar[data-v-b00e2fdd]{z-index:1;padding-top:var(--vp-nav-height);padding-bottom:128px;width:var(--vp-sidebar-width);max-width:100%;background-color:var(--vp-sidebar-bg-color);opacity:1;visibility:visible;box-shadow:none;transform:translate(0)}}@media (min-width: 1440px){.VPSidebar[data-v-b00e2fdd]{padding-left:max(32px,calc((100% - (var(--vp-layout-max-width) - 64px)) / 2));width:calc((100% - (var(--vp-layout-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px)}}@media (min-width: 960px){.curtain[data-v-b00e2fdd]{position:sticky;top:-64px;left:0;z-index:1;margin-top:calc(var(--vp-nav-height) * -1);margin-right:-32px;margin-left:-32px;height:var(--vp-nav-height);background-color:var(--vp-sidebar-bg-color)}}.nav[data-v-b00e2fdd]{outline:0}.group+.group[data-v-b00e2fdd]{border-top:1px solid var(--vp-c-divider);padding-top:10px}@media (min-width: 960px){.group[data-v-b00e2fdd]{padding-top:10px;width:calc(var(--vp-sidebar-width) - 64px)}}.VPSkipLink[data-v-0f60ec36]{top:8px;left:8px;padding:8px 16px;z-index:999;border-radius:8px;font-size:12px;font-weight:700;text-decoration:none;color:var(--vp-c-brand-1);box-shadow:var(--vp-shadow-3);background-color:var(--vp-c-bg)}.VPSkipLink[data-v-0f60ec36]:focus{height:auto;width:auto;clip:auto;clip-path:none}@media (min-width: 1280px){.VPSkipLink[data-v-0f60ec36]{top:14px;left:16px}}.Layout[data-v-5a346dfe]{display:flex;flex-direction:column;min-height:100vh}.VPHomeSponsors[data-v-96bd69d5]{border-top:1px solid var(--vp-c-gutter);padding:88px 24px 96px;background-color:var(--vp-c-bg)}.container[data-v-96bd69d5]{margin:0 auto;max-width:1152px}.love[data-v-96bd69d5]{margin:0 auto;width:28px;height:28px;color:var(--vp-c-text-3)}.icon[data-v-96bd69d5]{width:28px;height:28px;fill:currentColor}.message[data-v-96bd69d5]{margin:0 auto;padding-top:10px;max-width:320px;text-align:center;line-height:24px;font-size:16px;font-weight:500;color:var(--vp-c-text-2)}.sponsors[data-v-96bd69d5]{padding-top:32px}.action[data-v-96bd69d5]{padding-top:40px;text-align:center}.VPTeamPage[data-v-10b00018]{padding-bottom:96px}@media (min-width: 768px){.VPTeamPage[data-v-10b00018]{padding-bottom:128px}}.VPTeamPageSection+.VPTeamPageSection[data-v-10b00018-s],.VPTeamMembers+.VPTeamPageSection[data-v-10b00018-s]{margin-top:64px}.VPTeamMembers+.VPTeamMembers[data-v-10b00018-s]{margin-top:24px}@media (min-width: 768px){.VPTeamPageTitle+.VPTeamPageSection[data-v-10b00018-s]{margin-top:16px}.VPTeamPageSection+.VPTeamPageSection[data-v-10b00018-s],.VPTeamMembers+.VPTeamPageSection[data-v-10b00018-s]{margin-top:96px}}.VPTeamMembers[data-v-10b00018-s]{padding:0 24px}@media (min-width: 768px){.VPTeamMembers[data-v-10b00018-s]{padding:0 48px}}@media (min-width: 960px){.VPTeamMembers[data-v-10b00018-s]{padding:0 64px}}.VPTeamPageTitle[data-v-bf2cbdac]{padding:48px 32px;text-align:center}@media (min-width: 768px){.VPTeamPageTitle[data-v-bf2cbdac]{padding:64px 48px 48px}}@media (min-width: 960px){.VPTeamPageTitle[data-v-bf2cbdac]{padding:80px 64px 48px}}.title[data-v-bf2cbdac]{letter-spacing:0;line-height:44px;font-size:36px;font-weight:500}@media (min-width: 768px){.title[data-v-bf2cbdac]{letter-spacing:-.5px;line-height:56px;font-size:48px}}.lead[data-v-bf2cbdac]{margin:0 auto;max-width:512px;padding-top:12px;line-height:24px;font-size:16px;font-weight:500;color:var(--vp-c-text-2)}@media (min-width: 768px){.lead[data-v-bf2cbdac]{max-width:592px;letter-spacing:.15px;line-height:28px;font-size:20px}}.VPTeamPageSection[data-v-b1a88750]{padding:0 32px}@media (min-width: 768px){.VPTeamPageSection[data-v-b1a88750]{padding:0 48px}}@media (min-width: 960px){.VPTeamPageSection[data-v-b1a88750]{padding:0 64px}}.title[data-v-b1a88750]{position:relative;margin:0 auto;max-width:1152px;text-align:center;color:var(--vp-c-text-2)}.title-line[data-v-b1a88750]{position:absolute;top:16px;left:0;width:100%;height:1px;background-color:var(--vp-c-divider)}.title-text[data-v-b1a88750]{position:relative;display:inline-block;padding:0 24px;letter-spacing:0;line-height:32px;font-size:20px;font-weight:500;background-color:var(--vp-c-bg)}.lead[data-v-b1a88750]{margin:0 auto;max-width:480px;padding-top:12px;text-align:center;line-height:24px;font-size:16px;font-weight:500;color:var(--vp-c-text-2)}.members[data-v-b1a88750]{padding-top:40px}.VPTeamMembersItem[data-v-28528e42]{display:flex;flex-direction:column;gap:2px;border-radius:12px;width:100%;height:100%;overflow:hidden}.VPTeamMembersItem.small .profile[data-v-28528e42]{padding:32px}.VPTeamMembersItem.small .data[data-v-28528e42]{padding-top:20px}.VPTeamMembersItem.small .avatar[data-v-28528e42]{width:64px;height:64px}.VPTeamMembersItem.small .name[data-v-28528e42]{line-height:24px;font-size:16px}.VPTeamMembersItem.small .affiliation[data-v-28528e42]{padding-top:4px;line-height:20px;font-size:14px}.VPTeamMembersItem.small .desc[data-v-28528e42]{padding-top:12px;line-height:20px;font-size:14px}.VPTeamMembersItem.small .links[data-v-28528e42]{margin:0 -16px -20px;padding:10px 0 0}.VPTeamMembersItem.medium .profile[data-v-28528e42]{padding:48px 32px}.VPTeamMembersItem.medium .data[data-v-28528e42]{padding-top:24px;text-align:center}.VPTeamMembersItem.medium .avatar[data-v-28528e42]{width:96px;height:96px}.VPTeamMembersItem.medium .name[data-v-28528e42]{letter-spacing:.15px;line-height:28px;font-size:20px}.VPTeamMembersItem.medium .affiliation[data-v-28528e42]{padding-top:4px;font-size:16px}.VPTeamMembersItem.medium .desc[data-v-28528e42]{padding-top:16px;max-width:288px;font-size:16px}.VPTeamMembersItem.medium .links[data-v-28528e42]{margin:0 -16px -12px;padding:16px 12px 0}.profile[data-v-28528e42]{flex-grow:1;background-color:var(--vp-c-bg-soft)}.data[data-v-28528e42]{text-align:center}.avatar[data-v-28528e42]{position:relative;flex-shrink:0;margin:0 auto;border-radius:50%;box-shadow:var(--vp-shadow-3)}.avatar-img[data-v-28528e42]{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;object-fit:cover}.name[data-v-28528e42]{margin:0;font-weight:600}.affiliation[data-v-28528e42]{margin:0;font-weight:500;color:var(--vp-c-text-2)}.org.link[data-v-28528e42]{color:var(--vp-c-text-2);transition:color .25s}.org.link[data-v-28528e42]:hover{color:var(--vp-c-brand-1)}.desc[data-v-28528e42]{margin:0 auto}.desc[data-v-28528e42] a{font-weight:500;color:var(--vp-c-brand-1);text-decoration-style:dotted;transition:color .25s}.links[data-v-28528e42]{display:flex;justify-content:center;height:56px}.sp-link[data-v-28528e42]{display:flex;justify-content:center;align-items:center;text-align:center;padding:16px;font-size:14px;font-weight:500;color:var(--vp-c-sponsor);background-color:var(--vp-c-bg-soft);transition:color .25s,background-color .25s}.sp .sp-link.link[data-v-28528e42]:hover,.sp .sp-link.link[data-v-28528e42]:focus{outline:none;color:var(--vp-c-white);background-color:var(--vp-c-sponsor)}.sp-icon[data-v-28528e42]{margin-right:8px;width:16px;height:16px;fill:currentColor}.VPTeamMembers.small .container[data-v-6cb0dbc4]{grid-template-columns:repeat(auto-fit,minmax(224px,1fr))}.VPTeamMembers.small.count-1 .container[data-v-6cb0dbc4]{max-width:276px}.VPTeamMembers.small.count-2 .container[data-v-6cb0dbc4]{max-width:576px}.VPTeamMembers.small.count-3 .container[data-v-6cb0dbc4]{max-width:876px}.VPTeamMembers.medium .container[data-v-6cb0dbc4]{grid-template-columns:repeat(auto-fit,minmax(256px,1fr))}@media (min-width: 375px){.VPTeamMembers.medium .container[data-v-6cb0dbc4]{grid-template-columns:repeat(auto-fit,minmax(288px,1fr))}}.VPTeamMembers.medium.count-1 .container[data-v-6cb0dbc4]{max-width:368px}.VPTeamMembers.medium.count-2 .container[data-v-6cb0dbc4]{max-width:760px}.container[data-v-6cb0dbc4]{display:grid;gap:24px;margin:0 auto;max-width:1152px}.warn{background-color:red;color:#fff}.tc-ul{list-style:none}.tc-ul .tc-item{display:inline-block;width:100px;border:1px solid orange}.tc-ul-margin{list-style:none}.tc-ul-margin .tc-item-margin{display:inline-block;width:100px;border:1px solid orange;margin-right:-4px}.VPLocalSearchBox[data-v-6d2f2a19]{position:fixed;z-index:100;top:0;right:0;bottom:0;left:0;display:flex}.backdrop[data-v-6d2f2a19]{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--vp-backdrop-bg-color);transition:opacity .5s}.shell[data-v-6d2f2a19]{position:relative;padding:12px;margin:64px auto;display:flex;flex-direction:column;gap:16px;background:var(--vp-local-search-bg);width:min(100vw - 60px,900px);height:min-content;max-height:min(100vh - 128px,900px);border-radius:6px}@media (max-width: 767px){.shell[data-v-6d2f2a19]{margin:0;width:100vw;height:100vh;max-height:none;border-radius:0}}.search-bar[data-v-6d2f2a19]{border:1px solid var(--vp-c-divider);border-radius:4px;display:flex;align-items:center;padding:0 12px;cursor:text}@media (max-width: 767px){.search-bar[data-v-6d2f2a19]{padding:0 8px}}.search-bar[data-v-6d2f2a19]:focus-within{border-color:var(--vp-c-brand-1)}.search-icon[data-v-6d2f2a19]{margin:8px}@media (max-width: 767px){.search-icon[data-v-6d2f2a19]{display:none}}.search-input[data-v-6d2f2a19]{padding:6px 12px;font-size:inherit;width:100%}@media (max-width: 767px){.search-input[data-v-6d2f2a19]{padding:6px 4px}}.search-actions[data-v-6d2f2a19]{display:flex;gap:4px}@media (any-pointer: coarse){.search-actions[data-v-6d2f2a19]{gap:8px}}@media (min-width: 769px){.search-actions.before[data-v-6d2f2a19]{display:none}}.search-actions button[data-v-6d2f2a19]{padding:8px}.search-actions button[data-v-6d2f2a19]:not([disabled]):hover,.toggle-layout-button.detailed-list[data-v-6d2f2a19]{color:var(--vp-c-brand-1)}.search-actions button.clear-button[data-v-6d2f2a19]:disabled{opacity:.37}.search-keyboard-shortcuts[data-v-6d2f2a19]{font-size:.8rem;opacity:75%;display:flex;flex-wrap:wrap;gap:16px;line-height:14px}.search-keyboard-shortcuts span[data-v-6d2f2a19]{display:flex;align-items:center;gap:4px}@media (max-width: 767px){.search-keyboard-shortcuts[data-v-6d2f2a19]{display:none}}.search-keyboard-shortcuts kbd[data-v-6d2f2a19]{background:rgba(128,128,128,.1);border-radius:4px;padding:3px 6px;min-width:24px;display:inline-block;text-align:center;vertical-align:middle;border:1px solid rgba(128,128,128,.15);box-shadow:0 2px 2px #0000001a}.results[data-v-6d2f2a19]{display:flex;flex-direction:column;gap:6px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}.result[data-v-6d2f2a19]{display:flex;align-items:center;gap:8px;border-radius:4px;transition:none;line-height:1rem;border:solid 2px var(--vp-local-search-result-border);outline:none}.result>div[data-v-6d2f2a19]{margin:12px;width:100%;overflow:hidden}@media (max-width: 767px){.result>div[data-v-6d2f2a19]{margin:8px}}.titles[data-v-6d2f2a19]{display:flex;flex-wrap:wrap;gap:4px;position:relative;z-index:1001;padding:2px 0}.title[data-v-6d2f2a19]{display:flex;align-items:center;gap:4px}.title.main[data-v-6d2f2a19]{font-weight:500}.title-icon[data-v-6d2f2a19]{opacity:.5;font-weight:500;color:var(--vp-c-brand-1)}.title svg[data-v-6d2f2a19]{opacity:.5}.result.selected[data-v-6d2f2a19]{--vp-local-search-result-bg: var(--vp-local-search-result-selected-bg);border-color:var(--vp-local-search-result-selected-border)}.excerpt-wrapper[data-v-6d2f2a19]{position:relative}.excerpt[data-v-6d2f2a19]{opacity:75%;pointer-events:none;max-height:140px;overflow:hidden;position:relative;opacity:.5;margin-top:4px}.result.selected .excerpt[data-v-6d2f2a19]{opacity:1}.excerpt[data-v-6d2f2a19] *{font-size:.8rem!important;line-height:130%!important}.titles[data-v-6d2f2a19] mark,.excerpt[data-v-6d2f2a19] mark{background-color:var(--vp-local-search-highlight-bg);color:var(--vp-local-search-highlight-text);border-radius:2px;padding:0 2px}.excerpt[data-v-6d2f2a19] .vp-code-group .tabs{display:none}.excerpt[data-v-6d2f2a19] .vp-code-group div[class*=language-]{border-radius:8px!important}.excerpt-gradient-bottom[data-v-6d2f2a19]{position:absolute;bottom:-1px;left:0;width:100%;height:8px;background:linear-gradient(transparent,var(--vp-local-search-result-bg));z-index:1000}.excerpt-gradient-top[data-v-6d2f2a19]{position:absolute;top:-1px;left:0;width:100%;height:8px;background:linear-gradient(var(--vp-local-search-result-bg),transparent);z-index:1000}.result.selected .titles[data-v-6d2f2a19],.result.selected .title-icon[data-v-6d2f2a19]{color:var(--vp-c-brand-1)!important}.no-results[data-v-6d2f2a19]{font-size:.9rem;text-align:center;padding:12px}svg[data-v-6d2f2a19]{flex:none}
diff --git a/assets/style.9a9f46c7.css b/assets/style.9a9f46c7.css
new file mode 100644
index 0000000..2964172
--- /dev/null
+++ b/assets/style.9a9f46c7.css
@@ -0,0 +1 @@
+@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/assets/inter-roman-cyrillic.5f2c6c8c.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/assets/inter-roman-cyrillic-ext.e75737ce.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/assets/inter-roman-greek.d5a6d92a.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/assets/inter-roman-greek-ext.ab0619bc.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/assets/inter-roman-latin.2ed14f66.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/assets/inter-roman-latin-ext.0030eebd.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:normal;font-named-instance:"Regular";src:url(/assets/inter-roman-vietnamese.14ce25a6.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/assets/inter-italic-cyrillic.ea42a392.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/assets/inter-italic-cyrillic-ext.33bd5a8e.woff2) format("woff2");unicode-range:U+0460-052F,U+1C80-1C88,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/assets/inter-italic-greek.8f4463c4.woff2) format("woff2");unicode-range:U+0370-03FF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/assets/inter-italic-greek-ext.4fbe9427.woff2) format("woff2");unicode-range:U+1F00-1FFF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/assets/inter-italic-latin.bd3b6f56.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/assets/inter-italic-latin-ext.bd8920cc.woff2) format("woff2");unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Inter var;font-weight:100 900;font-display:swap;font-style:italic;font-named-instance:"Italic";src:url(/assets/inter-italic-vietnamese.6ce511fb.woff2) format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}@font-face{font-family:Chinese Quotes;src:local("PingFang SC Regular"),local("PingFang SC"),local("SimHei"),local("Source Han Sans SC");unicode-range:U+2018,U+2019,U+201C,U+201D}:root{--vp-c-white: #ffffff;--vp-c-black: #000000;--vp-c-neutral: var(--vp-c-black);--vp-c-neutral-inverse: var(--vp-c-white)}.dark{--vp-c-neutral: var(--vp-c-white);--vp-c-neutral-inverse: var(--vp-c-black)}:root{--vp-c-gray-1: #dddde3;--vp-c-gray-2: #e4e4e9;--vp-c-gray-3: #ebebef;--vp-c-gray-soft: rgba(142, 150, 170, .14);--vp-c-indigo-1: #3451b2;--vp-c-indigo-2: #3a5ccc;--vp-c-indigo-3: #5672cd;--vp-c-indigo-soft: rgba(100, 108, 255, .14);--vp-c-green-1: #18794e;--vp-c-green-2: #299764;--vp-c-green-3: #30a46c;--vp-c-green-soft: rgba(16, 185, 129, .14);--vp-c-yellow-1: #915930;--vp-c-yellow-2: #946300;--vp-c-yellow-3: #9f6a00;--vp-c-yellow-soft: rgba(234, 179, 8, .14);--vp-c-red-1: #b8272c;--vp-c-red-2: #d5393e;--vp-c-red-3: #e0575b;--vp-c-red-soft: rgba(244, 63, 94, .14);--vp-c-sponsor: #db2777}.dark{--vp-c-gray-1: #515c67;--vp-c-gray-2: #414853;--vp-c-gray-3: #32363f;--vp-c-gray-soft: rgba(101, 117, 133, .16);--vp-c-indigo-1: #a8b1ff;--vp-c-indigo-2: #5c73e7;--vp-c-indigo-3: #3e63dd;--vp-c-indigo-soft: rgba(100, 108, 255, .16);--vp-c-green-1: #3dd68c;--vp-c-green-2: #30a46c;--vp-c-green-3: #298459;--vp-c-green-soft: rgba(16, 185, 129, .16);--vp-c-yellow-1: #f9b44e;--vp-c-yellow-2: #da8b17;--vp-c-yellow-3: #a46a0a;--vp-c-yellow-soft: rgba(234, 179, 8, .16);--vp-c-red-1: #f66f81;--vp-c-red-2: #f14158;--vp-c-red-3: #b62a3c;--vp-c-red-soft: rgba(244, 63, 94, .16)}:root{--vp-c-bg: #ffffff;--vp-c-bg-alt: #f6f6f7;--vp-c-bg-elv: #ffffff;--vp-c-bg-soft: #f6f6f7}.dark{--vp-c-bg: #1b1b1f;--vp-c-bg-alt: #161618;--vp-c-bg-elv: #202127;--vp-c-bg-soft: #202127}:root{--vp-c-border: #c2c2c4;--vp-c-divider: #e2e2e3;--vp-c-gutter: #e2e2e3}.dark{--vp-c-border: #3c3f44;--vp-c-divider: #2e2e32;--vp-c-gutter: #000000}:root{--vp-c-text-1: rgba(60, 60, 67);--vp-c-text-2: rgba(60, 60, 67, .78);--vp-c-text-3: rgba(60, 60, 67, .56)}.dark{--vp-c-text-1: rgba(255, 255, 245, .86);--vp-c-text-2: rgba(235, 235, 245, .6);--vp-c-text-3: rgba(235, 235, 245, .38)}:root{--vp-c-default-1: var(--vp-c-gray-1);--vp-c-default-2: var(--vp-c-gray-2);--vp-c-default-3: var(--vp-c-gray-3);--vp-c-default-soft: var(--vp-c-gray-soft);--vp-c-brand-1: var(--vp-c-indigo-1);--vp-c-brand-2: var(--vp-c-indigo-2);--vp-c-brand-3: var(--vp-c-indigo-3);--vp-c-brand-soft: var(--vp-c-indigo-soft);--vp-c-brand: var(--vp-c-brand-1);--vp-c-tip-1: var(--vp-c-brand-1);--vp-c-tip-2: var(--vp-c-brand-2);--vp-c-tip-3: var(--vp-c-brand-3);--vp-c-tip-soft: var(--vp-c-brand-soft);--vp-c-warning-1: var(--vp-c-yellow-1);--vp-c-warning-2: var(--vp-c-yellow-2);--vp-c-warning-3: var(--vp-c-yellow-3);--vp-c-warning-soft: var(--vp-c-yellow-soft);--vp-c-danger-1: var(--vp-c-red-1);--vp-c-danger-2: var(--vp-c-red-2);--vp-c-danger-3: var(--vp-c-red-3);--vp-c-danger-soft: var(--vp-c-red-soft)}:root{--vp-font-family-base: "Chinese Quotes", "Inter var", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--vp-font-family-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}:root{--vp-shadow-1: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 2px rgba(0, 0, 0, .06);--vp-shadow-2: 0 3px 12px rgba(0, 0, 0, .07), 0 1px 4px rgba(0, 0, 0, .07);--vp-shadow-3: 0 12px 32px rgba(0, 0, 0, .1), 0 2px 6px rgba(0, 0, 0, .08);--vp-shadow-4: 0 14px 44px rgba(0, 0, 0, .12), 0 3px 9px rgba(0, 0, 0, .12);--vp-shadow-5: 0 18px 56px rgba(0, 0, 0, .16), 0 4px 12px rgba(0, 0, 0, .16)}:root{--vp-z-index-footer: 10;--vp-z-index-local-nav: 20;--vp-z-index-nav: 30;--vp-z-index-layout-top: 40;--vp-z-index-backdrop: 50;--vp-z-index-sidebar: 60}:root{--vp-icon-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' height='20' width='20' stroke='rgba(128,128,128,1)' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2'/%3E%3C/svg%3E");--vp-icon-copied: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' height='20' width='20' stroke='rgba(128,128,128,1)' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2m-6 9 2 2 4-4'/%3E%3C/svg%3E")}:root{--vp-layout-max-width: 1440px}:root{--vp-header-anchor-symbol: "#"}:root{--vp-code-line-height: 1.7;--vp-code-font-size: .875em;--vp-code-color: var(--vp-c-brand-1);--vp-code-link-color: var(--vp-c-brand-1);--vp-code-link-hover-color: var(--vp-c-brand-2);--vp-code-bg: var(--vp-c-default-soft);--vp-code-block-color: var(--vp-c-text-2);--vp-code-block-bg: var(--vp-c-bg-alt);--vp-code-block-divider-color: var(--vp-c-gutter);--vp-code-lang-color: var(--vp-c-text-3);--vp-code-line-highlight-color: var(--vp-c-default-soft);--vp-code-line-number-color: var(--vp-c-text-3);--vp-code-line-diff-add-color: var(--vp-c-green-soft);--vp-code-line-diff-add-symbol-color: var(--vp-c-green-1);--vp-code-line-diff-remove-color: var(--vp-c-red-soft);--vp-code-line-diff-remove-symbol-color: var(--vp-c-red-1);--vp-code-line-warning-color: var(--vp-c-yellow-soft);--vp-code-line-error-color: var(--vp-c-red-soft);--vp-code-copy-code-border-color: var(--vp-c-divider);--vp-code-copy-code-bg: var(--vp-c-bg-soft);--vp-code-copy-code-hover-border-color: var(--vp-c-divider);--vp-code-copy-code-hover-bg: var(--vp-c-bg);--vp-code-copy-code-active-text: var(--vp-c-text-2);--vp-code-copy-copied-text-content: "Copied";--vp-code-tab-divider: var(--vp-code-block-divider-color);--vp-code-tab-text-color: var(--vp-c-text-2);--vp-code-tab-bg: var(--vp-code-block-bg);--vp-code-tab-hover-text-color: var(--vp-c-text-1);--vp-code-tab-active-text-color: var(--vp-c-text-1);--vp-code-tab-active-bar-color: var(--vp-c-brand-1)}:root{--vp-button-brand-border: transparent;--vp-button-brand-text: var(--vp-c-white);--vp-button-brand-bg: var(--vp-c-brand-3);--vp-button-brand-hover-border: transparent;--vp-button-brand-hover-text: var(--vp-c-white);--vp-button-brand-hover-bg: var(--vp-c-brand-2);--vp-button-brand-active-border: transparent;--vp-button-brand-active-text: var(--vp-c-white);--vp-button-brand-active-bg: var(--vp-c-brand-1);--vp-button-alt-border: transparent;--vp-button-alt-text: var(--vp-c-text-1);--vp-button-alt-bg: var(--vp-c-default-3);--vp-button-alt-hover-border: transparent;--vp-button-alt-hover-text: var(--vp-c-text-1);--vp-button-alt-hover-bg: var(--vp-c-default-2);--vp-button-alt-active-border: transparent;--vp-button-alt-active-text: var(--vp-c-text-1);--vp-button-alt-active-bg: var(--vp-c-default-1);--vp-button-sponsor-border: var(--vp-c-text-2);--vp-button-sponsor-text: var(--vp-c-text-2);--vp-button-sponsor-bg: transparent;--vp-button-sponsor-hover-border: var(--vp-c-sponsor);--vp-button-sponsor-hover-text: var(--vp-c-sponsor);--vp-button-sponsor-hover-bg: transparent;--vp-button-sponsor-active-border: var(--vp-c-sponsor);--vp-button-sponsor-active-text: var(--vp-c-sponsor);--vp-button-sponsor-active-bg: transparent}:root{--vp-custom-block-font-size: 14px;--vp-custom-block-code-font-size: 13px;--vp-custom-block-info-border: transparent;--vp-custom-block-info-text: var(--vp-c-text-1);--vp-custom-block-info-bg: var(--vp-c-default-soft);--vp-custom-block-info-code-bg: var(--vp-c-default-soft);--vp-custom-block-tip-border: transparent;--vp-custom-block-tip-text: var(--vp-c-text-1);--vp-custom-block-tip-bg: var(--vp-c-brand-soft);--vp-custom-block-tip-code-bg: var(--vp-c-brand-soft);--vp-custom-block-warning-border: transparent;--vp-custom-block-warning-text: var(--vp-c-text-1);--vp-custom-block-warning-bg: var(--vp-c-warning-soft);--vp-custom-block-warning-code-bg: var(--vp-c-warning-soft);--vp-custom-block-danger-border: transparent;--vp-custom-block-danger-text: var(--vp-c-text-1);--vp-custom-block-danger-bg: var(--vp-c-danger-soft);--vp-custom-block-danger-code-bg: var(--vp-c-danger-soft);--vp-custom-block-details-border: var(--vp-custom-block-info-border);--vp-custom-block-details-text: var(--vp-custom-block-info-text);--vp-custom-block-details-bg: var(--vp-custom-block-info-bg);--vp-custom-block-details-code-bg: var(--vp-custom-block-info-code-bg)}:root{--vp-input-border-color: var(--vp-c-border);--vp-input-bg-color: var(--vp-c-bg-alt);--vp-input-switch-bg-color: var(--vp-c-gray-soft)}:root{--vp-nav-height: 64px;--vp-nav-bg-color: var(--vp-c-bg);--vp-nav-screen-bg-color: var(--vp-c-bg);--vp-nav-logo-height: 24px}.hide-nav{--vp-nav-height: 0px}.hide-nav .VPSidebar{--vp-nav-height: 22px}:root{--vp-local-nav-bg-color: var(--vp-c-bg)}:root{--vp-sidebar-width: 272px;--vp-sidebar-bg-color: var(--vp-c-bg-alt)}:root{--vp-backdrop-bg-color: rgba(0, 0, 0, .6)}:root{--vp-home-hero-name-color: var(--vp-c-brand-1);--vp-home-hero-name-background: transparent;--vp-home-hero-image-background-image: none;--vp-home-hero-image-filter: none}:root{--vp-badge-info-border: transparent;--vp-badge-info-text: var(--vp-c-text-2);--vp-badge-info-bg: var(--vp-c-default-soft);--vp-badge-tip-border: transparent;--vp-badge-tip-text: var(--vp-c-brand-1);--vp-badge-tip-bg: var(--vp-c-brand-soft);--vp-badge-warning-border: transparent;--vp-badge-warning-text: var(--vp-c-warning-1);--vp-badge-warning-bg: var(--vp-c-warning-soft);--vp-badge-danger-border: transparent;--vp-badge-danger-text: var(--vp-c-danger-1);--vp-badge-danger-bg: var(--vp-c-danger-soft)}:root{--vp-carbon-ads-text-color: var(--vp-c-text-1);--vp-carbon-ads-poweredby-color: var(--vp-c-text-2);--vp-carbon-ads-bg-color: var(--vp-c-bg-soft);--vp-carbon-ads-hover-text-color: var(--vp-c-brand-1);--vp-carbon-ads-hover-poweredby-color: var(--vp-c-text-1)}:root{--vp-local-search-bg: var(--vp-c-bg);--vp-local-search-result-bg: var(--vp-c-bg);--vp-local-search-result-border: var(--vp-c-divider);--vp-local-search-result-selected-bg: var(--vp-c-bg);--vp-local-search-result-selected-border: var(--vp-c-brand-1);--vp-local-search-highlight-bg: var(--vp-c-brand-1);--vp-local-search-highlight-text: var(--vp-c-neutral-inverse)}@media (prefers-reduced-motion: reduce){*,:before,:after{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:initial!important;scroll-behavior:auto!important;transition-duration:0s!important;transition-delay:0s!important}}*,:before,:after{box-sizing:border-box}html{line-height:1.4;font-size:16px;-webkit-text-size-adjust:100%}html.dark{color-scheme:dark}body{margin:0;width:100%;min-width:320px;min-height:100vh;line-height:24px;font-family:var(--vp-font-family-base);font-size:16px;font-weight:400;color:var(--vp-c-text-1);background-color:var(--vp-c-bg);direction:ltr;font-synthesis:style;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}main{display:block}h1,h2,h3,h4,h5,h6{margin:0;line-height:24px;font-size:16px;font-weight:400}p{margin:0}strong,b{font-weight:600}a,area,button,[role=button],input,label,select,summary,textarea{touch-action:manipulation}a{color:inherit;text-decoration:inherit}ol,ul{list-style:none;margin:0;padding:0}blockquote{margin:0}pre,code,kbd,samp{font-family:var(--vp-font-family-mono)}img,svg,video,canvas,audio,iframe,embed,object{display:block}figure{margin:0}img,video{max-width:100%;height:auto}button,input,optgroup,select,textarea{border:0;padding:0;line-height:inherit;color:inherit}button{padding:0;font-family:inherit;background-color:transparent;background-image:none}button:enabled,[role=button]:enabled{cursor:pointer}button:focus,button:focus-visible{outline:1px dotted;outline:4px auto -webkit-focus-ring-color}button:focus:not(:focus-visible){outline:none!important}input:focus,textarea:focus,select:focus{outline:none}table{border-collapse:collapse}input{background-color:transparent}input:-ms-input-placeholder,textarea:-ms-input-placeholder{color:var(--vp-c-text-3)}input::-ms-input-placeholder,textarea::-ms-input-placeholder{color:var(--vp-c-text-3)}input::placeholder,textarea::placeholder{color:var(--vp-c-text-3)}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}textarea{resize:vertical}select{-webkit-appearance:none}fieldset{margin:0;padding:0}h1,h2,h3,h4,h5,h6,li,p{overflow-wrap:break-word}vite-error-overlay{z-index:9999}mjx-container{display:inline-block;margin:auto 2px -2px}mjx-container>svg{margin:auto}.visually-hidden{position:absolute;width:1px;height:1px;white-space:nowrap;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden}.custom-block{border:1px solid transparent;border-radius:8px;padding:16px 16px 8px;line-height:24px;font-size:var(--vp-custom-block-font-size);color:var(--vp-c-text-2)}.custom-block.info{border-color:var(--vp-custom-block-info-border);color:var(--vp-custom-block-info-text);background-color:var(--vp-custom-block-info-bg)}.custom-block.info a,.custom-block.info code{color:var(--vp-c-brand-1)}.custom-block.info a:hover{color:var(--vp-c-brand-2)}.custom-block.info code{background-color:var(--vp-custom-block-info-code-bg)}.custom-block.tip{border-color:var(--vp-custom-block-tip-border);color:var(--vp-custom-block-tip-text);background-color:var(--vp-custom-block-tip-bg)}.custom-block.tip a,.custom-block.tip code{color:var(--vp-c-brand-1)}.custom-block.tip a:hover{color:var(--vp-c-brand-2)}.custom-block.tip code{background-color:var(--vp-custom-block-tip-code-bg)}.custom-block.warning{border-color:var(--vp-custom-block-warning-border);color:var(--vp-custom-block-warning-text);background-color:var(--vp-custom-block-warning-bg)}.custom-block.warning a,.custom-block.warning code{color:var(--vp-c-warning-1)}.custom-block.warning a:hover{color:var(--vp-c-warning-2)}.custom-block.warning code{background-color:var(--vp-custom-block-warning-code-bg)}.custom-block.danger{border-color:var(--vp-custom-block-danger-border);color:var(--vp-custom-block-danger-text);background-color:var(--vp-custom-block-danger-bg)}.custom-block.danger a,.custom-block.danger code{color:var(--vp-c-danger-1)}.custom-block.danger a:hover{color:var(--vp-c-danger-2)}.custom-block.danger code{background-color:var(--vp-custom-block-danger-code-bg)}.custom-block.details{border-color:var(--vp-custom-block-details-border);color:var(--vp-custom-block-details-text);background-color:var(--vp-custom-block-details-bg)}.custom-block.details a{color:var(--vp-c-brand-1)}.custom-block.details a:hover{color:var(--vp-c-brand-2)}.custom-block.details code{background-color:var(--vp-custom-block-details-code-bg)}.custom-block-title{font-weight:600}.custom-block p+p{margin:8px 0}.custom-block.details summary{margin:0 0 8px;font-weight:700;cursor:pointer}.custom-block.details summary+p{margin:8px 0}.custom-block a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px;transition:opacity .25s}.custom-block a:hover{opacity:.75}.custom-block code{font-size:var(--vp-custom-block-code-font-size)}.custom-block.custom-block th,.custom-block.custom-block blockquote>p{font-size:var(--vp-custom-block-font-size);color:inherit}.dark .vp-code-light{display:none}html:not(.dark) .vp-code-dark{display:none}.vp-code-group{margin-top:16px}.vp-code-group .tabs{position:relative;display:flex;margin-right:-24px;margin-left:-24px;padding:0 12px;background-color:var(--vp-code-tab-bg);overflow-x:auto;overflow-y:hidden;box-shadow:inset 0 -1px var(--vp-code-tab-divider)}@media (min-width: 640px){.vp-code-group .tabs{margin-right:0;margin-left:0;border-radius:8px 8px 0 0}}.vp-code-group .tabs input{position:fixed;opacity:0;pointer-events:none}.vp-code-group .tabs label{position:relative;display:inline-block;border-bottom:1px solid transparent;padding:0 12px;line-height:48px;font-size:14px;font-weight:500;color:var(--vp-code-tab-text-color);white-space:nowrap;cursor:pointer;transition:color .25s}.vp-code-group .tabs label:after{position:absolute;right:8px;bottom:-1px;left:8px;z-index:1;height:2px;border-radius:2px;content:"";background-color:transparent;transition:background-color .25s}.vp-code-group label:hover{color:var(--vp-code-tab-hover-text-color)}.vp-code-group input:checked+label{color:var(--vp-code-tab-active-text-color)}.vp-code-group input:checked+label:after{background-color:var(--vp-code-tab-active-bar-color)}.vp-code-group div[class*=language-],.vp-block{display:none;margin-top:0!important;border-top-left-radius:0!important;border-top-right-radius:0!important}.vp-code-group div[class*=language-].active,.vp-block.active{display:block}.vp-block{padding:20px 24px}.vp-doc h1,.vp-doc h2,.vp-doc h3,.vp-doc h4,.vp-doc h5,.vp-doc h6{position:relative;font-weight:600;outline:none}.vp-doc h1{letter-spacing:-.02em;line-height:40px;font-size:28px}.vp-doc h2{margin:48px 0 16px;border-top:1px solid var(--vp-c-divider);padding-top:24px;letter-spacing:-.02em;line-height:32px;font-size:24px}.vp-doc h3{margin:32px 0 0;letter-spacing:-.01em;line-height:28px;font-size:20px}.vp-doc .header-anchor{position:absolute;top:0;left:0;margin-left:-.87em;font-weight:500;-webkit-user-select:none;user-select:none;opacity:0;text-decoration:none;transition:color .25s,opacity .25s}.vp-doc .header-anchor:before{content:var(--vp-header-anchor-symbol)}.vp-doc h1:hover .header-anchor,.vp-doc h1 .header-anchor:focus,.vp-doc h2:hover .header-anchor,.vp-doc h2 .header-anchor:focus,.vp-doc h3:hover .header-anchor,.vp-doc h3 .header-anchor:focus,.vp-doc h4:hover .header-anchor,.vp-doc h4 .header-anchor:focus,.vp-doc h5:hover .header-anchor,.vp-doc h5 .header-anchor:focus,.vp-doc h6:hover .header-anchor,.vp-doc h6 .header-anchor:focus{opacity:1}@media (min-width: 768px){.vp-doc h1{letter-spacing:-.02em;line-height:40px;font-size:32px}}.vp-doc h2 .header-anchor{top:24px}.vp-doc p,.vp-doc summary{margin:16px 0}.vp-doc p{line-height:28px}.vp-doc blockquote{margin:16px 0;border-left:2px solid var(--vp-c-divider);padding-left:16px;transition:border-color .5s}.vp-doc blockquote>p{margin:0;font-size:16px;color:var(--vp-c-text-2);transition:color .5s}.vp-doc a{font-weight:500;color:var(--vp-c-brand-1);text-decoration:underline;text-underline-offset:2px;transition:color .25s,opacity .25s}.vp-doc a:hover{color:var(--vp-c-brand-2)}.vp-doc strong{font-weight:600}.vp-doc ul,.vp-doc ol{padding-left:1.25rem;margin:16px 0}.vp-doc ul{list-style:disc}.vp-doc ol{list-style:decimal}.vp-doc li+li{margin-top:8px}.vp-doc li>ol,.vp-doc li>ul{margin:8px 0 0}.vp-doc table{display:block;border-collapse:collapse;margin:20px 0;overflow-x:auto}.vp-doc tr{border-top:1px solid var(--vp-c-divider);transition:background-color .5s}.vp-doc tr:nth-child(2n){background-color:var(--vp-c-bg-soft)}.vp-doc th,.vp-doc td{border:1px solid var(--vp-c-divider);padding:8px 16px}.vp-doc th{text-align:left;font-size:14px;font-weight:600;color:var(--vp-c-text-2);background-color:var(--vp-c-bg-soft)}.vp-doc td{font-size:14px}.vp-doc hr{margin:16px 0;border:none;border-top:1px solid var(--vp-c-divider)}.vp-doc .custom-block{margin:16px 0}.vp-doc .custom-block p{margin:8px 0;line-height:24px}.vp-doc .custom-block p:first-child{margin:0}.vp-doc .custom-block div[class*=language-]{margin:8px 0;border-radius:8px}.vp-doc .custom-block div[class*=language-] code{font-weight:400;background-color:transparent}.vp-doc .custom-block .vp-code-group .tabs{margin:0;border-radius:8px 8px 0 0}.vp-doc :not(pre,h1,h2,h3,h4,h5,h6)>code{font-size:var(--vp-code-font-size);color:var(--vp-code-color)}.vp-doc :not(pre)>code{border-radius:4px;padding:3px 6px;background-color:var(--vp-code-bg);transition:color .25s,background-color .5s}.vp-doc a>code{color:var(--vp-code-link-color)}.vp-doc a:hover>code{color:var(--vp-code-link-hover-color)}.vp-doc h1>code,.vp-doc h2>code,.vp-doc h3>code{font-size:.9em}.vp-doc div[class*=language-],.vp-block{position:relative;margin:16px -24px;background-color:var(--vp-code-block-bg);overflow-x:auto;transition:background-color .5s}@media (min-width: 640px){.vp-doc div[class*=language-],.vp-block{border-radius:8px;margin:16px 0}}@media (max-width: 639px){.vp-doc li div[class*=language-]{border-radius:8px 0 0 8px}}.vp-doc div[class*=language-]+div[class*=language-],.vp-doc div[class$=-api]+div[class*=language-],.vp-doc div[class*=language-]+div[class$=-api]>div[class*=language-]{margin-top:-8px}.vp-doc [class*=language-] pre,.vp-doc [class*=language-] code{direction:ltr;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}.vp-doc [class*=language-] pre{position:relative;z-index:1;margin:0;padding:20px 0;background:transparent;overflow-x:auto}.vp-doc [class*=language-] code{display:block;padding:0 24px;width:fit-content;min-width:100%;line-height:var(--vp-code-line-height);font-size:var(--vp-code-font-size);color:var(--vp-code-block-color);transition:color .5s}.vp-doc [class*=language-] code .highlighted{background-color:var(--vp-code-line-highlight-color);transition:background-color .5s;margin:0 -24px;padding:0 24px;width:calc(100% + 48px);display:inline-block}.vp-doc [class*=language-] code .highlighted.error{background-color:var(--vp-code-line-error-color)}.vp-doc [class*=language-] code .highlighted.warning{background-color:var(--vp-code-line-warning-color)}.vp-doc [class*=language-] code .diff{transition:background-color .5s;margin:0 -24px;padding:0 24px;width:calc(100% + 48px);display:inline-block}.vp-doc [class*=language-] code .diff:before{position:absolute;left:10px}.vp-doc [class*=language-] .has-focused-lines .line:not(.has-focus){filter:blur(.095rem);opacity:.4;transition:filter .35s,opacity .35s}.vp-doc [class*=language-] .has-focused-lines .line:not(.has-focus){opacity:.7;transition:filter .35s,opacity .35s}.vp-doc [class*=language-]:hover .has-focused-lines .line:not(.has-focus){filter:blur(0);opacity:1}.vp-doc [class*=language-] code .diff.remove{background-color:var(--vp-code-line-diff-remove-color);opacity:.7}.vp-doc [class*=language-] code .diff.remove:before{content:"-";color:var(--vp-code-line-diff-remove-symbol-color)}.vp-doc [class*=language-] code .diff.add{background-color:var(--vp-code-line-diff-add-color)}.vp-doc [class*=language-] code .diff.add:before{content:"+";color:var(--vp-code-line-diff-add-symbol-color)}.vp-doc div[class*=language-].line-numbers-mode{padding-left:32px}.vp-doc .line-numbers-wrapper{position:absolute;top:0;bottom:0;left:0;z-index:3;border-right:1px solid var(--vp-code-block-divider-color);padding-top:20px;width:32px;text-align:center;font-family:var(--vp-font-family-mono);line-height:var(--vp-code-line-height);font-size:var(--vp-code-font-size);color:var(--vp-code-line-number-color);transition:border-color .5s,color .5s}.vp-doc [class*=language-]>button.copy{direction:ltr;position:absolute;top:12px;right:12px;z-index:3;border:1px solid var(--vp-code-copy-code-border-color);border-radius:4px;width:40px;height:40px;background-color:var(--vp-code-copy-code-bg);opacity:0;cursor:pointer;background-image:var(--vp-icon-copy);background-position:50%;background-size:20px;background-repeat:no-repeat;transition:border-color .25s,background-color .25s,opacity .25s}.vp-doc [class*=language-]:hover>button.copy,.vp-doc [class*=language-]>button.copy:focus{opacity:1}.vp-doc [class*=language-]>button.copy:hover,.vp-doc [class*=language-]>button.copy.copied{border-color:var(--vp-code-copy-code-hover-border-color);background-color:var(--vp-code-copy-code-hover-bg)}.vp-doc [class*=language-]>button.copy.copied,.vp-doc [class*=language-]>button.copy:hover.copied{border-radius:0 4px 4px 0;background-color:var(--vp-code-copy-code-hover-bg);background-image:var(--vp-icon-copied)}.vp-doc [class*=language-]>button.copy.copied:before,.vp-doc [class*=language-]>button.copy:hover.copied:before{position:relative;top:-1px;transform:translate(calc(-100% - 1px));display:flex;justify-content:center;align-items:center;border:1px solid var(--vp-code-copy-code-hover-border-color);border-right:0;border-radius:4px 0 0 4px;padding:0 10px;width:fit-content;height:40px;text-align:center;font-size:12px;font-weight:500;color:var(--vp-code-copy-code-active-text);background-color:var(--vp-code-copy-code-hover-bg);white-space:nowrap;content:var(--vp-code-copy-copied-text-content)}.vp-doc [class*=language-]>span.lang{position:absolute;top:2px;right:8px;z-index:2;font-size:12px;font-weight:500;color:var(--vp-code-lang-color);transition:color .4s,opacity .4s}.vp-doc [class*=language-]:hover>button.copy+span.lang,.vp-doc [class*=language-]>button.copy:focus+span.lang{opacity:0}.vp-doc .VPTeamMembers{margin-top:24px}.vp-doc .VPTeamMembers.small.count-1 .container{margin:0!important;max-width:calc((100% - 24px)/2)!important}.vp-doc .VPTeamMembers.small.count-2 .container,.vp-doc .VPTeamMembers.small.count-3 .container{max-width:100%!important}.vp-doc .VPTeamMembers.medium.count-1 .container{margin:0!important;max-width:calc((100% - 24px)/2)!important}:is(.vp-external-link-icon,.vp-doc a[href*="://"],.vp-doc a[target=_blank]):not(.no-icon):after{display:inline-block;margin-top:-1px;margin-left:4px;width:11px;height:11px;background:currentColor;color:var(--vp-c-text-3);flex-shrink:0;--icon: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' %3E%3Cpath d='M0 0h24v24H0V0z' fill='none' /%3E%3Cpath d='M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z' /%3E%3C/svg%3E");-webkit-mask-image:var(--icon);mask-image:var(--icon)}.vp-external-link-icon:after{content:""}.vp-sponsor{border-radius:16px;overflow:hidden}.vp-sponsor.aside{border-radius:12px}.vp-sponsor-section+.vp-sponsor-section{margin-top:4px}.vp-sponsor-tier{margin-bottom:4px;text-align:center;letter-spacing:1px;line-height:24px;width:100%;font-weight:600;color:var(--vp-c-text-2);background-color:var(--vp-c-bg-soft)}.vp-sponsor.normal .vp-sponsor-tier{padding:13px 0 11px;font-size:14px}.vp-sponsor.aside .vp-sponsor-tier{padding:9px 0 7px;font-size:12px}.vp-sponsor-grid+.vp-sponsor-tier{margin-top:4px}.vp-sponsor-grid{display:flex;flex-wrap:wrap;gap:4px}.vp-sponsor-grid.xmini .vp-sponsor-grid-link{height:64px}.vp-sponsor-grid.xmini .vp-sponsor-grid-image{max-width:64px;max-height:22px}.vp-sponsor-grid.mini .vp-sponsor-grid-link{height:72px}.vp-sponsor-grid.mini .vp-sponsor-grid-image{max-width:96px;max-height:24px}.vp-sponsor-grid.small .vp-sponsor-grid-link{height:96px}.vp-sponsor-grid.small .vp-sponsor-grid-image{max-width:96px;max-height:24px}.vp-sponsor-grid.medium .vp-sponsor-grid-link{height:112px}.vp-sponsor-grid.medium .vp-sponsor-grid-image{max-width:120px;max-height:36px}.vp-sponsor-grid.big .vp-sponsor-grid-link{height:184px}.vp-sponsor-grid.big .vp-sponsor-grid-image{max-width:192px;max-height:56px}.vp-sponsor-grid[data-vp-grid="2"] .vp-sponsor-grid-item{width:calc((100% - 4px)/2)}.vp-sponsor-grid[data-vp-grid="3"] .vp-sponsor-grid-item{width:calc((100% - 4px * 2) / 3)}.vp-sponsor-grid[data-vp-grid="4"] .vp-sponsor-grid-item{width:calc((100% - 12px)/4)}.vp-sponsor-grid[data-vp-grid="5"] .vp-sponsor-grid-item{width:calc((100% - 16px)/5)}.vp-sponsor-grid[data-vp-grid="6"] .vp-sponsor-grid-item{width:calc((100% - 4px * 5) / 6)}.vp-sponsor-grid-item{flex-shrink:0;width:100%;background-color:var(--vp-c-bg-soft);transition:background-color .25s}.vp-sponsor-grid-item:hover{background-color:var(--vp-c-default-soft)}.vp-sponsor-grid-item:hover .vp-sponsor-grid-image{filter:grayscale(0) invert(0)}.vp-sponsor-grid-item.empty:hover{background-color:var(--vp-c-bg-soft)}.dark .vp-sponsor-grid-item:hover{background-color:var(--vp-c-white)}.dark .vp-sponsor-grid-item.empty:hover{background-color:var(--vp-c-bg-soft)}.vp-sponsor-grid-link{display:flex}.vp-sponsor-grid-box{display:flex;justify-content:center;align-items:center;width:100%}.vp-sponsor-grid-image{max-width:100%;filter:grayscale(1);transition:filter .25s}.dark .vp-sponsor-grid-image{filter:grayscale(1) invert(1)}.VPBadge[data-v-9613cc9f]{display:inline-block;margin-left:2px;border:1px solid transparent;border-radius:12px;padding:0 10px;line-height:22px;font-size:12px;font-weight:500;transform:translateY(-2px)}.vp-doc h1>.VPBadge[data-v-9613cc9f]{margin-top:4px;vertical-align:top}.vp-doc h2>.VPBadge[data-v-9613cc9f]{margin-top:3px;padding:0 8px;vertical-align:top}.vp-doc h3>.VPBadge[data-v-9613cc9f]{vertical-align:middle}.vp-doc h4>.VPBadge[data-v-9613cc9f],.vp-doc h5>.VPBadge[data-v-9613cc9f],.vp-doc h6>.VPBadge[data-v-9613cc9f]{vertical-align:middle;line-height:18px}.VPBadge.info[data-v-9613cc9f]{border-color:var(--vp-badge-info-border);color:var(--vp-badge-info-text);background-color:var(--vp-badge-info-bg)}.VPBadge.tip[data-v-9613cc9f]{border-color:var(--vp-badge-tip-border);color:var(--vp-badge-tip-text);background-color:var(--vp-badge-tip-bg)}.VPBadge.warning[data-v-9613cc9f]{border-color:var(--vp-badge-warning-border);color:var(--vp-badge-warning-text);background-color:var(--vp-badge-warning-bg)}.VPBadge.danger[data-v-9613cc9f]{border-color:var(--vp-badge-danger-border);color:var(--vp-badge-danger-text);background-color:var(--vp-badge-danger-bg)}.VPBackdrop[data-v-c79a1216]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--vp-z-index-backdrop);background:var(--vp-backdrop-bg-color);transition:opacity .5s}.VPBackdrop.fade-enter-from[data-v-c79a1216],.VPBackdrop.fade-leave-to[data-v-c79a1216]{opacity:0}.VPBackdrop.fade-leave-active[data-v-c79a1216]{transition-duration:.25s}@media (min-width: 1280px){.VPBackdrop[data-v-c79a1216]{display:none}}.NotFound[data-v-f87ff6e4]{padding:64px 24px 96px;text-align:center}@media (min-width: 768px){.NotFound[data-v-f87ff6e4]{padding:96px 32px 168px}}.code[data-v-f87ff6e4]{line-height:64px;font-size:64px;font-weight:600}.title[data-v-f87ff6e4]{padding-top:12px;letter-spacing:2px;line-height:20px;font-size:20px;font-weight:700}.divider[data-v-f87ff6e4]{margin:24px auto 18px;width:64px;height:1px;background-color:var(--vp-c-divider)}.quote[data-v-f87ff6e4]{margin:0 auto;max-width:256px;font-size:14px;font-weight:500;color:var(--vp-c-text-2)}.action[data-v-f87ff6e4]{padding-top:20px}.link[data-v-f87ff6e4]{display:inline-block;border:1px solid var(--vp-c-brand-1);border-radius:16px;padding:3px 16px;font-size:14px;font-weight:500;color:var(--vp-c-brand-1);transition:border-color .25s,color .25s}.link[data-v-f87ff6e4]:hover{border-color:var(--vp-c-brand-2);color:var(--vp-c-brand-2)}.root[data-v-d0ee3533]{position:relative;z-index:1}.nested[data-v-d0ee3533]{padding-left:16px}.outline-link[data-v-d0ee3533]{display:block;line-height:28px;color:var(--vp-c-text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .5s;font-weight:400}.outline-link[data-v-d0ee3533]:hover,.outline-link.active[data-v-d0ee3533]{color:var(--vp-c-text-1);transition:color .25s}.outline-link.nested[data-v-d0ee3533]{padding-left:13px}.VPDocAsideOutline[data-v-d330b1bb]{display:none}.VPDocAsideOutline.has-outline[data-v-d330b1bb]{display:block}.content[data-v-d330b1bb]{position:relative;border-left:1px solid var(--vp-c-divider);padding-left:16px;font-size:13px;font-weight:500}.outline-marker[data-v-d330b1bb]{position:absolute;top:32px;left:-1px;z-index:0;opacity:0;width:2px;border-radius:2px;height:18px;background-color:var(--vp-c-brand-1);transition:top .25s cubic-bezier(0,1,.5,1),background-color .5s,opacity .25s}.outline-title[data-v-d330b1bb]{letter-spacing:.4px;line-height:28px;font-size:13px;font-weight:600}.VPDocAside[data-v-3f215769]{display:flex;flex-direction:column;flex-grow:1}.spacer[data-v-3f215769]{flex-grow:1}.VPDocAside[data-v-3f215769] .spacer+.VPDocAsideSponsors,.VPDocAside[data-v-3f215769] .spacer+.VPDocAsideCarbonAds{margin-top:24px}.VPDocAside[data-v-3f215769] .VPDocAsideSponsors+.VPDocAsideCarbonAds{margin-top:16px}.VPLastUpdated[data-v-7e05ebdb]{line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-2)}@media (min-width: 640px){.VPLastUpdated[data-v-7e05ebdb]{line-height:32px;font-size:14px;font-weight:500}}.VPDocFooter[data-v-ef5dee53]{margin-top:64px}.edit-info[data-v-ef5dee53]{padding-bottom:18px}@media (min-width: 640px){.edit-info[data-v-ef5dee53]{display:flex;justify-content:space-between;align-items:center;padding-bottom:14px}}.edit-link-button[data-v-ef5dee53]{display:flex;align-items:center;border:0;line-height:32px;font-size:14px;font-weight:500;color:var(--vp-c-brand-1);transition:color .25s}.edit-link-button[data-v-ef5dee53]:hover{color:var(--vp-c-brand-2)}.edit-link-icon[data-v-ef5dee53]{margin-right:8px;width:14px;height:14px;fill:currentColor}.prev-next[data-v-ef5dee53]{border-top:1px solid var(--vp-c-divider);padding-top:24px;display:grid;grid-row-gap:8px}@media (min-width: 640px){.prev-next[data-v-ef5dee53]{grid-template-columns:repeat(2,1fr);grid-column-gap:16px}}.pager-link[data-v-ef5dee53]{display:block;border:1px solid var(--vp-c-divider);border-radius:8px;padding:11px 16px 13px;width:100%;height:100%;transition:border-color .25s}.pager-link[data-v-ef5dee53]:hover{border-color:var(--vp-c-brand-1)}.pager-link.next[data-v-ef5dee53]{margin-left:auto;text-align:right}.desc[data-v-ef5dee53]{display:block;line-height:20px;font-size:12px;font-weight:500;color:var(--vp-c-text-2)}.title[data-v-ef5dee53]{display:block;line-height:20px;font-size:14px;font-weight:500;color:var(--vp-c-brand-1);transition:color .25s}.VPDocOutlineDropdown[data-v-eadfb36b]{margin-bottom:48px}.VPDocOutlineDropdown button[data-v-eadfb36b]{display:block;font-size:14px;font-weight:500;line-height:24px;border:1px solid var(--vp-c-border);padding:4px 12px;color:var(--vp-c-text-2);background-color:var(--vp-c-default-soft);border-radius:8px;transition:color .5s}.VPDocOutlineDropdown button[data-v-eadfb36b]:hover{color:var(--vp-c-text-1);transition:color .25s}.VPDocOutlineDropdown button.open[data-v-eadfb36b]{color:var(--vp-c-text-1)}.icon[data-v-eadfb36b]{display:inline-block;vertical-align:middle;width:16px;height:16px;fill:currentColor}[data-v-eadfb36b] .outline-link{font-size:14px;font-weight:400}.open>.icon[data-v-eadfb36b]{transform:rotate(90deg)}.items[data-v-eadfb36b]{margin-top:12px;border-left:1px solid var(--vp-c-divider)}.VPDoc[data-v-6b87e69f]{padding:32px 24px 96px;width:100%}.VPDoc .VPDocOutlineDropdown[data-v-6b87e69f]{display:none}@media (min-width: 960px) and (max-width: 1279px){.VPDoc .VPDocOutlineDropdown[data-v-6b87e69f]{display:block}}@media (min-width: 768px){.VPDoc[data-v-6b87e69f]{padding:48px 32px 128px}}@media (min-width: 960px){.VPDoc[data-v-6b87e69f]{padding:32px 32px 0}.VPDoc:not(.has-sidebar) .container[data-v-6b87e69f]{display:flex;justify-content:center;max-width:992px}.VPDoc:not(.has-sidebar) .content[data-v-6b87e69f]{max-width:752px}}@media (min-width: 1280px){.VPDoc .container[data-v-6b87e69f]{display:flex;justify-content:center}.VPDoc .aside[data-v-6b87e69f]{display:block}}@media (min-width: 1440px){.VPDoc:not(.has-sidebar) .content[data-v-6b87e69f]{max-width:784px}.VPDoc:not(.has-sidebar) .container[data-v-6b87e69f]{max-width:1104px}}.container[data-v-6b87e69f]{margin:0 auto;width:100%}.aside[data-v-6b87e69f]{position:relative;display:none;order:2;flex-grow:1;padding-left:32px;width:100%;max-width:256px}.left-aside[data-v-6b87e69f]{order:1;padding-left:unset;padding-right:32px}.aside-container[data-v-6b87e69f]{position:fixed;top:0;padding-top:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + var(--vp-doc-top-height, 0px) + 32px);width:224px;height:100vh;overflow-x:hidden;overflow-y:auto;scrollbar-width:none}.aside-container[data-v-6b87e69f]::-webkit-scrollbar{display:none}.aside-curtain[data-v-6b87e69f]{position:fixed;bottom:0;z-index:10;width:224px;height:32px;background:linear-gradient(transparent,var(--vp-c-bg) 70%)}.aside-content[data-v-6b87e69f]{display:flex;flex-direction:column;min-height:calc(100vh - (var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 32px));padding-bottom:32px}.content[data-v-6b87e69f]{position:relative;margin:0 auto;width:100%}@media (min-width: 960px){.content[data-v-6b87e69f]{padding:0 32px 128px}}@media (min-width: 1280px){.content[data-v-6b87e69f]{order:1;margin:0;min-width:640px}}.content-container[data-v-6b87e69f]{margin:0 auto}.VPDoc.has-aside .content-container[data-v-6b87e69f]{max-width:688px}.external-link-icon-enabled[data-v-6b87e69f] :is(.vp-doc a[href*="://"],.vp-doc a[target=_blank]):after{content:"";color:currentColor}.VPButton[data-v-c1c5efc1]{display:inline-block;border:1px solid transparent;text-align:center;font-weight:600;white-space:nowrap;transition:color .25s,border-color .25s,background-color .25s}.VPButton[data-v-c1c5efc1]:active{transition:color .1s,border-color .1s,background-color .1s}.VPButton.medium[data-v-c1c5efc1]{border-radius:20px;padding:0 20px;line-height:38px;font-size:14px}.VPButton.big[data-v-c1c5efc1]{border-radius:24px;padding:0 24px;line-height:46px;font-size:16px}.VPButton.brand[data-v-c1c5efc1]{border-color:var(--vp-button-brand-border);color:var(--vp-button-brand-text);background-color:var(--vp-button-brand-bg)}.VPButton.brand[data-v-c1c5efc1]:hover{border-color:var(--vp-button-brand-hover-border);color:var(--vp-button-brand-hover-text);background-color:var(--vp-button-brand-hover-bg)}.VPButton.brand[data-v-c1c5efc1]:active{border-color:var(--vp-button-brand-active-border);color:var(--vp-button-brand-active-text);background-color:var(--vp-button-brand-active-bg)}.VPButton.alt[data-v-c1c5efc1]{border-color:var(--vp-button-alt-border);color:var(--vp-button-alt-text);background-color:var(--vp-button-alt-bg)}.VPButton.alt[data-v-c1c5efc1]:hover{border-color:var(--vp-button-alt-hover-border);color:var(--vp-button-alt-hover-text);background-color:var(--vp-button-alt-hover-bg)}.VPButton.alt[data-v-c1c5efc1]:active{border-color:var(--vp-button-alt-active-border);color:var(--vp-button-alt-active-text);background-color:var(--vp-button-alt-active-bg)}.VPButton.sponsor[data-v-c1c5efc1]{border-color:var(--vp-button-sponsor-border);color:var(--vp-button-sponsor-text);background-color:var(--vp-button-sponsor-bg)}.VPButton.sponsor[data-v-c1c5efc1]:hover{border-color:var(--vp-button-sponsor-hover-border);color:var(--vp-button-sponsor-hover-text);background-color:var(--vp-button-sponsor-hover-bg)}.VPButton.sponsor[data-v-c1c5efc1]:active{border-color:var(--vp-button-sponsor-active-border);color:var(--vp-button-sponsor-active-text);background-color:var(--vp-button-sponsor-active-bg)}html:not(.dark) .VPImage.dark[data-v-8426fc1a]{display:none}.dark .VPImage.light[data-v-8426fc1a]{display:none}.VPHero[data-v-da5d1713]{margin-top:calc((var(--vp-nav-height) + var(--vp-layout-top-height, 0px)) * -1);padding:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 48px) 24px 48px}@media (min-width: 640px){.VPHero[data-v-da5d1713]{padding:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 80px) 48px 64px}}@media (min-width: 960px){.VPHero[data-v-da5d1713]{padding:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 80px) 64px 64px}}.container[data-v-da5d1713]{display:flex;flex-direction:column;margin:0 auto;max-width:1152px}@media (min-width: 960px){.container[data-v-da5d1713]{flex-direction:row}}.main[data-v-da5d1713]{position:relative;z-index:10;order:2;flex-grow:1;flex-shrink:0}.VPHero.has-image .container[data-v-da5d1713]{text-align:center}@media (min-width: 960px){.VPHero.has-image .container[data-v-da5d1713]{text-align:left}}@media (min-width: 960px){.main[data-v-da5d1713]{order:1;width:calc((100% / 3) * 2)}.VPHero.has-image .main[data-v-da5d1713]{max-width:592px}}.name[data-v-da5d1713],.text[data-v-da5d1713]{max-width:392px;letter-spacing:-.4px;line-height:40px;font-size:32px;font-weight:700;white-space:pre-wrap}.VPHero.has-image .name[data-v-da5d1713],.VPHero.has-image .text[data-v-da5d1713]{margin:0 auto}.name[data-v-da5d1713]{color:var(--vp-home-hero-name-color)}.clip[data-v-da5d1713]{background:var(--vp-home-hero-name-background);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:var(--vp-home-hero-name-color)}@media (min-width: 640px){.name[data-v-da5d1713],.text[data-v-da5d1713]{max-width:576px;line-height:56px;font-size:48px}}@media (min-width: 960px){.name[data-v-da5d1713],.text[data-v-da5d1713]{line-height:64px;font-size:56px}.VPHero.has-image .name[data-v-da5d1713],.VPHero.has-image .text[data-v-da5d1713]{margin:0}}.tagline[data-v-da5d1713]{padding-top:8px;max-width:392px;line-height:28px;font-size:18px;font-weight:500;white-space:pre-wrap;color:var(--vp-c-text-2)}.VPHero.has-image .tagline[data-v-da5d1713]{margin:0 auto}@media (min-width: 640px){.tagline[data-v-da5d1713]{padding-top:12px;max-width:576px;line-height:32px;font-size:20px}}@media (min-width: 960px){.tagline[data-v-da5d1713]{line-height:36px;font-size:24px}.VPHero.has-image .tagline[data-v-da5d1713]{margin:0}}.actions[data-v-da5d1713]{display:flex;flex-wrap:wrap;margin:-6px;padding-top:24px}.VPHero.has-image .actions[data-v-da5d1713]{justify-content:center}@media (min-width: 640px){.actions[data-v-da5d1713]{padding-top:32px}}@media (min-width: 960px){.VPHero.has-image .actions[data-v-da5d1713]{justify-content:flex-start}}.action[data-v-da5d1713]{flex-shrink:0;padding:6px}.image[data-v-da5d1713]{order:1;margin:-76px -24px -48px}@media (min-width: 640px){.image[data-v-da5d1713]{margin:-108px -24px -48px}}@media (min-width: 960px){.image[data-v-da5d1713]{flex-grow:1;order:2;margin:0;min-height:100%}}.image-container[data-v-da5d1713]{position:relative;margin:0 auto;width:320px;height:320px}@media (min-width: 640px){.image-container[data-v-da5d1713]{width:392px;height:392px}}@media (min-width: 960px){.image-container[data-v-da5d1713]{display:flex;justify-content:center;align-items:center;width:100%;height:100%;transform:translate(-32px,-32px)}}.image-bg[data-v-da5d1713]{position:absolute;top:50%;left:50%;border-radius:50%;width:192px;height:192px;background-image:var(--vp-home-hero-image-background-image);filter:var(--vp-home-hero-image-filter);transform:translate(-50%,-50%)}@media (min-width: 640px){.image-bg[data-v-da5d1713]{width:256px;height:256px}}@media (min-width: 960px){.image-bg[data-v-da5d1713]{width:320px;height:320px}}[data-v-da5d1713] .image-src{position:absolute;top:50%;left:50%;max-width:192px;max-height:192px;transform:translate(-50%,-50%)}@media (min-width: 640px){[data-v-da5d1713] .image-src{max-width:256px;max-height:256px}}@media (min-width: 960px){[data-v-da5d1713] .image-src{max-width:320px;max-height:320px}}.VPFeature[data-v-33204567]{display:block;border:1px solid var(--vp-c-bg-soft);border-radius:12px;height:100%;background-color:var(--vp-c-bg-soft);transition:border-color .25s,background-color .25s}.VPFeature.link[data-v-33204567]:hover{border-color:var(--vp-c-brand-1)}.box[data-v-33204567]{display:flex;flex-direction:column;padding:24px;height:100%}.box[data-v-33204567]>.VPImage{margin-bottom:20px}.icon[data-v-33204567]{display:flex;justify-content:center;align-items:center;margin-bottom:20px;border-radius:6px;background-color:var(--vp-c-default-soft);width:48px;height:48px;font-size:24px;transition:background-color .25s}.title[data-v-33204567]{line-height:24px;font-size:16px;font-weight:600}.details[data-v-33204567]{flex-grow:1;padding-top:8px;line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-2)}.link-text[data-v-33204567]{padding-top:8px}.link-text-value[data-v-33204567]{display:flex;align-items:center;font-size:14px;font-weight:500;color:var(--vp-c-brand-1)}.link-text-icon[data-v-33204567]{display:inline-block;margin-left:6px;width:14px;height:14px;fill:currentColor}.VPFeatures[data-v-a6181336]{position:relative;padding:0 24px}@media (min-width: 640px){.VPFeatures[data-v-a6181336]{padding:0 48px}}@media (min-width: 960px){.VPFeatures[data-v-a6181336]{padding:0 64px}}.container[data-v-a6181336]{margin:0 auto;max-width:1152px}.items[data-v-a6181336]{display:flex;flex-wrap:wrap;margin:-8px}.item[data-v-a6181336]{padding:8px;width:100%}@media (min-width: 640px){.item.grid-2[data-v-a6181336],.item.grid-4[data-v-a6181336],.item.grid-6[data-v-a6181336]{width:50%}}@media (min-width: 768px){.item.grid-2[data-v-a6181336],.item.grid-4[data-v-a6181336]{width:50%}.item.grid-3[data-v-a6181336],.item.grid-6[data-v-a6181336]{width:calc(100% / 3)}}@media (min-width: 960px){.item.grid-4[data-v-a6181336]{width:25%}}.VPHome[data-v-d82743a8]{padding-bottom:96px}.VPHome[data-v-d82743a8] .VPHomeSponsors{margin-top:112px;margin-bottom:-128px}@media (min-width: 768px){.VPHome[data-v-d82743a8]{padding-bottom:128px}}.VPContent[data-v-669faec9]{flex-grow:1;flex-shrink:0;margin:var(--vp-layout-top-height, 0px) auto 0;width:100%}.VPContent.is-home[data-v-669faec9]{width:100%;max-width:100%}.VPContent.has-sidebar[data-v-669faec9]{margin:0}@media (min-width: 960px){.VPContent[data-v-669faec9]{padding-top:var(--vp-nav-height)}.VPContent.has-sidebar[data-v-669faec9]{margin:var(--vp-layout-top-height, 0px) 0 0;padding-left:var(--vp-sidebar-width)}}@media (min-width: 1440px){.VPContent.has-sidebar[data-v-669faec9]{padding-right:calc((100vw - var(--vp-layout-max-width)) / 2);padding-left:calc((100vw - var(--vp-layout-max-width)) / 2 + var(--vp-sidebar-width))}}.VPFooter[data-v-e03eb2e1]{position:relative;z-index:var(--vp-z-index-footer);border-top:1px solid var(--vp-c-gutter);padding:32px 24px;background-color:var(--vp-c-bg)}.VPFooter.has-sidebar[data-v-e03eb2e1]{display:none}@media (min-width: 768px){.VPFooter[data-v-e03eb2e1]{padding:32px}}.container[data-v-e03eb2e1]{margin:0 auto;max-width:var(--vp-layout-max-width);text-align:center}.message[data-v-e03eb2e1],.copyright[data-v-e03eb2e1]{line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-2)}.VPLocalNavOutlineDropdown[data-v-1c15a60a]{padding:12px 20px 11px}.VPLocalNavOutlineDropdown button[data-v-1c15a60a]{display:block;font-size:12px;font-weight:500;line-height:24px;color:var(--vp-c-text-2);transition:color .5s;position:relative}.VPLocalNavOutlineDropdown button[data-v-1c15a60a]:hover{color:var(--vp-c-text-1);transition:color .25s}.VPLocalNavOutlineDropdown button.open[data-v-1c15a60a]{color:var(--vp-c-text-1)}.icon[data-v-1c15a60a]{display:inline-block;vertical-align:middle;margin-left:2px;width:14px;height:14px;fill:currentColor}[data-v-1c15a60a] .outline-link{font-size:14px;padding:2px 0}.open>.icon[data-v-1c15a60a]{transform:rotate(90deg)}.items[data-v-1c15a60a]{position:absolute;top:64px;right:16px;left:16px;display:grid;gap:1px;border:1px solid var(--vp-c-border);border-radius:8px;background-color:var(--vp-c-gutter);max-height:calc(var(--vp-vh, 100vh) - 86px);overflow:hidden auto;box-shadow:var(--vp-shadow-3)}.header[data-v-1c15a60a]{background-color:var(--vp-c-bg-soft)}.top-link[data-v-1c15a60a]{display:block;padding:0 16px;line-height:48px;font-size:14px;font-weight:500;color:var(--vp-c-brand-1)}.outline[data-v-1c15a60a]{padding:8px 0;background-color:var(--vp-c-bg-soft)}.flyout-enter-active[data-v-1c15a60a]{transition:all .2s ease-out}.flyout-leave-active[data-v-1c15a60a]{transition:all .15s ease-in}.flyout-enter-from[data-v-1c15a60a],.flyout-leave-to[data-v-1c15a60a]{opacity:0;transform:translateY(-16px)}.VPLocalNav[data-v-79c8c1df]{position:sticky;top:0;left:0;z-index:var(--vp-z-index-local-nav);display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--vp-c-gutter);border-bottom:1px solid var(--vp-c-gutter);padding-top:var(--vp-layout-top-height, 0px);width:100%;background-color:var(--vp-local-nav-bg-color)}.VPLocalNav.fixed[data-v-79c8c1df]{position:fixed}.VPLocalNav.reached-top[data-v-79c8c1df]{border-top-color:transparent}@media (min-width: 960px){.VPLocalNav[data-v-79c8c1df]{display:none}}.menu[data-v-79c8c1df]{display:flex;align-items:center;padding:12px 24px 11px;line-height:24px;font-size:12px;font-weight:500;color:var(--vp-c-text-2);transition:color .5s}.menu[data-v-79c8c1df]:hover{color:var(--vp-c-text-1);transition:color .25s}@media (min-width: 768px){.menu[data-v-79c8c1df]{padding:0 32px}}.menu-icon[data-v-79c8c1df]{margin-right:8px;width:16px;height:16px;fill:currentColor}.VPOutlineDropdown[data-v-79c8c1df]{padding:12px 24px 11px}@media (min-width: 768px){.VPOutlineDropdown[data-v-79c8c1df]{padding:12px 32px 11px}}.VPSwitch[data-v-b1685198]{position:relative;border-radius:11px;display:block;width:40px;height:22px;flex-shrink:0;border:1px solid var(--vp-input-border-color);background-color:var(--vp-input-switch-bg-color);transition:border-color .25s!important}.VPSwitch[data-v-b1685198]:hover{border-color:var(--vp-c-brand-1)}.check[data-v-b1685198]{position:absolute;top:1px;left:1px;width:18px;height:18px;border-radius:50%;background-color:var(--vp-c-neutral-inverse);box-shadow:var(--vp-shadow-1);transition:transform .25s!important}.icon[data-v-b1685198]{position:relative;display:block;width:18px;height:18px;border-radius:50%;overflow:hidden}.icon[data-v-b1685198] svg{position:absolute;top:3px;left:3px;width:12px;height:12px;fill:var(--vp-c-text-2)}.dark .icon[data-v-b1685198] svg{fill:var(--vp-c-text-1);transition:opacity .25s!important}.sun[data-v-ce54a7d1]{opacity:1}.moon[data-v-ce54a7d1],.dark .sun[data-v-ce54a7d1]{opacity:0}.dark .moon[data-v-ce54a7d1]{opacity:1}.dark .VPSwitchAppearance[data-v-ce54a7d1] .check{transform:translate(18px)}.VPNavBarAppearance[data-v-e6aabb21]{display:none}@media (min-width: 1280px){.VPNavBarAppearance[data-v-e6aabb21]{display:flex;align-items:center}}.VPMenuGroup+.VPMenuLink[data-v-43f1e123]{margin:12px -12px 0;border-top:1px solid var(--vp-c-divider);padding:12px 12px 0}.link[data-v-43f1e123]{display:block;border-radius:6px;padding:0 12px;line-height:32px;font-size:14px;font-weight:500;color:var(--vp-c-text-1);white-space:nowrap;transition:background-color .25s,color .25s}.link[data-v-43f1e123]:hover{color:var(--vp-c-brand-1);background-color:var(--vp-c-default-soft)}.link.active[data-v-43f1e123]{color:var(--vp-c-brand-1)}.VPMenuGroup[data-v-69e747b5]{margin:12px -12px 0;border-top:1px solid var(--vp-c-divider);padding:12px 12px 0}.VPMenuGroup[data-v-69e747b5]:first-child{margin-top:0;border-top:0;padding-top:0}.VPMenuGroup+.VPMenuGroup[data-v-69e747b5]{margin-top:12px;border-top:1px solid var(--vp-c-divider)}.title[data-v-69e747b5]{padding:0 12px;line-height:32px;font-size:14px;font-weight:600;color:var(--vp-c-text-2);white-space:nowrap;transition:color .25s}.VPMenu[data-v-e7ea1737]{border-radius:12px;padding:12px;min-width:128px;border:1px solid var(--vp-c-divider);background-color:var(--vp-c-bg-elv);box-shadow:var(--vp-shadow-3);transition:background-color .5s;max-height:calc(100vh - var(--vp-nav-height));overflow-y:auto}.VPMenu[data-v-e7ea1737] .group{margin:0 -12px;padding:0 12px 12px}.VPMenu[data-v-e7ea1737] .group+.group{border-top:1px solid var(--vp-c-divider);padding:11px 12px 12px}.VPMenu[data-v-e7ea1737] .group:last-child{padding-bottom:0}.VPMenu[data-v-e7ea1737] .group+.item{border-top:1px solid var(--vp-c-divider);padding:11px 16px 0}.VPMenu[data-v-e7ea1737] .item{padding:0 16px;white-space:nowrap}.VPMenu[data-v-e7ea1737] .label{flex-grow:1;line-height:28px;font-size:12px;font-weight:500;color:var(--vp-c-text-2);transition:color .5s}.VPMenu[data-v-e7ea1737] .action{padding-left:24px}.VPFlyout[data-v-9c007e85]{position:relative}.VPFlyout[data-v-9c007e85]:hover{color:var(--vp-c-brand-1);transition:color .25s}.VPFlyout:hover .text[data-v-9c007e85]{color:var(--vp-c-text-2)}.VPFlyout:hover .icon[data-v-9c007e85]{fill:var(--vp-c-text-2)}.VPFlyout.active .text[data-v-9c007e85]{color:var(--vp-c-brand-1)}.VPFlyout.active:hover .text[data-v-9c007e85]{color:var(--vp-c-brand-2)}.VPFlyout:hover .menu[data-v-9c007e85],.button[aria-expanded=true]+.menu[data-v-9c007e85]{opacity:1;visibility:visible;transform:translateY(0)}.button[aria-expanded=false]+.menu[data-v-9c007e85]{opacity:0;visibility:hidden;transform:translateY(0)}.button[data-v-9c007e85]{display:flex;align-items:center;padding:0 12px;height:var(--vp-nav-height);color:var(--vp-c-text-1);transition:color .5s}.text[data-v-9c007e85]{display:flex;align-items:center;line-height:var(--vp-nav-height);font-size:14px;font-weight:500;color:var(--vp-c-text-1);transition:color .25s}.option-icon[data-v-9c007e85]{margin-right:0;width:16px;height:16px;fill:currentColor}.text-icon[data-v-9c007e85]{margin-left:4px;width:14px;height:14px;fill:currentColor}.icon[data-v-9c007e85]{width:20px;height:20px;fill:currentColor;transition:fill .25s}.menu[data-v-9c007e85]{position:absolute;top:calc(var(--vp-nav-height) / 2 + 20px);right:0;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s,transform .25s}.VPSocialLink[data-v-f80f8133]{display:flex;justify-content:center;align-items:center;width:36px;height:36px;color:var(--vp-c-text-2);transition:color .5s}.VPSocialLink[data-v-f80f8133]:hover{color:var(--vp-c-text-1);transition:color .25s}.VPSocialLink[data-v-f80f8133]>svg{width:20px;height:20px;fill:currentColor}.VPSocialLinks[data-v-7bc22406]{display:flex;justify-content:center}.VPNavBarExtra[data-v-40855f84]{display:none;margin-right:-12px}@media (min-width: 768px){.VPNavBarExtra[data-v-40855f84]{display:block}}@media (min-width: 1280px){.VPNavBarExtra[data-v-40855f84]{display:none}}.trans-title[data-v-40855f84]{padding:0 24px 0 12px;line-height:32px;font-size:14px;font-weight:700;color:var(--vp-c-text-1)}.item.appearance[data-v-40855f84],.item.social-links[data-v-40855f84]{display:flex;align-items:center;padding:0 12px}.item.appearance[data-v-40855f84]{min-width:176px}.appearance-action[data-v-40855f84]{margin-right:-2px}.social-links-list[data-v-40855f84]{margin:-4px -8px}.VPNavBarHamburger[data-v-e5dd9c1c]{display:flex;justify-content:center;align-items:center;width:48px;height:var(--vp-nav-height)}@media (min-width: 768px){.VPNavBarHamburger[data-v-e5dd9c1c]{display:none}}.container[data-v-e5dd9c1c]{position:relative;width:16px;height:14px;overflow:hidden}.VPNavBarHamburger:hover .top[data-v-e5dd9c1c]{top:0;left:0;transform:translate(4px)}.VPNavBarHamburger:hover .middle[data-v-e5dd9c1c]{top:6px;left:0;transform:translate(0)}.VPNavBarHamburger:hover .bottom[data-v-e5dd9c1c]{top:12px;left:0;transform:translate(8px)}.VPNavBarHamburger.active .top[data-v-e5dd9c1c]{top:6px;transform:translate(0) rotate(225deg)}.VPNavBarHamburger.active .middle[data-v-e5dd9c1c]{top:6px;transform:translate(16px)}.VPNavBarHamburger.active .bottom[data-v-e5dd9c1c]{top:6px;transform:translate(0) rotate(135deg)}.VPNavBarHamburger.active:hover .top[data-v-e5dd9c1c],.VPNavBarHamburger.active:hover .middle[data-v-e5dd9c1c],.VPNavBarHamburger.active:hover .bottom[data-v-e5dd9c1c]{background-color:var(--vp-c-text-2);transition:top .25s,background-color .25s,transform .25s}.top[data-v-e5dd9c1c],.middle[data-v-e5dd9c1c],.bottom[data-v-e5dd9c1c]{position:absolute;width:16px;height:2px;background-color:var(--vp-c-text-1);transition:top .25s,background-color .5s,transform .25s}.top[data-v-e5dd9c1c]{top:0;left:0;transform:translate(0)}.middle[data-v-e5dd9c1c]{top:6px;left:0;transform:translate(8px)}.bottom[data-v-e5dd9c1c]{top:12px;left:0;transform:translate(4px)}.VPNavBarMenuLink[data-v-42ef59de]{display:flex;align-items:center;padding:0 12px;line-height:var(--vp-nav-height);font-size:14px;font-weight:500;color:var(--vp-c-text-1);transition:color .25s}.VPNavBarMenuLink.active[data-v-42ef59de],.VPNavBarMenuLink[data-v-42ef59de]:hover{color:var(--vp-c-brand-1)}.VPNavBarMenu[data-v-7f418b0f]{display:none}@media (min-width: 768px){.VPNavBarMenu[data-v-7f418b0f]{display:flex}}/*! @docsearch/css 3.5.2 | MIT License | © Algolia, Inc. and contributors | https://docsearch.algolia.com */:root{--docsearch-primary-color:#5468ff;--docsearch-text-color:#1c1e21;--docsearch-spacing:12px;--docsearch-icon-stroke-width:1.4;--docsearch-highlight-color:var(--docsearch-primary-color);--docsearch-muted-color:#969faf;--docsearch-container-background:rgba(101,108,133,.8);--docsearch-logo-color:#5468ff;--docsearch-modal-width:560px;--docsearch-modal-height:600px;--docsearch-modal-background:#f5f6f7;--docsearch-modal-shadow:inset 1px 1px 0 0 hsla(0,0%,100%,.5),0 3px 8px 0 #555a64;--docsearch-searchbox-height:56px;--docsearch-searchbox-background:#ebedf0;--docsearch-searchbox-focus-background:#fff;--docsearch-searchbox-shadow:inset 0 0 0 2px var(--docsearch-primary-color);--docsearch-hit-height:56px;--docsearch-hit-color:#444950;--docsearch-hit-active-color:#fff;--docsearch-hit-background:#fff;--docsearch-hit-shadow:0 1px 3px 0 #d4d9e1;--docsearch-key-gradient:linear-gradient(-225deg,#d5dbe4,#f8f8f8);--docsearch-key-shadow:inset 0 -2px 0 0 #cdcde6,inset 0 0 1px 1px #fff,0 1px 2px 1px rgba(30,35,90,.4);--docsearch-footer-height:44px;--docsearch-footer-background:#fff;--docsearch-footer-shadow:0 -1px 0 0 #e0e3e8,0 -3px 6px 0 rgba(69,98,155,.12)}html[data-theme=dark]{--docsearch-text-color:#f5f6f7;--docsearch-container-background:rgba(9,10,17,.8);--docsearch-modal-background:#15172a;--docsearch-modal-shadow:inset 1px 1px 0 0 #2c2e40,0 3px 8px 0 #000309;--docsearch-searchbox-background:#090a11;--docsearch-searchbox-focus-background:#000;--docsearch-hit-color:#bec3c9;--docsearch-hit-shadow:none;--docsearch-hit-background:#090a11;--docsearch-key-gradient:linear-gradient(-26.5deg,#565872,#31355b);--docsearch-key-shadow:inset 0 -2px 0 0 #282d55,inset 0 0 1px 1px #51577d,0 2px 2px 0 rgba(3,4,9,.3);--docsearch-footer-background:#1e2136;--docsearch-footer-shadow:inset 0 1px 0 0 rgba(73,76,106,.5),0 -4px 8px 0 rgba(0,0,0,.2);--docsearch-logo-color:#fff;--docsearch-muted-color:#7f8497}.DocSearch-Button{align-items:center;background:var(--docsearch-searchbox-background);border:0;border-radius:40px;color:var(--docsearch-muted-color);cursor:pointer;display:flex;font-weight:500;height:36px;justify-content:space-between;margin:0 0 0 16px;padding:0 8px;-webkit-user-select:none;user-select:none}.DocSearch-Button:active,.DocSearch-Button:focus,.DocSearch-Button:hover{background:var(--docsearch-searchbox-focus-background);box-shadow:var(--docsearch-searchbox-shadow);color:var(--docsearch-text-color);outline:none}.DocSearch-Button-Container{align-items:center;display:flex}.DocSearch-Search-Icon{stroke-width:1.6}.DocSearch-Button .DocSearch-Search-Icon{color:var(--docsearch-text-color)}.DocSearch-Button-Placeholder{font-size:1rem;padding:0 12px 0 6px}.DocSearch-Button-Keys{display:flex;min-width:calc(40px + .8em)}.DocSearch-Button-Key{align-items:center;background:var(--docsearch-key-gradient);border-radius:3px;box-shadow:var(--docsearch-key-shadow);color:var(--docsearch-muted-color);display:flex;height:18px;justify-content:center;margin-right:.4em;position:relative;padding:0 0 2px;border:0;top:-1px;width:20px}@media (max-width:768px){.DocSearch-Button-Keys,.DocSearch-Button-Placeholder{display:none}}.DocSearch--active{overflow:hidden!important}.DocSearch-Container,.DocSearch-Container *{box-sizing:border-box}.DocSearch-Container{background-color:var(--docsearch-container-background);height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:200}.DocSearch-Container a{text-decoration:none}.DocSearch-Link{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;color:var(--docsearch-highlight-color);cursor:pointer;font:inherit;margin:0;padding:0}.DocSearch-Modal{background:var(--docsearch-modal-background);border-radius:6px;box-shadow:var(--docsearch-modal-shadow);flex-direction:column;margin:60px auto auto;max-width:var(--docsearch-modal-width);position:relative}.DocSearch-SearchBar{display:flex;padding:var(--docsearch-spacing) var(--docsearch-spacing) 0}.DocSearch-Form{align-items:center;background:var(--docsearch-searchbox-focus-background);border-radius:4px;box-shadow:var(--docsearch-searchbox-shadow);display:flex;height:var(--docsearch-searchbox-height);margin:0;padding:0 var(--docsearch-spacing);position:relative;width:100%}.DocSearch-Input{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;color:var(--docsearch-text-color);flex:1;font:inherit;font-size:1.2em;height:100%;outline:none;padding:0 0 0 8px;width:80%}.DocSearch-Input::placeholder{color:var(--docsearch-muted-color);opacity:1}.DocSearch-Input::-webkit-search-cancel-button,.DocSearch-Input::-webkit-search-decoration,.DocSearch-Input::-webkit-search-results-button,.DocSearch-Input::-webkit-search-results-decoration{display:none}.DocSearch-LoadingIndicator,.DocSearch-MagnifierLabel,.DocSearch-Reset{margin:0;padding:0}.DocSearch-MagnifierLabel,.DocSearch-Reset{align-items:center;color:var(--docsearch-highlight-color);display:flex;justify-content:center}.DocSearch-Container--Stalled .DocSearch-MagnifierLabel,.DocSearch-LoadingIndicator{display:none}.DocSearch-Container--Stalled .DocSearch-LoadingIndicator{align-items:center;color:var(--docsearch-highlight-color);display:flex;justify-content:center}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Reset{animation:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;right:0;stroke-width:var(--docsearch-icon-stroke-width)}}.DocSearch-Reset{animation:fade-in .1s ease-in forwards;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:50%;color:var(--docsearch-icon-color);cursor:pointer;padding:2px;right:0;stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Reset[hidden]{display:none}.DocSearch-Reset:hover{color:var(--docsearch-highlight-color)}.DocSearch-LoadingIndicator svg,.DocSearch-MagnifierLabel svg{height:24px;width:24px}.DocSearch-Cancel{display:none}.DocSearch-Dropdown{max-height:calc(var(--docsearch-modal-height) - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height));min-height:var(--docsearch-spacing);overflow-y:auto;overflow-y:overlay;padding:0 var(--docsearch-spacing);scrollbar-color:var(--docsearch-muted-color) var(--docsearch-modal-background);scrollbar-width:thin}.DocSearch-Dropdown::-webkit-scrollbar{width:12px}.DocSearch-Dropdown::-webkit-scrollbar-track{background:transparent}.DocSearch-Dropdown::-webkit-scrollbar-thumb{background-color:var(--docsearch-muted-color);border:3px solid var(--docsearch-modal-background);border-radius:20px}.DocSearch-Dropdown ul{list-style:none;margin:0;padding:0}.DocSearch-Label{font-size:.75em;line-height:1.6em}.DocSearch-Help,.DocSearch-Label{color:var(--docsearch-muted-color)}.DocSearch-Help{font-size:.9em;margin:0;-webkit-user-select:none;user-select:none}.DocSearch-Title{font-size:1.2em}.DocSearch-Logo a{display:flex}.DocSearch-Logo svg{color:var(--docsearch-logo-color);margin-left:8px}.DocSearch-Hits:last-of-type{margin-bottom:24px}.DocSearch-Hits mark{background:none;color:var(--docsearch-highlight-color)}.DocSearch-HitsFooter{color:var(--docsearch-muted-color);display:flex;font-size:.85em;justify-content:center;margin-bottom:var(--docsearch-spacing);padding:var(--docsearch-spacing)}.DocSearch-HitsFooter a{border-bottom:1px solid;color:inherit}.DocSearch-Hit{border-radius:4px;display:flex;padding-bottom:4px;position:relative}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit--deleting{transition:none}}.DocSearch-Hit--deleting{opacity:0;transition:all .25s linear}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit--favoriting{transition:none}}.DocSearch-Hit--favoriting{transform:scale(0);transform-origin:top center;transition:all .25s linear;transition-delay:.25s}.DocSearch-Hit a{background:var(--docsearch-hit-background);border-radius:4px;box-shadow:var(--docsearch-hit-shadow);display:block;padding-left:var(--docsearch-spacing);width:100%}.DocSearch-Hit-source{background:var(--docsearch-modal-background);color:var(--docsearch-highlight-color);font-size:.85em;font-weight:600;line-height:32px;margin:0 -4px;padding:8px 4px 0;position:sticky;top:0;z-index:10}.DocSearch-Hit-Tree{color:var(--docsearch-muted-color);height:var(--docsearch-hit-height);opacity:.5;stroke-width:var(--docsearch-icon-stroke-width);width:24px}.DocSearch-Hit[aria-selected=true] a{background-color:var(--docsearch-highlight-color)}.DocSearch-Hit[aria-selected=true] mark{text-decoration:underline}.DocSearch-Hit-Container{align-items:center;color:var(--docsearch-hit-color);display:flex;flex-direction:row;height:var(--docsearch-hit-height);padding:0 var(--docsearch-spacing) 0 0}.DocSearch-Hit-icon{height:20px;width:20px}.DocSearch-Hit-action,.DocSearch-Hit-icon{color:var(--docsearch-muted-color);stroke-width:var(--docsearch-icon-stroke-width)}.DocSearch-Hit-action{align-items:center;display:flex;height:22px;width:22px}.DocSearch-Hit-action svg{display:block;height:18px;width:18px}.DocSearch-Hit-action+.DocSearch-Hit-action{margin-left:6px}.DocSearch-Hit-action-button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:50%;color:inherit;cursor:pointer;padding:2px}svg.DocSearch-Hit-Select-Icon{display:none}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Select-Icon{display:block}.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:background-color .1s ease-in}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{transition:none}}.DocSearch-Hit-action-button:focus path,.DocSearch-Hit-action-button:hover path{fill:#fff}.DocSearch-Hit-content-wrapper{display:flex;flex:1 1 auto;flex-direction:column;font-weight:500;justify-content:center;line-height:1.2em;margin:0 8px;overflow-x:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;width:80%}.DocSearch-Hit-title{font-size:.9em}.DocSearch-Hit-path{color:var(--docsearch-muted-color);font-size:.75em}.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-action,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-icon,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-path,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-text,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-title,.DocSearch-Hit[aria-selected=true] .DocSearch-Hit-Tree,.DocSearch-Hit[aria-selected=true] mark{color:var(--docsearch-hit-active-color)!important}@media screen and (prefers-reduced-motion:reduce){.DocSearch-Hit-action-button:focus,.DocSearch-Hit-action-button:hover{background:rgba(0,0,0,.2);transition:none}}.DocSearch-ErrorScreen,.DocSearch-NoResults,.DocSearch-StartScreen{font-size:.9em;margin:0 auto;padding:36px 0;text-align:center;width:80%}.DocSearch-Screen-Icon{color:var(--docsearch-muted-color);padding-bottom:12px}.DocSearch-NoResults-Prefill-List{display:inline-block;padding-bottom:24px;text-align:left}.DocSearch-NoResults-Prefill-List ul{display:inline-block;padding:8px 0 0}.DocSearch-NoResults-Prefill-List li{list-style-position:inside;list-style-type:"» "}.DocSearch-Prefill{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;border-radius:1em;color:var(--docsearch-highlight-color);cursor:pointer;display:inline-block;font-size:1em;font-weight:700;padding:0}.DocSearch-Prefill:focus,.DocSearch-Prefill:hover{outline:none;text-decoration:underline}.DocSearch-Footer{align-items:center;background:var(--docsearch-footer-background);border-radius:0 0 8px 8px;box-shadow:var(--docsearch-footer-shadow);display:flex;flex-direction:row-reverse;flex-shrink:0;height:var(--docsearch-footer-height);justify-content:space-between;padding:0 var(--docsearch-spacing);position:relative;-webkit-user-select:none;user-select:none;width:100%;z-index:300}.DocSearch-Commands{color:var(--docsearch-muted-color);display:flex;list-style:none;margin:0;padding:0}.DocSearch-Commands li{align-items:center;display:flex}.DocSearch-Commands li:not(:last-of-type){margin-right:.8em}.DocSearch-Commands-Key{align-items:center;background:var(--docsearch-key-gradient);border-radius:2px;box-shadow:var(--docsearch-key-shadow);display:flex;height:18px;justify-content:center;margin-right:.4em;padding:0 0 1px;color:var(--docsearch-muted-color);border:0;width:20px}@media (max-width:768px){:root{--docsearch-spacing:10px;--docsearch-footer-height:40px}.DocSearch-Dropdown{height:100%}.DocSearch-Container{height:100vh;height:-webkit-fill-available;height:calc(var(--docsearch-vh, 1vh)*100);position:absolute}.DocSearch-Footer{border-radius:0;bottom:0;position:absolute}.DocSearch-Hit-content-wrapper{display:flex;position:relative;width:80%}.DocSearch-Modal{border-radius:0;box-shadow:none;height:100vh;height:-webkit-fill-available;height:calc(var(--docsearch-vh, 1vh)*100);margin:0;max-width:100%;width:100%}.DocSearch-Dropdown{max-height:calc(var(--docsearch-vh, 1vh)*100 - var(--docsearch-searchbox-height) - var(--docsearch-spacing) - var(--docsearch-footer-height))}.DocSearch-Cancel{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;color:var(--docsearch-highlight-color);cursor:pointer;display:inline-block;flex:none;font:inherit;font-size:1em;font-weight:500;margin-left:var(--docsearch-spacing);outline:none;overflow:hidden;padding:0;-webkit-user-select:none;user-select:none;white-space:nowrap}.DocSearch-Commands,.DocSearch-Hit-Tree{display:none}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}[class*=DocSearch]{--docsearch-primary-color: var(--vp-c-brand-1);--docsearch-highlight-color: var(--docsearch-primary-color);--docsearch-text-color: var(--vp-c-text-1);--docsearch-muted-color: var(--vp-c-text-2);--docsearch-searchbox-shadow: none;--docsearch-searchbox-background: transparent;--docsearch-searchbox-focus-background: transparent;--docsearch-key-gradient: transparent;--docsearch-key-shadow: none;--docsearch-modal-background: var(--vp-c-bg-soft);--docsearch-footer-background: var(--vp-c-bg)}.dark [class*=DocSearch]{--docsearch-modal-shadow: none;--docsearch-footer-shadow: none;--docsearch-logo-color: var(--vp-c-text-2);--docsearch-hit-background: var(--vp-c-default-soft);--docsearch-hit-color: var(--vp-c-text-2);--docsearch-hit-shadow: none}.DocSearch-Button{display:flex;justify-content:center;align-items:center;margin:0;padding:0;width:48px;height:55px;background:transparent;transition:border-color .25s}.DocSearch-Button:hover{background:transparent}.DocSearch-Button:focus{outline:1px dotted;outline:5px auto -webkit-focus-ring-color}.DocSearch-Button:focus:not(:focus-visible){outline:none!important}@media (min-width: 768px){.DocSearch-Button{justify-content:flex-start;border:1px solid transparent;border-radius:8px;padding:0 10px 0 12px;width:100%;height:40px;background-color:var(--vp-c-bg-alt)}.DocSearch-Button:hover{border-color:var(--vp-c-brand-1);background:var(--vp-c-bg-alt)}}.DocSearch-Button .DocSearch-Button-Container{display:flex;align-items:center}.DocSearch-Button .DocSearch-Search-Icon{position:relative;width:16px;height:16px;color:var(--vp-c-text-1);fill:currentColor;transition:color .5s}.DocSearch-Button:hover .DocSearch-Search-Icon{color:var(--vp-c-text-1)}@media (min-width: 768px){.DocSearch-Button .DocSearch-Search-Icon{top:1px;margin-right:8px;width:14px;height:14px;color:var(--vp-c-text-2)}}.DocSearch-Button .DocSearch-Button-Placeholder{display:none;margin-top:2px;padding:0 16px 0 0;font-size:13px;font-weight:500;color:var(--vp-c-text-2);transition:color .5s}.DocSearch-Button:hover .DocSearch-Button-Placeholder{color:var(--vp-c-text-1)}@media (min-width: 768px){.DocSearch-Button .DocSearch-Button-Placeholder{display:inline-block}}.DocSearch-Button .DocSearch-Button-Keys{direction:ltr;display:none;min-width:auto}@media (min-width: 768px){.DocSearch-Button .DocSearch-Button-Keys{display:flex;align-items:center}}.DocSearch-Button .DocSearch-Button-Key{display:block;margin:2px 0 0;border:1px solid var(--vp-c-divider);border-right:none;border-radius:4px 0 0 4px;padding-left:6px;min-width:0;width:auto;height:22px;line-height:22px;font-family:var(--vp-font-family-base);font-size:12px;font-weight:500;transition:color .5s,border-color .5s}.DocSearch-Button .DocSearch-Button-Key+.DocSearch-Button-Key{border-right:1px solid var(--vp-c-divider);border-left:none;border-radius:0 4px 4px 0;padding-left:2px;padding-right:6px}.DocSearch-Button .DocSearch-Button-Key:first-child{font-size:0!important}.DocSearch-Button .DocSearch-Button-Key:first-child:after{content:"Ctrl";font-size:12px;letter-spacing:normal;color:var(--docsearch-muted-color)}.mac .DocSearch-Button .DocSearch-Button-Key:first-child:after{content:"⌘"}.DocSearch-Button .DocSearch-Button-Key:first-child>*{display:none}.VPNavBarSearch{display:flex;align-items:center}@media (min-width: 768px){.VPNavBarSearch{flex-grow:1;padding-left:24px}}@media (min-width: 960px){.VPNavBarSearch{padding-left:32px}}.dark .DocSearch-Footer{border-top:1px solid var(--vp-c-divider)}.DocSearch-Form{border:1px solid var(--vp-c-brand-1);background-color:var(--vp-c-white)}.dark .DocSearch-Form{background-color:var(--vp-c-default-soft)}.DocSearch-Screen-Icon>svg{margin:auto}.VPNavBarSocialLinks[data-v-0394ad82]{display:none}@media (min-width: 1280px){.VPNavBarSocialLinks[data-v-0394ad82]{display:flex;align-items:center}}.title[data-v-86d1bed8]{display:flex;align-items:center;border-bottom:1px solid transparent;width:100%;height:var(--vp-nav-height);font-size:16px;font-weight:600;color:var(--vp-c-text-1);transition:opacity .25s}@media (min-width: 960px){.title[data-v-86d1bed8]{flex-shrink:0}.VPNavBarTitle.has-sidebar .title[data-v-86d1bed8]{border-bottom-color:var(--vp-c-divider)}}[data-v-86d1bed8] .logo{margin-right:8px;height:var(--vp-nav-logo-height)}.VPNavBarTranslations[data-v-74abcbb9]{display:none}@media (min-width: 1280px){.VPNavBarTranslations[data-v-74abcbb9]{display:flex;align-items:center}}.title[data-v-74abcbb9]{padding:0 24px 0 12px;line-height:32px;font-size:14px;font-weight:700;color:var(--vp-c-text-1)}.VPNavBar[data-v-a0fd61f4]{position:relative;border-bottom:1px solid transparent;padding:0 8px 0 24px;height:var(--vp-nav-height);pointer-events:none;white-space:nowrap}@media (min-width: 768px){.VPNavBar[data-v-a0fd61f4]{padding:0 32px}}@media (min-width: 960px){.VPNavBar.has-sidebar[data-v-a0fd61f4]{padding:0}.VPNavBar[data-v-a0fd61f4]:not(.has-sidebar):not(.top){border-bottom-color:var(--vp-c-gutter);background-color:var(--vp-nav-bg-color)}}.container[data-v-a0fd61f4]{display:flex;justify-content:space-between;margin:0 auto;max-width:calc(var(--vp-layout-max-width) - 64px);height:var(--vp-nav-height);pointer-events:none}.container>.title[data-v-a0fd61f4],.container>.content[data-v-a0fd61f4]{pointer-events:none}.container[data-v-a0fd61f4] *{pointer-events:auto}@media (min-width: 960px){.VPNavBar.has-sidebar .container[data-v-a0fd61f4]{max-width:100%}}.title[data-v-a0fd61f4]{flex-shrink:0;height:calc(var(--vp-nav-height) - 1px);transition:background-color .5s}@media (min-width: 960px){.VPNavBar.has-sidebar .title[data-v-a0fd61f4]{position:absolute;top:0;left:0;z-index:2;padding:0 32px;width:var(--vp-sidebar-width);height:var(--vp-nav-height);background-color:transparent}}@media (min-width: 1440px){.VPNavBar.has-sidebar .title[data-v-a0fd61f4]{padding-left:max(32px,calc((100% - (var(--vp-layout-max-width) - 64px)) / 2));width:calc((100% - (var(--vp-layout-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px)}}.content[data-v-a0fd61f4]{flex-grow:1}@media (min-width: 960px){.VPNavBar.has-sidebar .content[data-v-a0fd61f4]{position:relative;z-index:1;padding-right:32px;padding-left:var(--vp-sidebar-width)}}@media (min-width: 1440px){.VPNavBar.has-sidebar .content[data-v-a0fd61f4]{padding-right:calc((100vw - var(--vp-layout-max-width)) / 2 + 32px);padding-left:calc((100vw - var(--vp-layout-max-width)) / 2 + var(--vp-sidebar-width))}}.content-body[data-v-a0fd61f4]{display:flex;justify-content:flex-end;align-items:center;height:calc(var(--vp-nav-height) - 1px);transition:background-color .5s}@media (min-width: 960px){.VPNavBar:not(.top) .content-body[data-v-a0fd61f4]{position:relative;background-color:var(--vp-nav-bg-color)}}@media (max-width: 767px){.content-body[data-v-a0fd61f4]{column-gap:.5rem}}.menu+.translations[data-v-a0fd61f4]:before,.menu+.appearance[data-v-a0fd61f4]:before,.menu+.social-links[data-v-a0fd61f4]:before,.translations+.appearance[data-v-a0fd61f4]:before,.appearance+.social-links[data-v-a0fd61f4]:before{margin-right:8px;margin-left:8px;width:1px;height:24px;background-color:var(--vp-c-divider);content:""}.menu+.appearance[data-v-a0fd61f4]:before,.translations+.appearance[data-v-a0fd61f4]:before{margin-right:16px}.appearance+.social-links[data-v-a0fd61f4]:before{margin-left:16px}.social-links[data-v-a0fd61f4]{margin-right:-8px}@media (min-width: 960px){.VPNavBar.has-sidebar .curtain[data-v-a0fd61f4]{position:absolute;right:0;bottom:-31px;width:calc(100% - var(--vp-sidebar-width));height:32px}.VPNavBar.has-sidebar .curtain[data-v-a0fd61f4]:before{display:block;width:100%;height:32px;background:linear-gradient(var(--vp-c-bg),transparent 70%);content:""}}@media (min-width: 1440px){.VPNavBar.has-sidebar .curtain[data-v-a0fd61f4]{width:calc(100% - ((100vw - var(--vp-layout-max-width)) / 2 + var(--vp-sidebar-width)))}}.VPNavScreenAppearance[data-v-add8f686]{display:flex;justify-content:space-between;align-items:center;border-radius:8px;padding:12px 14px 12px 16px;background-color:var(--vp-c-bg-soft)}.text[data-v-add8f686]{line-height:24px;font-size:12px;font-weight:500;color:var(--vp-c-text-2)}.VPNavScreenMenuLink[data-v-05f27b2a]{display:block;border-bottom:1px solid var(--vp-c-divider);padding:12px 0 11px;line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-1);transition:border-color .25s,color .25s}.VPNavScreenMenuLink[data-v-05f27b2a]:hover{color:var(--vp-c-brand-1)}.VPNavScreenMenuGroupLink[data-v-19976ae1]{display:block;margin-left:12px;line-height:32px;font-size:14px;font-weight:400;color:var(--vp-c-text-1);transition:color .25s}.VPNavScreenMenuGroupLink[data-v-19976ae1]:hover{color:var(--vp-c-brand-1)}.VPNavScreenMenuGroupSection[data-v-8133b170]{display:block}.title[data-v-8133b170]{line-height:32px;font-size:13px;font-weight:700;color:var(--vp-c-text-2);transition:color .25s}.VPNavScreenMenuGroup[data-v-1ecb84e7]{border-bottom:1px solid var(--vp-c-divider);height:48px;overflow:hidden;transition:border-color .5s}.VPNavScreenMenuGroup .items[data-v-1ecb84e7]{visibility:hidden}.VPNavScreenMenuGroup.open .items[data-v-1ecb84e7]{visibility:visible}.VPNavScreenMenuGroup.open[data-v-1ecb84e7]{padding-bottom:10px;height:auto}.VPNavScreenMenuGroup.open .button[data-v-1ecb84e7]{padding-bottom:6px;color:var(--vp-c-brand-1)}.VPNavScreenMenuGroup.open .button-icon[data-v-1ecb84e7]{transform:rotate(45deg)}.button[data-v-1ecb84e7]{display:flex;justify-content:space-between;align-items:center;padding:12px 4px 11px 0;width:100%;line-height:24px;font-size:14px;font-weight:500;color:var(--vp-c-text-1);transition:color .25s}.button[data-v-1ecb84e7]:hover{color:var(--vp-c-brand-1)}.button-icon[data-v-1ecb84e7]{width:14px;height:14px;fill:var(--vp-c-text-2);transition:fill .5s,transform .25s}.group[data-v-1ecb84e7]:first-child{padding-top:0}.group+.group[data-v-1ecb84e7],.group+.item[data-v-1ecb84e7]{padding-top:4px}.VPNavScreenTranslations[data-v-d72aa483]{height:24px;overflow:hidden}.VPNavScreenTranslations.open[data-v-d72aa483]{height:auto}.title[data-v-d72aa483]{display:flex;align-items:center;font-size:14px;font-weight:500;color:var(--vp-c-text-1)}.icon[data-v-d72aa483]{width:16px;height:16px;fill:currentColor}.icon.lang[data-v-d72aa483]{margin-right:8px}.icon.chevron[data-v-d72aa483]{margin-left:4px}.list[data-v-d72aa483]{padding:4px 0 0 24px}.link[data-v-d72aa483]{line-height:32px;font-size:13px;color:var(--vp-c-text-1)}.VPNavScreen[data-v-cc5739dd]{position:fixed;top:calc(var(--vp-nav-height) + var(--vp-layout-top-height, 0px) + 1px);right:0;bottom:0;left:0;padding:0 32px;width:100%;background-color:var(--vp-nav-screen-bg-color);overflow-y:auto;transition:background-color .5s;pointer-events:auto}.VPNavScreen.fade-enter-active[data-v-cc5739dd],.VPNavScreen.fade-leave-active[data-v-cc5739dd]{transition:opacity .25s}.VPNavScreen.fade-enter-active .container[data-v-cc5739dd],.VPNavScreen.fade-leave-active .container[data-v-cc5739dd]{transition:transform .25s ease}.VPNavScreen.fade-enter-from[data-v-cc5739dd],.VPNavScreen.fade-leave-to[data-v-cc5739dd]{opacity:0}.VPNavScreen.fade-enter-from .container[data-v-cc5739dd],.VPNavScreen.fade-leave-to .container[data-v-cc5739dd]{transform:translateY(-8px)}@media (min-width: 768px){.VPNavScreen[data-v-cc5739dd]{display:none}}.container[data-v-cc5739dd]{margin:0 auto;padding:24px 0 96px;max-width:288px}.menu+.translations[data-v-cc5739dd],.menu+.appearance[data-v-cc5739dd],.translations+.appearance[data-v-cc5739dd]{margin-top:24px}.menu+.social-links[data-v-cc5739dd]{margin-top:16px}.appearance+.social-links[data-v-cc5739dd]{margin-top:16px}.VPNav[data-v-ae24b3ad]{position:relative;top:var(--vp-layout-top-height, 0px);left:0;z-index:var(--vp-z-index-nav);width:100%;pointer-events:none;transition:background-color .5s}@media (min-width: 960px){.VPNav[data-v-ae24b3ad]{position:fixed}}.VPSidebarItem.level-0[data-v-e31bd47b]{padding-bottom:24px}.VPSidebarItem.collapsed.level-0[data-v-e31bd47b]{padding-bottom:10px}.item[data-v-e31bd47b]{position:relative;display:flex;width:100%}.VPSidebarItem.collapsible>.item[data-v-e31bd47b]{cursor:pointer}.indicator[data-v-e31bd47b]{position:absolute;top:6px;bottom:6px;left:-17px;width:2px;border-radius:2px;transition:background-color .25s}.VPSidebarItem.level-2.is-active>.item>.indicator[data-v-e31bd47b],.VPSidebarItem.level-3.is-active>.item>.indicator[data-v-e31bd47b],.VPSidebarItem.level-4.is-active>.item>.indicator[data-v-e31bd47b],.VPSidebarItem.level-5.is-active>.item>.indicator[data-v-e31bd47b]{background-color:var(--vp-c-brand-1)}.link[data-v-e31bd47b]{display:flex;align-items:center;flex-grow:1}.text[data-v-e31bd47b]{flex-grow:1;padding:4px 0;line-height:24px;font-size:14px;transition:color .25s}.VPSidebarItem.level-0 .text[data-v-e31bd47b]{font-weight:700;color:var(--vp-c-text-1)}.VPSidebarItem.level-1 .text[data-v-e31bd47b],.VPSidebarItem.level-2 .text[data-v-e31bd47b],.VPSidebarItem.level-3 .text[data-v-e31bd47b],.VPSidebarItem.level-4 .text[data-v-e31bd47b],.VPSidebarItem.level-5 .text[data-v-e31bd47b]{font-weight:500;color:var(--vp-c-text-2)}.VPSidebarItem.level-0.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-1.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-2.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-3.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-4.is-link>.item>.link:hover .text[data-v-e31bd47b],.VPSidebarItem.level-5.is-link>.item>.link:hover .text[data-v-e31bd47b]{color:var(--vp-c-brand-1)}.VPSidebarItem.level-0.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-1.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-2.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-3.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-4.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-5.has-active>.item>.text[data-v-e31bd47b],.VPSidebarItem.level-0.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-1.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-2.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-3.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-4.has-active>.item>.link>.text[data-v-e31bd47b],.VPSidebarItem.level-5.has-active>.item>.link>.text[data-v-e31bd47b]{color:var(--vp-c-text-1)}.VPSidebarItem.level-0.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-1.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-2.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-3.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-4.is-active>.item .link>.text[data-v-e31bd47b],.VPSidebarItem.level-5.is-active>.item .link>.text[data-v-e31bd47b]{color:var(--vp-c-brand-1)}.caret[data-v-e31bd47b]{display:flex;justify-content:center;align-items:center;margin-right:-7px;width:32px;height:32px;color:var(--vp-c-text-3);cursor:pointer;transition:color .25s;flex-shrink:0}.item:hover .caret[data-v-e31bd47b]{color:var(--vp-c-text-2)}.item:hover .caret[data-v-e31bd47b]:hover{color:var(--vp-c-text-1)}.caret-icon[data-v-e31bd47b]{width:18px;height:18px;fill:currentColor;transform:rotate(90deg);transition:transform .25s}.VPSidebarItem.collapsed .caret-icon[data-v-e31bd47b]{transform:rotate(0)}.VPSidebarItem.level-1 .items[data-v-e31bd47b],.VPSidebarItem.level-2 .items[data-v-e31bd47b],.VPSidebarItem.level-3 .items[data-v-e31bd47b],.VPSidebarItem.level-4 .items[data-v-e31bd47b],.VPSidebarItem.level-5 .items[data-v-e31bd47b]{border-left:1px solid var(--vp-c-divider);padding-left:16px}.VPSidebarItem.collapsed .items[data-v-e31bd47b]{display:none}.VPSidebar[data-v-b00e2fdd]{position:fixed;top:var(--vp-layout-top-height, 0px);bottom:0;left:0;z-index:var(--vp-z-index-sidebar);padding:32px 32px 96px;width:calc(100vw - 64px);max-width:320px;background-color:var(--vp-sidebar-bg-color);opacity:0;box-shadow:var(--vp-c-shadow-3);overflow-x:hidden;overflow-y:auto;transform:translate(-100%);transition:opacity .5s,transform .25s ease;overscroll-behavior:contain}.VPSidebar.open[data-v-b00e2fdd]{opacity:1;visibility:visible;transform:translate(0);transition:opacity .25s,transform .5s cubic-bezier(.19,1,.22,1)}.dark .VPSidebar[data-v-b00e2fdd]{box-shadow:var(--vp-shadow-1)}@media (min-width: 960px){.VPSidebar[data-v-b00e2fdd]{z-index:1;padding-top:var(--vp-nav-height);padding-bottom:128px;width:var(--vp-sidebar-width);max-width:100%;background-color:var(--vp-sidebar-bg-color);opacity:1;visibility:visible;box-shadow:none;transform:translate(0)}}@media (min-width: 1440px){.VPSidebar[data-v-b00e2fdd]{padding-left:max(32px,calc((100% - (var(--vp-layout-max-width) - 64px)) / 2));width:calc((100% - (var(--vp-layout-max-width) - 64px)) / 2 + var(--vp-sidebar-width) - 32px)}}@media (min-width: 960px){.curtain[data-v-b00e2fdd]{position:sticky;top:-64px;left:0;z-index:1;margin-top:calc(var(--vp-nav-height) * -1);margin-right:-32px;margin-left:-32px;height:var(--vp-nav-height);background-color:var(--vp-sidebar-bg-color)}}.nav[data-v-b00e2fdd]{outline:0}.group+.group[data-v-b00e2fdd]{border-top:1px solid var(--vp-c-divider);padding-top:10px}@media (min-width: 960px){.group[data-v-b00e2fdd]{padding-top:10px;width:calc(var(--vp-sidebar-width) - 64px)}}.VPSkipLink[data-v-0f60ec36]{top:8px;left:8px;padding:8px 16px;z-index:999;border-radius:8px;font-size:12px;font-weight:700;text-decoration:none;color:var(--vp-c-brand-1);box-shadow:var(--vp-shadow-3);background-color:var(--vp-c-bg)}.VPSkipLink[data-v-0f60ec36]:focus{height:auto;width:auto;clip:auto;clip-path:none}@media (min-width: 1280px){.VPSkipLink[data-v-0f60ec36]{top:14px;left:16px}}.Layout[data-v-5a346dfe]{display:flex;flex-direction:column;min-height:100vh}.VPHomeSponsors[data-v-96bd69d5]{border-top:1px solid var(--vp-c-gutter);padding:88px 24px 96px;background-color:var(--vp-c-bg)}.container[data-v-96bd69d5]{margin:0 auto;max-width:1152px}.love[data-v-96bd69d5]{margin:0 auto;width:28px;height:28px;color:var(--vp-c-text-3)}.icon[data-v-96bd69d5]{width:28px;height:28px;fill:currentColor}.message[data-v-96bd69d5]{margin:0 auto;padding-top:10px;max-width:320px;text-align:center;line-height:24px;font-size:16px;font-weight:500;color:var(--vp-c-text-2)}.sponsors[data-v-96bd69d5]{padding-top:32px}.action[data-v-96bd69d5]{padding-top:40px;text-align:center}.VPTeamPage[data-v-10b00018]{padding-bottom:96px}@media (min-width: 768px){.VPTeamPage[data-v-10b00018]{padding-bottom:128px}}.VPTeamPageSection+.VPTeamPageSection[data-v-10b00018-s],.VPTeamMembers+.VPTeamPageSection[data-v-10b00018-s]{margin-top:64px}.VPTeamMembers+.VPTeamMembers[data-v-10b00018-s]{margin-top:24px}@media (min-width: 768px){.VPTeamPageTitle+.VPTeamPageSection[data-v-10b00018-s]{margin-top:16px}.VPTeamPageSection+.VPTeamPageSection[data-v-10b00018-s],.VPTeamMembers+.VPTeamPageSection[data-v-10b00018-s]{margin-top:96px}}.VPTeamMembers[data-v-10b00018-s]{padding:0 24px}@media (min-width: 768px){.VPTeamMembers[data-v-10b00018-s]{padding:0 48px}}@media (min-width: 960px){.VPTeamMembers[data-v-10b00018-s]{padding:0 64px}}.VPTeamPageTitle[data-v-bf2cbdac]{padding:48px 32px;text-align:center}@media (min-width: 768px){.VPTeamPageTitle[data-v-bf2cbdac]{padding:64px 48px 48px}}@media (min-width: 960px){.VPTeamPageTitle[data-v-bf2cbdac]{padding:80px 64px 48px}}.title[data-v-bf2cbdac]{letter-spacing:0;line-height:44px;font-size:36px;font-weight:500}@media (min-width: 768px){.title[data-v-bf2cbdac]{letter-spacing:-.5px;line-height:56px;font-size:48px}}.lead[data-v-bf2cbdac]{margin:0 auto;max-width:512px;padding-top:12px;line-height:24px;font-size:16px;font-weight:500;color:var(--vp-c-text-2)}@media (min-width: 768px){.lead[data-v-bf2cbdac]{max-width:592px;letter-spacing:.15px;line-height:28px;font-size:20px}}.VPTeamPageSection[data-v-b1a88750]{padding:0 32px}@media (min-width: 768px){.VPTeamPageSection[data-v-b1a88750]{padding:0 48px}}@media (min-width: 960px){.VPTeamPageSection[data-v-b1a88750]{padding:0 64px}}.title[data-v-b1a88750]{position:relative;margin:0 auto;max-width:1152px;text-align:center;color:var(--vp-c-text-2)}.title-line[data-v-b1a88750]{position:absolute;top:16px;left:0;width:100%;height:1px;background-color:var(--vp-c-divider)}.title-text[data-v-b1a88750]{position:relative;display:inline-block;padding:0 24px;letter-spacing:0;line-height:32px;font-size:20px;font-weight:500;background-color:var(--vp-c-bg)}.lead[data-v-b1a88750]{margin:0 auto;max-width:480px;padding-top:12px;text-align:center;line-height:24px;font-size:16px;font-weight:500;color:var(--vp-c-text-2)}.members[data-v-b1a88750]{padding-top:40px}.VPTeamMembersItem[data-v-28528e42]{display:flex;flex-direction:column;gap:2px;border-radius:12px;width:100%;height:100%;overflow:hidden}.VPTeamMembersItem.small .profile[data-v-28528e42]{padding:32px}.VPTeamMembersItem.small .data[data-v-28528e42]{padding-top:20px}.VPTeamMembersItem.small .avatar[data-v-28528e42]{width:64px;height:64px}.VPTeamMembersItem.small .name[data-v-28528e42]{line-height:24px;font-size:16px}.VPTeamMembersItem.small .affiliation[data-v-28528e42]{padding-top:4px;line-height:20px;font-size:14px}.VPTeamMembersItem.small .desc[data-v-28528e42]{padding-top:12px;line-height:20px;font-size:14px}.VPTeamMembersItem.small .links[data-v-28528e42]{margin:0 -16px -20px;padding:10px 0 0}.VPTeamMembersItem.medium .profile[data-v-28528e42]{padding:48px 32px}.VPTeamMembersItem.medium .data[data-v-28528e42]{padding-top:24px;text-align:center}.VPTeamMembersItem.medium .avatar[data-v-28528e42]{width:96px;height:96px}.VPTeamMembersItem.medium .name[data-v-28528e42]{letter-spacing:.15px;line-height:28px;font-size:20px}.VPTeamMembersItem.medium .affiliation[data-v-28528e42]{padding-top:4px;font-size:16px}.VPTeamMembersItem.medium .desc[data-v-28528e42]{padding-top:16px;max-width:288px;font-size:16px}.VPTeamMembersItem.medium .links[data-v-28528e42]{margin:0 -16px -12px;padding:16px 12px 0}.profile[data-v-28528e42]{flex-grow:1;background-color:var(--vp-c-bg-soft)}.data[data-v-28528e42]{text-align:center}.avatar[data-v-28528e42]{position:relative;flex-shrink:0;margin:0 auto;border-radius:50%;box-shadow:var(--vp-shadow-3)}.avatar-img[data-v-28528e42]{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;object-fit:cover}.name[data-v-28528e42]{margin:0;font-weight:600}.affiliation[data-v-28528e42]{margin:0;font-weight:500;color:var(--vp-c-text-2)}.org.link[data-v-28528e42]{color:var(--vp-c-text-2);transition:color .25s}.org.link[data-v-28528e42]:hover{color:var(--vp-c-brand-1)}.desc[data-v-28528e42]{margin:0 auto}.desc[data-v-28528e42] a{font-weight:500;color:var(--vp-c-brand-1);text-decoration-style:dotted;transition:color .25s}.links[data-v-28528e42]{display:flex;justify-content:center;height:56px}.sp-link[data-v-28528e42]{display:flex;justify-content:center;align-items:center;text-align:center;padding:16px;font-size:14px;font-weight:500;color:var(--vp-c-sponsor);background-color:var(--vp-c-bg-soft);transition:color .25s,background-color .25s}.sp .sp-link.link[data-v-28528e42]:hover,.sp .sp-link.link[data-v-28528e42]:focus{outline:none;color:var(--vp-c-white);background-color:var(--vp-c-sponsor)}.sp-icon[data-v-28528e42]{margin-right:8px;width:16px;height:16px;fill:currentColor}.VPTeamMembers.small .container[data-v-6cb0dbc4]{grid-template-columns:repeat(auto-fit,minmax(224px,1fr))}.VPTeamMembers.small.count-1 .container[data-v-6cb0dbc4]{max-width:276px}.VPTeamMembers.small.count-2 .container[data-v-6cb0dbc4]{max-width:576px}.VPTeamMembers.small.count-3 .container[data-v-6cb0dbc4]{max-width:876px}.VPTeamMembers.medium .container[data-v-6cb0dbc4]{grid-template-columns:repeat(auto-fit,minmax(256px,1fr))}@media (min-width: 375px){.VPTeamMembers.medium .container[data-v-6cb0dbc4]{grid-template-columns:repeat(auto-fit,minmax(288px,1fr))}}.VPTeamMembers.medium.count-1 .container[data-v-6cb0dbc4]{max-width:368px}.VPTeamMembers.medium.count-2 .container[data-v-6cb0dbc4]{max-width:760px}.container[data-v-6cb0dbc4]{display:grid;gap:24px;margin:0 auto;max-width:1152px}.warn{background-color:red;color:#fff}.tc-ul{list-style:none}.tc-ul .tc-item{display:inline-block;width:100px;border:1px solid orange}.tc-ul-margin{list-style:none}.tc-ul-margin .tc-item-margin{display:inline-block;width:100px;border:1px solid orange;margin-right:-4px}.VPLocalSearchBox[data-v-6d2f2a19]{position:fixed;z-index:100;top:0;right:0;bottom:0;left:0;display:flex}.backdrop[data-v-6d2f2a19]{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--vp-backdrop-bg-color);transition:opacity .5s}.shell[data-v-6d2f2a19]{position:relative;padding:12px;margin:64px auto;display:flex;flex-direction:column;gap:16px;background:var(--vp-local-search-bg);width:min(100vw - 60px,900px);height:min-content;max-height:min(100vh - 128px,900px);border-radius:6px}@media (max-width: 767px){.shell[data-v-6d2f2a19]{margin:0;width:100vw;height:100vh;max-height:none;border-radius:0}}.search-bar[data-v-6d2f2a19]{border:1px solid var(--vp-c-divider);border-radius:4px;display:flex;align-items:center;padding:0 12px;cursor:text}@media (max-width: 767px){.search-bar[data-v-6d2f2a19]{padding:0 8px}}.search-bar[data-v-6d2f2a19]:focus-within{border-color:var(--vp-c-brand-1)}.search-icon[data-v-6d2f2a19]{margin:8px}@media (max-width: 767px){.search-icon[data-v-6d2f2a19]{display:none}}.search-input[data-v-6d2f2a19]{padding:6px 12px;font-size:inherit;width:100%}@media (max-width: 767px){.search-input[data-v-6d2f2a19]{padding:6px 4px}}.search-actions[data-v-6d2f2a19]{display:flex;gap:4px}@media (any-pointer: coarse){.search-actions[data-v-6d2f2a19]{gap:8px}}@media (min-width: 769px){.search-actions.before[data-v-6d2f2a19]{display:none}}.search-actions button[data-v-6d2f2a19]{padding:8px}.search-actions button[data-v-6d2f2a19]:not([disabled]):hover,.toggle-layout-button.detailed-list[data-v-6d2f2a19]{color:var(--vp-c-brand-1)}.search-actions button.clear-button[data-v-6d2f2a19]:disabled{opacity:.37}.search-keyboard-shortcuts[data-v-6d2f2a19]{font-size:.8rem;opacity:75%;display:flex;flex-wrap:wrap;gap:16px;line-height:14px}.search-keyboard-shortcuts span[data-v-6d2f2a19]{display:flex;align-items:center;gap:4px}@media (max-width: 767px){.search-keyboard-shortcuts[data-v-6d2f2a19]{display:none}}.search-keyboard-shortcuts kbd[data-v-6d2f2a19]{background:rgba(128,128,128,.1);border-radius:4px;padding:3px 6px;min-width:24px;display:inline-block;text-align:center;vertical-align:middle;border:1px solid rgba(128,128,128,.15);box-shadow:0 2px 2px #0000001a}.results[data-v-6d2f2a19]{display:flex;flex-direction:column;gap:6px;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}.result[data-v-6d2f2a19]{display:flex;align-items:center;gap:8px;border-radius:4px;transition:none;line-height:1rem;border:solid 2px var(--vp-local-search-result-border);outline:none}.result>div[data-v-6d2f2a19]{margin:12px;width:100%;overflow:hidden}@media (max-width: 767px){.result>div[data-v-6d2f2a19]{margin:8px}}.titles[data-v-6d2f2a19]{display:flex;flex-wrap:wrap;gap:4px;position:relative;z-index:1001;padding:2px 0}.title[data-v-6d2f2a19]{display:flex;align-items:center;gap:4px}.title.main[data-v-6d2f2a19]{font-weight:500}.title-icon[data-v-6d2f2a19]{opacity:.5;font-weight:500;color:var(--vp-c-brand-1)}.title svg[data-v-6d2f2a19]{opacity:.5}.result.selected[data-v-6d2f2a19]{--vp-local-search-result-bg: var(--vp-local-search-result-selected-bg);border-color:var(--vp-local-search-result-selected-border)}.excerpt-wrapper[data-v-6d2f2a19]{position:relative}.excerpt[data-v-6d2f2a19]{opacity:75%;pointer-events:none;max-height:140px;overflow:hidden;position:relative;opacity:.5;margin-top:4px}.result.selected .excerpt[data-v-6d2f2a19]{opacity:1}.excerpt[data-v-6d2f2a19] *{font-size:.8rem!important;line-height:130%!important}.titles[data-v-6d2f2a19] mark,.excerpt[data-v-6d2f2a19] mark{background-color:var(--vp-local-search-highlight-bg);color:var(--vp-local-search-highlight-text);border-radius:2px;padding:0 2px}.excerpt[data-v-6d2f2a19] .vp-code-group .tabs{display:none}.excerpt[data-v-6d2f2a19] .vp-code-group div[class*=language-]{border-radius:8px!important}.excerpt-gradient-bottom[data-v-6d2f2a19]{position:absolute;bottom:-1px;left:0;width:100%;height:8px;background:linear-gradient(transparent,var(--vp-local-search-result-bg));z-index:1000}.excerpt-gradient-top[data-v-6d2f2a19]{position:absolute;top:-1px;left:0;width:100%;height:8px;background:linear-gradient(var(--vp-local-search-result-bg),transparent);z-index:1000}.result.selected .titles[data-v-6d2f2a19],.result.selected .title-icon[data-v-6d2f2a19]{color:var(--vp-c-brand-1)!important}.no-results[data-v-6d2f2a19]{font-size:.9rem;text-align:center;padding:12px}svg[data-v-6d2f2a19]{flex:none}
diff --git a/editor/index.html b/editor/index.html
index 2a7d5af..17875bb 100644
--- a/editor/index.html
+++ b/editor/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>文档编辑 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/editor_index.md.b924593a.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/editor_index.md.f69469c7.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文档/编辑器</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/editor/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>说明</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>Markdown</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/editor/markdown/vuepress.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Vue/VitePress</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_editor_" data-v-6b87e69f><div><h1 id="文档编辑" tabindex="-1">文档编辑 <a class="header-anchor" href="#文档编辑" aria-label="Permalink to &quot;文档编辑&quot;">​</a></h1><blockquote><p>一些常见的文档编辑格式以及前端文档编辑器</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/editor/markdown/vuepress.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Vue/VitePress</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文档/编辑器</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/editor/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>说明</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>Markdown</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/editor/markdown/vuepress.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Vue/VitePress</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _editor_" data-v-6b87e69f><div><h1 id="文档编辑" tabindex="-1">文档编辑 <a class="header-anchor" href="#文档编辑" aria-label="Permalink to &quot;文档编辑&quot;">​</a></h1><blockquote><p>一些常见的文档编辑格式以及前端文档编辑器</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/editor/markdown/vuepress.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Vue/VitePress</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/editor/markdown/vuepress.html b/editor/markdown/vuepress.html
index 4a720de..27b38a5 100644
--- a/editor/markdown/vuepress.html
+++ b/editor/markdown/vuepress.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>VuePress & VitePress | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/editor_markdown_vuepress.md.95e9a581.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/editor_markdown_vuepress.md.8bf6ae13.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文档/编辑器</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/editor/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>说明</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>Markdown</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/editor/markdown/vuepress.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Vue/VitePress</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_editor_markdown_vuepress" data-v-6b87e69f><div><h1 id="vuepress-vitepress" tabindex="-1">VuePress &amp; VitePress <a class="header-anchor" href="#vuepress-vitepress" aria-label="Permalink to &quot;VuePress &amp; VitePress&quot;">​</a></h1><p><code>部分 Markdown 文件编写格式</code></p><p><a href="https://vitepress.vuejs.org/guide/markdown" target="_blank" rel="noreferrer">Vitepress 编辑</a></p><h2 id="标题类" tabindex="-1">标题类 <a class="header-anchor" href="#标题类" aria-label="Permalink to &quot;标题类&quot;">​</a></h2><div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">一级标题</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>文档/编辑器</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/editor/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>说明</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>Markdown</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/editor/markdown/vuepress.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Vue/VitePress</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _editor_markdown_vuepress" data-v-6b87e69f><div><h1 id="vuepress-vitepress" tabindex="-1">VuePress &amp; VitePress <a class="header-anchor" href="#vuepress-vitepress" aria-label="Permalink to &quot;VuePress &amp; VitePress&quot;">​</a></h1><p><code>部分 Markdown 文件编写格式</code></p><p><a href="https://vitepress.vuejs.org/guide/markdown" target="_blank" rel="noreferrer">Vitepress 编辑</a></p><h2 id="标题类" tabindex="-1">标题类 <a class="header-anchor" href="#标题类" aria-label="Permalink to &quot;标题类&quot;">​</a></h2><div class="language- vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang"></span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">一级标题</span></span>
 <span class="line"><span style="color:#e1e4e8;"># 一级标题名称</span></span>
 <span class="line"><span style="color:#e1e4e8;"></span></span>
 <span class="line"><span style="color:#e1e4e8;">二级标题</span></span>
@@ -83,8 +83,8 @@
 <span class="line"><span style="color:#e1e4e8;">| 7   | 8   | 9   |</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">| 1   | 2   | 3   |</span></span>
 <span class="line"><span style="color:#24292e;">| --- | --- | --- |</span></span>
 <span class="line"><span style="color:#24292e;">| 4   | 5   | 6   |</span></span>
-<span class="line"><span style="color:#24292e;">| 7   | 8   | 9   |</span></span></code></pre></div><h2 id="表情类" tabindex="-1">表情类 <a class="header-anchor" href="#表情类" aria-label="Permalink to &quot;表情类&quot;">​</a></h2><p><strong>部分</strong></p><table><thead><tr><th>emoji</th><th style="text-align:center;">emoji name</th><th style="text-align:right;">emoji</th><th>emoji name</th><th>emoji</th><th style="text-align:center;">emoji name</th></tr></thead><tbody><tr><td>🎉</td><td style="text-align:center;"><code>:tada:</code></td><td style="text-align:right;">😠</td><td><code>:angry:</code></td><td>🍎</td><td style="text-align:center;"><code>:apple:</code></td></tr><tr><td>💯</td><td style="text-align:center;"><code>:100:</code></td><td style="text-align:right;">😧</td><td><code>:anguished:</code></td><td>🏀</td><td style="text-align:center;"><code>:basketball:</code></td></tr><tr><td>👍</td><td style="text-align:center;"><code>:+1:</code></td><td style="text-align:right;">👎</td><td><code>:-1:</code></td><td>🕐</td><td style="text-align:center;"><code>:clock1:</code></td></tr><tr><td>👊</td><td style="text-align:center;"><code>:facepunch:</code></td><td style="text-align:right;">👏</td><td><code>:clap:</code></td><td>☕</td><td style="text-align:center;"><code>:coffee:</code></td></tr><tr><td>😳</td><td style="text-align:center;"><code>:flushed:</code></td><td style="text-align:right;">0️⃣</td><td><code>:zero:</code></td><td>😒</td><td style="text-align:center;"><code>:unamused:</code></td></tr><tr><td>🏈</td><td style="text-align:center;"><code>:football:</code></td><td style="text-align:right;">😟</td><td><code>:worried:</code></td><td>🚶</td><td style="text-align:center;"><code>:walking:</code></td></tr><tr><td>👣</td><td style="text-align:center;"><code>:footprints:</code></td><td style="text-align:right;">🔧</td><td><code>:wrench:</code></td><td>🆚</td><td style="text-align:center;"><code>:vs:</code></td></tr><tr><td>4️⃣</td><td style="text-align:center;"><code>:four:</code></td><td style="text-align:right;">❌</td><td><code>:x:</code></td><td>⌚</td><td style="text-align:center;"><code>:watch:</code></td></tr><tr><td>💤</td><td style="text-align:center;"><code>:zzz:</code></td><td style="text-align:right;">👋</td><td><code>:wave:</code></td><td>⚠️</td><td style="text-align:center;"><code>:warning:</code></td></tr><tr><td>😭</td><td style="text-align:center;"><code>:sob:</code></td><td style="text-align:right;">😱</td><td><code>:scream:</code></td><td>🌹</td><td style="text-align:center;"><code>:rose:</code></td></tr></tbody></table></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/editor/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>说明</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292e;">| 7   | 8   | 9   |</span></span></code></pre></div><h2 id="表情类" tabindex="-1">表情类 <a class="header-anchor" href="#表情类" aria-label="Permalink to &quot;表情类&quot;">​</a></h2><p><strong>部分</strong></p><table><thead><tr><th>emoji</th><th style="text-align:center;">emoji name</th><th style="text-align:right;">emoji</th><th>emoji name</th><th>emoji</th><th style="text-align:center;">emoji name</th></tr></thead><tbody><tr><td>🎉</td><td style="text-align:center;"><code>:tada:</code></td><td style="text-align:right;">😠</td><td><code>:angry:</code></td><td>🍎</td><td style="text-align:center;"><code>:apple:</code></td></tr><tr><td>💯</td><td style="text-align:center;"><code>:100:</code></td><td style="text-align:right;">😧</td><td><code>:anguished:</code></td><td>🏀</td><td style="text-align:center;"><code>:basketball:</code></td></tr><tr><td>👍</td><td style="text-align:center;"><code>:+1:</code></td><td style="text-align:right;">👎</td><td><code>:-1:</code></td><td>🕐</td><td style="text-align:center;"><code>:clock1:</code></td></tr><tr><td>👊</td><td style="text-align:center;"><code>:facepunch:</code></td><td style="text-align:right;">👏</td><td><code>:clap:</code></td><td>☕</td><td style="text-align:center;"><code>:coffee:</code></td></tr><tr><td>😳</td><td style="text-align:center;"><code>:flushed:</code></td><td style="text-align:right;">0️⃣</td><td><code>:zero:</code></td><td>😒</td><td style="text-align:center;"><code>:unamused:</code></td></tr><tr><td>🏈</td><td style="text-align:center;"><code>:football:</code></td><td style="text-align:right;">😟</td><td><code>:worried:</code></td><td>🚶</td><td style="text-align:center;"><code>:walking:</code></td></tr><tr><td>👣</td><td style="text-align:center;"><code>:footprints:</code></td><td style="text-align:right;">🔧</td><td><code>:wrench:</code></td><td>🆚</td><td style="text-align:center;"><code>:vs:</code></td></tr><tr><td>4️⃣</td><td style="text-align:center;"><code>:four:</code></td><td style="text-align:right;">❌</td><td><code>:x:</code></td><td>⌚</td><td style="text-align:center;"><code>:watch:</code></td></tr><tr><td>💤</td><td style="text-align:center;"><code>:zzz:</code></td><td style="text-align:right;">👋</td><td><code>:wave:</code></td><td>⚠️</td><td style="text-align:center;"><code>:warning:</code></td></tr><tr><td>😭</td><td style="text-align:center;"><code>:sob:</code></td><td style="text-align:right;">😱</td><td><code>:scream:</code></td><td>🌹</td><td style="text-align:center;"><code>:rose:</code></td></tr></tbody></table></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/editor/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>说明</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/hashmap.json b/hashmap.json
index dfe0288..c7421f8 100644
--- a/hashmap.json
+++ b/hashmap.json
@@ -1 +1 @@
-{"architecture_standard_comp-mod.md":"f6f9cedd","alogrithm_interview_self.md":"f2953867","architecture_standard_a-yz.md":"bd642461","articles_advanced_knowledge.js.md":"4f4856e0","alogrithm_basic_red_black_tree.md":"1fb89df7","architecture_standard_performance.md":"c952558a","alogrithm_index.md":"2b9ae594","architecture_index.md":"d9230efd","articles_advanced_devserver.md":"7df25eb4","articles_advanced_mutationobserver.md":"cb0eb7f3","architecture_websecure_xss.md":"63b7ea5b","alogrithm_basic_bit.md":"1b0e2756","articles_advanced_v8-code.md":"40cd5ff2","articles_advanced_transitionanimation.md":"f629e671","articles_advanced_debounce.md":"5bbfcaa3","alogrithm_basic_o.md":"efeb357c","articles_advanced_htmlwebpackplugin.md":"4a93efb9","notes_css_inline.md":"ed702657","notes_css_replaced.md":"ceaac847","notes_css_text-character.md":"ab74a92c","notes_es_es6.md":"cb465ca1","notes_html_esmodule.md":"ddda8566","notes_nodejs_ansi.md":"b4c1b09e","notes_nodejs_event-loop.md":"95affbd8","notes_nodejs_npm.md":"794dc498","notes_regexp_base.md":"5f3b85d0","notes_regexp_unknown.md":"40d387f2","notes_typescript_advanced.md":"d0ace6b6","notes_typescript_lib-struct.md":"04de5da6","source-code_react_api_context.md":"f71ef236","source-code_index.md":"3b974e67","source-code_react_api_ref.md":"041146b3","source-code_vue_index.md":"55141804","network_webrtc.md":"5adc7068","notes_css_bfc.md":"cf27ad88","notes_css_box.md":"b41a02c1","editor_index.md":"b924593a","architecture_standard_project-design.md":"1e6aae9a","notes_css_flex.md":"2119380d","architecture_standard_monitor.md":"ff5a8411","articles_basic_clipboard.md":"b53c3e95","articles_advanced_virtuallist.md":"6b763d2e","articles_basic_ieee.md":"f4f18348","articles_basic_color_convert.md":"8302e80d","articles_basic_git.md":"abbfc6c6","notes_css_visibility.md":"4ed2886f","notes_javascript_equal.md":"392568f0","notes_html_seo.md":"15c47690","articles_basic_dom_events.md":"6bad1c68","articles_basic_eslint.md":"8aa0db41","articles_problem_css.md":"d109b0e6","articles_servers_ecs.md":"f94f1bda","articles_basic_module.md":"e77ca7a2","interview_crp.md":"7942c988","articles_basic_history.md":"4e7d878f","index.md":"d75d9507","interview_metrics.md":"e083096b","network_cookie.md":"14ec33fe","network_cors.md":"974416e8","interview_index.md":"e4e6acc5","articles_advanced_docs.md":"74a9328e","notes_javascript_jsop.md":"2e56b764","notes_typescript_basic.md":"75a51f21","notes_javascript_this.md":"532a6f9a","articles_basic_script_link.md":"78aa867d","notes_javascript_addeventlistener.md":"1f4fe8a5","notes_html_unusual.md":"a78f96eb","notes_javascript_dom.md":"00aacf49","notes_javascript_scope.md":"9b63d680","notes_css_index.md":"9165b88b","interview_browser.md":"007efedd","notes_javascript_event-loop.md":"15fccb5b","editor_markdown_vuepress.md":"95e9a581","network_ip_addr.md":"c87e2877","network_layer.md":"75f275a2","network_methods.md":"d5348171","network_noun.md":"e1eac5d1","network_special_addr.md":"8b6962a9","network_socket.md":"5f45c373","network_status_code.md":"3f54f40a","network_subnet_mask.md":"9eb6788c","notes_css_float.md":"88996ca7","notes_css_pseudo.md":"65d61dd8","network_osi.md":"3b1c2623","network_dhcp.md":"2beb2a5b","notes_javascript_prototype.md":"b24cb541","notes_javascript_storage-struct.md":"43266820","network_index.md":"ac3e7452","network_tls_ssl.md":"1b14e38d","notes_javascript_uri.md":"aa38219c","notes_javascript_mutationobserver.md":"a535a188","articles_basic_syslink.md":"ba8c5ece","articles_problem_yarn.md":"3bf099db","notes_index.md":"778f192c","articles_index.md":"2805f70b"}
+{"alogrithm_interview_self.md":"c8309eff","alogrithm_basic_red_black_tree.md":"55eb2555","architecture_index.md":"678a0502","architecture_standard_a-yz.md":"a0e51b94","architecture_standard_comp-mod.md":"e027bdb0","architecture_standard_monitor.md":"6a6f7341","alogrithm_basic_bit.md":"f90bc13d","architecture_standard_project-design.md":"491238a5","alogrithm_basic_o.md":"7641dd85","articles_advanced_devserver.md":"adf19849","articles_advanced_docs.md":"501fd43f","architecture_websecure_xss.md":"b68d323d","alogrithm_index.md":"67f8b108","architecture_standard_performance.md":"5df854dc","articles_advanced_knowledge.js.md":"8a7fac43","articles_advanced_debounce.md":"c37622c0","articles_advanced_transitionanimation.md":"e283b702","articles_basic_dom_events.md":"70d1d757","editor_index.md":"f69469c7","network_layer.md":"e12ef59e","articles_basic_git.md":"8f01f6d4","interview_index.md":"d69cf835","network_cors.md":"597b0a96","articles_basic_history.md":"bb6472e8","articles_basic_script_link.md":"eb8f70cc","notes_css_index.md":"97c1211d","notes_css_pseudo.md":"8a522478","notes_css_replaced.md":"3cd3cdf4","notes_css_inline.md":"5f3b894b","network_tls_ssl.md":"e0605f70","index.md":"43ab226b","articles_servers_ecs.md":"3a2f60fe","interview_crp.md":"20bcf17d","articles_basic_clipboard.md":"a48ade2d","articles_problem_css.md":"5cdc7adf","articles_problem_yarn.md":"6c3a7206","articles_index.md":"16646c0c","articles_advanced_mutationobserver.md":"1d6f3539","notes_html_esmodule.md":"8d06acba","notes_html_seo.md":"17a408c9","notes_html_unusual.md":"76389d1b","articles_basic_syslink.md":"8ff4f41d","notes_css_flex.md":"d5fb90fd","articles_basic_module.md":"67706ce5","notes_css_box.md":"b1484cf4","network_webrtc.md":"06b0eb25","network_methods.md":"a8694107","network_noun.md":"b1b4cd32","notes_css_visibility.md":"36af78c5","articles_basic_eslint.md":"bea7edfe","network_osi.md":"021cfe3c","network_special_addr.md":"deb0827e","network_subnet_mask.md":"7a58406b","notes_css_text-character.md":"567549b3","network_socket.md":"a2e885ec","interview_browser.md":"a89a4d9b","network_status_code.md":"b6f517ca","editor_markdown_vuepress.md":"8bf6ae13","notes_css_float.md":"74e6557b","articles_advanced_htmlwebpackplugin.md":"b19e7406","network_ip_addr.md":"7e144e39","articles_advanced_virtuallist.md":"0c9b0049","network_cookie.md":"9860852e","network_dhcp.md":"36ba0d0c","notes_es_es6.md":"c70b9687","articles_basic_color_convert.md":"2cce2798","articles_advanced_v8-code.md":"aa1e9c3f","notes_css_bfc.md":"d9623d35","network_index.md":"a4ce8b20","notes_nodejs_npm.md":"990b6f83","source-code_react_api_context.md":"cb6576d9","source-code_react_api_ref.md":"955d1f79","articles_basic_ieee.md":"04dcfb91","notes_regexp_unknown.md":"ffcfd74a","notes_javascript_jsop.md":"a97810f8","notes_javascript_uri.md":"0675aa7b","notes_javascript_scope.md":"be39322f","notes_index.md":"0f4dfe42","interview_metrics.md":"6cc2fc75","notes_javascript_event-loop.md":"bdac45df","source-code_vue_index.md":"59347e5f","notes_nodejs_event-loop.md":"f5078491","notes_javascript_mutationobserver.md":"1d6ee92e","notes_typescript_lib-struct.md":"214381a8","notes_javascript_equal.md":"0278cdef","source-code_index.md":"c3b56127","notes_javascript_storage-struct.md":"0cab0c00","notes_typescript_basic.md":"7f81406b","notes_regexp_base.md":"80469b71","notes_typescript_advanced.md":"13baaa4d","notes_javascript_this.md":"e080543e","notes_javascript_dom.md":"0af651ba","notes_javascript_addeventlistener.md":"6026f065","notes_javascript_prototype.md":"36c69f43","notes_nodejs_ansi.md":"0e90e8a3"}
diff --git a/index.html b/index.html
index 1b18aab..3fcbbf6 100644
--- a/index.html
+++ b/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>LEARNING DOCS | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/index.md.d75d9507.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/index.md.43ab226b.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar top" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><!----><!----><div class="VPContent is-home" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPHome" data-v-669faec9 data-v-d82743a8><!--[--><!--]--><div class="VPHero VPHomeHero" data-v-d82743a8 data-v-da5d1713><div class="container" data-v-da5d1713><div class="main" data-v-da5d1713><!--[--><h1 class="name" data-v-da5d1713><span class="clip" data-v-da5d1713>Learning Docs</span></h1><p class="text" data-v-da5d1713>Learning is like rowing upstream</p><p class="tagline" data-v-da5d1713>记录所学，分享知识，共同进步</p><!--]--><div class="actions" data-v-da5d1713><!--[--><div class="action" data-v-da5d1713><a class="VPButton medium brand" href="/learning-docs2/notes/" data-v-da5d1713 data-v-c1c5efc1>知识旅行 -&gt;</a></div><div class="action" data-v-da5d1713><a class="VPButton medium alt" href="https://github.com/LIUeng" target="_blank" rel="noreferrer" data-v-da5d1713 data-v-c1c5efc1>View My GitHub</a></div><!--]--></div></div><!----></div></div><!--[--><!--]--><!--[--><!--]--><div class="VPFeatures VPHomeFeatures" data-v-d82743a8 data-v-a6181336><div class="container" data-v-a6181336><div class="items" data-v-a6181336><!--[--><div class="grid-4 item" data-v-a6181336><div class="VPLink no-icon VPFeature" data-v-a6181336 data-v-33204567><!--[--><article class="box" data-v-33204567><!----><h2 class="title" data-v-33204567>团队能力</h2><p class="details" data-v-33204567>个人的成长离不开一个团队的成长，融入团队，共同促进团队成长，相信团队的力量</p><!----></article><!--]--></div></div><div class="grid-4 item" data-v-a6181336><div class="VPLink no-icon VPFeature" data-v-a6181336 data-v-33204567><!--[--><article class="box" data-v-33204567><!----><h2 class="title" data-v-33204567>语言能力</h2><p class="details" data-v-33204567>提高语言能力，增强对不同语言文档的驾驭能力，使编码简单轻松，编程质量与体验大幅提升</p><!----></article><!--]--></div></div><div class="grid-4 item" data-v-a6181336><div class="VPLink no-icon VPFeature" data-v-a6181336 data-v-33204567><!--[--><article class="box" data-v-33204567><!----><h2 class="title" data-v-33204567>学习能力</h2><p class="details" data-v-33204567>每天进步一点点，回头已是一万里，记录学习的点点滴滴</p><!----></article><!--]--></div></div><div class="grid-4 item" data-v-a6181336><div class="VPLink no-icon VPFeature" data-v-a6181336 data-v-33204567><!--[--><article class="box" data-v-33204567><!----><h2 class="title" data-v-33204567>实践能力</h2><p class="details" data-v-33204567>每一个项目才是真正实践的有价值的地方，擅于总结，擅于积累经验</p><!----></article><!--]--></div></div><!--]--></div></div></div><!--[--><!--]--><div style="position:relative;" data-v-d82743a8><div></div></div></div></div><footer class="VPFooter" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar top" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><!----><!----><div class="VPContent is-home" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPHome" data-v-669faec9 data-v-d82743a8><!--[--><!--]--><div class="VPHero VPHomeHero" data-v-d82743a8 data-v-da5d1713><div class="container" data-v-da5d1713><div class="main" data-v-da5d1713><!--[--><h1 class="name" data-v-da5d1713><span class="clip" data-v-da5d1713>Learning Docs</span></h1><p class="text" data-v-da5d1713>Learning is like rowing upstream</p><p class="tagline" data-v-da5d1713>记录所学，分享知识，共同进步</p><!--]--><div class="actions" data-v-da5d1713><!--[--><div class="action" data-v-da5d1713><a class="VPButton medium brand" href="/notes/" data-v-da5d1713 data-v-c1c5efc1>知识旅行 -&gt;</a></div><div class="action" data-v-da5d1713><a class="VPButton medium alt" href="https://github.com/LIUeng" target="_blank" rel="noreferrer" data-v-da5d1713 data-v-c1c5efc1>View My GitHub</a></div><!--]--></div></div><!----></div></div><!--[--><!--]--><!--[--><!--]--><div class="VPFeatures VPHomeFeatures" data-v-d82743a8 data-v-a6181336><div class="container" data-v-a6181336><div class="items" data-v-a6181336><!--[--><div class="grid-4 item" data-v-a6181336><div class="VPLink no-icon VPFeature" data-v-a6181336 data-v-33204567><!--[--><article class="box" data-v-33204567><!----><h2 class="title" data-v-33204567>团队能力</h2><p class="details" data-v-33204567>个人的成长离不开一个团队的成长，融入团队，共同促进团队成长，相信团队的力量</p><!----></article><!--]--></div></div><div class="grid-4 item" data-v-a6181336><div class="VPLink no-icon VPFeature" data-v-a6181336 data-v-33204567><!--[--><article class="box" data-v-33204567><!----><h2 class="title" data-v-33204567>语言能力</h2><p class="details" data-v-33204567>提高语言能力，增强对不同语言文档的驾驭能力，使编码简单轻松，编程质量与体验大幅提升</p><!----></article><!--]--></div></div><div class="grid-4 item" data-v-a6181336><div class="VPLink no-icon VPFeature" data-v-a6181336 data-v-33204567><!--[--><article class="box" data-v-33204567><!----><h2 class="title" data-v-33204567>学习能力</h2><p class="details" data-v-33204567>每天进步一点点，回头已是一万里，记录学习的点点滴滴</p><!----></article><!--]--></div></div><div class="grid-4 item" data-v-a6181336><div class="VPLink no-icon VPFeature" data-v-a6181336 data-v-33204567><!--[--><article class="box" data-v-33204567><!----><h2 class="title" data-v-33204567>实践能力</h2><p class="details" data-v-33204567>每一个项目才是真正实践的有价值的地方，擅于总结，擅于积累经验</p><!----></article><!--]--></div></div><!--]--></div></div></div><!--[--><!--]--><div style="position:relative;" data-v-d82743a8><div></div></div></div></div><footer class="VPFooter" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/interview/browser.html b/interview/browser.html
index d459486..8018904 100644
--- a/interview/browser.html
+++ b/interview/browser.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Chromium 渲染流水线 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/interview_browser.md.007efedd.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/interview_browser.md.a89a4d9b.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试指南</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>写在前面</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试相关</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/browser.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>浏览器渲染流水线</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/metrics.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>性能指标</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/crp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>关键路径渲染 CRP</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_interview_browser" data-v-6b87e69f><div><h1 id="chromium-渲染流水线" tabindex="-1">Chromium 渲染流水线 <a class="header-anchor" href="#chromium-渲染流水线" aria-label="Permalink to &quot;Chromium 渲染流水线&quot;">​</a></h1><p><a href="https://zhuanlan.zhihu.com/p/574069391" target="_blank" rel="noreferrer">本文引用地址</a></p><h2 id="浏览器架构" tabindex="-1">浏览器架构 <a class="header-anchor" href="#浏览器架构" aria-label="Permalink to &quot;浏览器架构&quot;">​</a></h2><blockquote><p>浏览器 = 浏览器内核 + 服务</p></blockquote><ul><li>Safari = WebKit + 其他组件、库、服务</li><li>Chrome = Chromium + Google 服务集成</li><li>Microsoft Edge (Chromium) = Chromium + Microsoft 服务集成</li><li>Yandex Browser = Chromium + Yandex 服务集成</li><li>360 安全浏览器 = Trident + Chromium + 360 服务集成</li><li>Chromium = Blink + V8 + 其他组件、库、服务</li></ul><blockquote><p>浏览器 = 渲染引擎 + JavaScript 引擎 + 其他</p></blockquote><table><thead><tr><th>Browser</th><th>Rendering Engine</th><th>JavaScript Engine</th></tr></thead><tbody><tr><td>Internet</td><td>Explorer Trident (MSHTML)</td><td>JScript/Chakra</td></tr><tr><td>Microsoft Edge</td><td>EdgeHTML → Blink</td><td>Chakra → V8</td></tr><tr><td>Firefox</td><td>Gecko</td><td>SpiderMonkey</td></tr><tr><td>Safari</td><td>KHTML → WebKit</td><td>JavaScriptCore</td></tr><tr><td>Chrome</td><td>WebKit → Blink</td><td>V8</td></tr><tr><td>Opera</td><td>Presto → WebKit → Blink Carakan →</td><td>V8</td></tr></tbody></table><h2 id="chromium-进程" tabindex="-1">Chromium 进程 <a class="header-anchor" href="#chromium-进程" aria-label="Permalink to &quot;Chromium 进程&quot;">​</a></h2><ul><li>浏览器进程 1 个</li><li>Utility 进程 1 个</li><li>Viz 进程 1 个（Visuals Process）</li><li>插件进程 1 个</li><li>渲染进程 多个</li></ul><h3 id="浏览器进程" tabindex="-1">浏览器进程 <a class="header-anchor" href="#浏览器进程" aria-label="Permalink to &quot;浏览器进程&quot;">​</a></h3><blockquote><p>负责 Browser UI （不包含 WebContent 的 UI）的全部能力，包括渲染、动画、路由、Input 事件等</p></blockquote><ul><li>Render &amp; Compositing Thread</li><li>Render &amp; Compositing Thread Helpers</li></ul><h3 id="渲染进程" tabindex="-1">渲染进程 <a class="header-anchor" href="#渲染进程" aria-label="Permalink to &quot;渲染进程&quot;">​</a></h3><blockquote><p>负责单个 Tab 内单个站点（注意跨站点 iframe 的情况）的渲染、动画、滚动、Input 事件等</p></blockquote><ul><li>线程 <ul><li>主线程</li><li>合成线程（compositor）</li><li>光栅化线程</li><li>worker 线程</li></ul></li></ul><h4 id="主线程" tabindex="-1">主线程 <a class="header-anchor" href="#主线程" aria-label="Permalink to &quot;主线程&quot;">​</a></h4><ul><li>执行 JavaScript</li><li>Event Loop</li><li>Document 生命周期</li><li>Hit Testing</li><li>事件调度</li><li>HTML CSS 数据格式的解析</li></ul><h4 id="合成线程" tabindex="-1">合成线程 <a class="header-anchor" href="#合成线程" aria-label="Permalink to &quot;合成线程&quot;">​</a></h4><ul><li>Input Handler &amp; Hit Tester</li><li>Web Content 中的滚动与动画</li><li>计算 Web Content 的最优分层</li><li>协调图片解码、绘制、光栅化任务（helpers)</li></ul><h3 id="viz-进程" tabindex="-1">Viz 进程 <a class="header-anchor" href="#viz-进程" aria-label="Permalink to &quot;Viz 进程&quot;">​</a></h3><blockquote><p>接受 Render Process 和 Browser Process 产生的 viz::CompositorFrame，并将其合成 (Aggregate)，最后使用 GPU 将合成结果上屏 (Display)</p></blockquote><ul><li>GPU main thread</li><li>Display Compositor Thread</li></ul><h2 id="进程模式" tabindex="-1">进程模式 <a class="header-anchor" href="#进程模式" aria-label="Permalink to &quot;进程模式&quot;">​</a></h2><ul><li>Process-per-site-instance：老版本的默认策略，如果从一个页面打开了另一个新页面，而新页面和当前页面属于同一站点（根域名与协议相同）的话，那么这两个页面会共用一个 Render Process</li><li>Process-per-site</li><li>Process-per-tab：如今版本的默认策略，每个 Tab 起一个 Render Process。但注意站点内部的跨站 iframe 也会启动一个新的 Render Process</li><li>Single Process：单进程模式，启动参数可控，用于 Debug</li></ul><h2 id="渲染流水线" tabindex="-1">渲染流水线 <a class="header-anchor" href="#渲染流水线" aria-label="Permalink to &quot;渲染流水线&quot;">​</a></h2><img src="/learning-docs2/assets/images/rendering-pipeline.webp"><h3 id="parsing" tabindex="-1">Parsing <a class="header-anchor" href="#parsing" aria-label="Permalink to &quot;Parsing&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：解析浏览器进程传送的字节，转成 DOM TREE</li><li>流程：bytes → characters → token → nodes → object model (DOM Tree)</li></ul><h3 id="style" tabindex="-1">Style <a class="header-anchor" href="#style" aria-label="Permalink to &quot;Style&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：遍历 DOM TREE，通过 CSSOM 进行样式分析（ComputeStyle 样式信息）和样式重算，生成 Render Tree</li></ul><h3 id="layout" tabindex="-1">Layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;Layout&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：处理元素的几何属性，即位置与尺寸</li></ul><h3 id="pre-paint" tabindex="-1">Pre-paint <a class="header-anchor" href="#pre-paint" aria-label="Permalink to &quot;Pre-paint&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：生成 Property trees（transform clip effect scroll），供 Compositor thrread 使用，避免某些资源重复 Raster</li></ul><h3 id="paint" tabindex="-1">Paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;Paint&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：开始绘制</li></ul><h3 id="commit" tabindex="-1">Commit <a class="header-anchor" href="#commit" aria-label="Permalink to &quot;Commit&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将绘制的产物数据提交给 Compositor 线程</li></ul><h3 id="compositing" tabindex="-1">Compositing <a class="header-anchor" href="#compositing" aria-label="Permalink to &quot;Compositing&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将整个页面按照一定规则，分成多个独立的图层，便于隔离更新</li></ul><h3 id="tiling" tabindex="-1">Tiling <a class="header-anchor" href="#tiling" aria-label="Permalink to &quot;Tiling&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：根据图层不同的范围级别，不同的大小拆分成多个图块给到 Raster 线程处理</li></ul><h3 id="raster" tabindex="-1">Raster <a class="header-anchor" href="#raster" aria-label="Permalink to &quot;Raster&quot;">​</a></h3><p>::: tips 光栅化 光栅化（Rasterization）是把顶点数据转换为片元的过程，具有将图转化为一个个栅格组成的图象的作用，特点是每个元素对应帧缓冲区中的一像素。 :::</p><ul><li>进程：渲染进程</li><li>线程：Raster 线程</li><li>职责：生成位图</li></ul><h3 id="activate" tabindex="-1">Activate <a class="header-anchor" href="#activate" aria-label="Permalink to &quot;Activate&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：实现一个缓冲机制，确保 Draw 阶段操作前 Raster 的数据已经准备好</li></ul><h3 id="draw" tabindex="-1">Draw <a class="header-anchor" href="#draw" aria-label="Permalink to &quot;Draw&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将光栅化之后的图块生成 draw quads 的过程</li></ul><h3 id="aggregate" tabindex="-1">Aggregate <a class="header-anchor" href="#aggregate" aria-label="Permalink to &quot;Aggregate&quot;">​</a></h3><ul><li>进程：Viz 进程</li><li>线程：Display Compositor thread</li><li>职责：接受多个进程传递过来的（CompositorFrame）并进行合成</li></ul><h3 id="display" tabindex="-1">Display <a class="header-anchor" href="#display" aria-label="Permalink to &quot;Display&quot;">​</a></h3><ul><li>进程：Viz 进程</li><li>线程：GUP 主线程</li><li>职责：生成 CompositorFrame 之后，调用 GL 指令把 draw quads 最终输出到屏幕上</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-19T08:13:46.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/interview/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>写在前面</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/interview/metrics.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>性能指标</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试指南</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>写在前面</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试相关</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/browser.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>浏览器渲染流水线</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/metrics.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>性能指标</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/crp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>关键路径渲染 CRP</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _interview_browser" data-v-6b87e69f><div><h1 id="chromium-渲染流水线" tabindex="-1">Chromium 渲染流水线 <a class="header-anchor" href="#chromium-渲染流水线" aria-label="Permalink to &quot;Chromium 渲染流水线&quot;">​</a></h1><p><a href="https://zhuanlan.zhihu.com/p/574069391" target="_blank" rel="noreferrer">本文引用地址</a></p><h2 id="浏览器架构" tabindex="-1">浏览器架构 <a class="header-anchor" href="#浏览器架构" aria-label="Permalink to &quot;浏览器架构&quot;">​</a></h2><blockquote><p>浏览器 = 浏览器内核 + 服务</p></blockquote><ul><li>Safari = WebKit + 其他组件、库、服务</li><li>Chrome = Chromium + Google 服务集成</li><li>Microsoft Edge (Chromium) = Chromium + Microsoft 服务集成</li><li>Yandex Browser = Chromium + Yandex 服务集成</li><li>360 安全浏览器 = Trident + Chromium + 360 服务集成</li><li>Chromium = Blink + V8 + 其他组件、库、服务</li></ul><blockquote><p>浏览器 = 渲染引擎 + JavaScript 引擎 + 其他</p></blockquote><table><thead><tr><th>Browser</th><th>Rendering Engine</th><th>JavaScript Engine</th></tr></thead><tbody><tr><td>Internet</td><td>Explorer Trident (MSHTML)</td><td>JScript/Chakra</td></tr><tr><td>Microsoft Edge</td><td>EdgeHTML → Blink</td><td>Chakra → V8</td></tr><tr><td>Firefox</td><td>Gecko</td><td>SpiderMonkey</td></tr><tr><td>Safari</td><td>KHTML → WebKit</td><td>JavaScriptCore</td></tr><tr><td>Chrome</td><td>WebKit → Blink</td><td>V8</td></tr><tr><td>Opera</td><td>Presto → WebKit → Blink Carakan →</td><td>V8</td></tr></tbody></table><h2 id="chromium-进程" tabindex="-1">Chromium 进程 <a class="header-anchor" href="#chromium-进程" aria-label="Permalink to &quot;Chromium 进程&quot;">​</a></h2><ul><li>浏览器进程 1 个</li><li>Utility 进程 1 个</li><li>Viz 进程 1 个（Visuals Process）</li><li>插件进程 1 个</li><li>渲染进程 多个</li></ul><h3 id="浏览器进程" tabindex="-1">浏览器进程 <a class="header-anchor" href="#浏览器进程" aria-label="Permalink to &quot;浏览器进程&quot;">​</a></h3><blockquote><p>负责 Browser UI （不包含 WebContent 的 UI）的全部能力，包括渲染、动画、路由、Input 事件等</p></blockquote><ul><li>Render &amp; Compositing Thread</li><li>Render &amp; Compositing Thread Helpers</li></ul><h3 id="渲染进程" tabindex="-1">渲染进程 <a class="header-anchor" href="#渲染进程" aria-label="Permalink to &quot;渲染进程&quot;">​</a></h3><blockquote><p>负责单个 Tab 内单个站点（注意跨站点 iframe 的情况）的渲染、动画、滚动、Input 事件等</p></blockquote><ul><li>线程 <ul><li>主线程</li><li>合成线程（compositor）</li><li>光栅化线程</li><li>worker 线程</li></ul></li></ul><h4 id="主线程" tabindex="-1">主线程 <a class="header-anchor" href="#主线程" aria-label="Permalink to &quot;主线程&quot;">​</a></h4><ul><li>执行 JavaScript</li><li>Event Loop</li><li>Document 生命周期</li><li>Hit Testing</li><li>事件调度</li><li>HTML CSS 数据格式的解析</li></ul><h4 id="合成线程" tabindex="-1">合成线程 <a class="header-anchor" href="#合成线程" aria-label="Permalink to &quot;合成线程&quot;">​</a></h4><ul><li>Input Handler &amp; Hit Tester</li><li>Web Content 中的滚动与动画</li><li>计算 Web Content 的最优分层</li><li>协调图片解码、绘制、光栅化任务（helpers)</li></ul><h3 id="viz-进程" tabindex="-1">Viz 进程 <a class="header-anchor" href="#viz-进程" aria-label="Permalink to &quot;Viz 进程&quot;">​</a></h3><blockquote><p>接受 Render Process 和 Browser Process 产生的 viz::CompositorFrame，并将其合成 (Aggregate)，最后使用 GPU 将合成结果上屏 (Display)</p></blockquote><ul><li>GPU main thread</li><li>Display Compositor Thread</li></ul><h2 id="进程模式" tabindex="-1">进程模式 <a class="header-anchor" href="#进程模式" aria-label="Permalink to &quot;进程模式&quot;">​</a></h2><ul><li>Process-per-site-instance：老版本的默认策略，如果从一个页面打开了另一个新页面，而新页面和当前页面属于同一站点（根域名与协议相同）的话，那么这两个页面会共用一个 Render Process</li><li>Process-per-site</li><li>Process-per-tab：如今版本的默认策略，每个 Tab 起一个 Render Process。但注意站点内部的跨站 iframe 也会启动一个新的 Render Process</li><li>Single Process：单进程模式，启动参数可控，用于 Debug</li></ul><h2 id="渲染流水线" tabindex="-1">渲染流水线 <a class="header-anchor" href="#渲染流水线" aria-label="Permalink to &quot;渲染流水线&quot;">​</a></h2><img src="/assets/images/rendering-pipeline.webp"><h3 id="parsing" tabindex="-1">Parsing <a class="header-anchor" href="#parsing" aria-label="Permalink to &quot;Parsing&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：解析浏览器进程传送的字节，转成 DOM TREE</li><li>流程：bytes → characters → token → nodes → object model (DOM Tree)</li></ul><h3 id="style" tabindex="-1">Style <a class="header-anchor" href="#style" aria-label="Permalink to &quot;Style&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：遍历 DOM TREE，通过 CSSOM 进行样式分析（ComputeStyle 样式信息）和样式重算，生成 Render Tree</li></ul><h3 id="layout" tabindex="-1">Layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;Layout&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：处理元素的几何属性，即位置与尺寸</li></ul><h3 id="pre-paint" tabindex="-1">Pre-paint <a class="header-anchor" href="#pre-paint" aria-label="Permalink to &quot;Pre-paint&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：生成 Property trees（transform clip effect scroll），供 Compositor thrread 使用，避免某些资源重复 Raster</li></ul><h3 id="paint" tabindex="-1">Paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;Paint&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：主线程</li><li>职责：开始绘制</li></ul><h3 id="commit" tabindex="-1">Commit <a class="header-anchor" href="#commit" aria-label="Permalink to &quot;Commit&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将绘制的产物数据提交给 Compositor 线程</li></ul><h3 id="compositing" tabindex="-1">Compositing <a class="header-anchor" href="#compositing" aria-label="Permalink to &quot;Compositing&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将整个页面按照一定规则，分成多个独立的图层，便于隔离更新</li></ul><h3 id="tiling" tabindex="-1">Tiling <a class="header-anchor" href="#tiling" aria-label="Permalink to &quot;Tiling&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：根据图层不同的范围级别，不同的大小拆分成多个图块给到 Raster 线程处理</li></ul><h3 id="raster" tabindex="-1">Raster <a class="header-anchor" href="#raster" aria-label="Permalink to &quot;Raster&quot;">​</a></h3><p>::: tips 光栅化 光栅化（Rasterization）是把顶点数据转换为片元的过程，具有将图转化为一个个栅格组成的图象的作用，特点是每个元素对应帧缓冲区中的一像素。 :::</p><ul><li>进程：渲染进程</li><li>线程：Raster 线程</li><li>职责：生成位图</li></ul><h3 id="activate" tabindex="-1">Activate <a class="header-anchor" href="#activate" aria-label="Permalink to &quot;Activate&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：实现一个缓冲机制，确保 Draw 阶段操作前 Raster 的数据已经准备好</li></ul><h3 id="draw" tabindex="-1">Draw <a class="header-anchor" href="#draw" aria-label="Permalink to &quot;Draw&quot;">​</a></h3><ul><li>进程：渲染进程</li><li>线程：合成（Compositor）线程</li><li>职责：将光栅化之后的图块生成 draw quads 的过程</li></ul><h3 id="aggregate" tabindex="-1">Aggregate <a class="header-anchor" href="#aggregate" aria-label="Permalink to &quot;Aggregate&quot;">​</a></h3><ul><li>进程：Viz 进程</li><li>线程：Display Compositor thread</li><li>职责：接受多个进程传递过来的（CompositorFrame）并进行合成</li></ul><h3 id="display" tabindex="-1">Display <a class="header-anchor" href="#display" aria-label="Permalink to &quot;Display&quot;">​</a></h3><ul><li>进程：Viz 进程</li><li>线程：GUP 主线程</li><li>职责：生成 CompositorFrame 之后，调用 GL 指令把 draw quads 最终输出到屏幕上</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-19T08:13:46.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/interview/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>写在前面</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/interview/metrics.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>性能指标</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/interview/crp.html b/interview/crp.html
index cfb0d59..4e085e5 100644
--- a/interview/crp.html
+++ b/interview/crp.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>关键路径渲染 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/interview_crp.md.7942c988.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/interview_crp.md.20bcf17d.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试指南</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>写在前面</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试相关</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/browser.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>浏览器渲染流水线</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/metrics.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>性能指标</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/crp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>关键路径渲染 CRP</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_interview_crp" data-v-6b87e69f><div><h1 id="关键路径渲染" tabindex="-1">关键路径渲染 <a class="header-anchor" href="#关键路径渲染" aria-label="Permalink to &quot;关键路径渲染&quot;">​</a></h1><p>Critial Rendering Path(CRP)</p><p>浏览器将 HTML、CSS 和 JavaScript 转换为屏幕上的像素所执行的一系列步骤</p><h2 id="浏览器渲染" tabindex="-1">浏览器渲染 <a class="header-anchor" href="#浏览器渲染" aria-label="Permalink to &quot;浏览器渲染&quot;">​</a></h2><p>从浏览器渲染的过程进行理解以及渲染的优化步骤</p><h3 id="dom" tabindex="-1">DOM <a class="header-anchor" href="#dom" aria-label="Permalink to &quot;DOM&quot;">​</a></h3><h3 id="cssom" tabindex="-1">CSSOM <a class="header-anchor" href="#cssom" aria-label="Permalink to &quot;CSSOM&quot;">​</a></h3><h3 id="render-tree" tabindex="-1">Render Tree <a class="header-anchor" href="#render-tree" aria-label="Permalink to &quot;Render Tree&quot;">​</a></h3><h3 id="layout" tabindex="-1">Layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;Layout&quot;">​</a></h3><h3 id="paint" tabindex="-1">Paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;Paint&quot;">​</a></h3><h2 id="优化" tabindex="-1">优化 <a class="header-anchor" href="#优化" aria-label="Permalink to &quot;优化&quot;">​</a></h2><ul><li>async defer 的使用</li><li>优化资源大小数量</li><li>减少关键资源的请求数量以及大小</li><li>设置关键资源的优先级</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-10-25T08:28:11.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/interview/metrics.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>性能指标</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试指南</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>写在前面</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试相关</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/browser.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>浏览器渲染流水线</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/metrics.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>性能指标</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/crp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>关键路径渲染 CRP</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _interview_crp" data-v-6b87e69f><div><h1 id="关键路径渲染" tabindex="-1">关键路径渲染 <a class="header-anchor" href="#关键路径渲染" aria-label="Permalink to &quot;关键路径渲染&quot;">​</a></h1><p>Critial Rendering Path(CRP)</p><p>浏览器将 HTML、CSS 和 JavaScript 转换为屏幕上的像素所执行的一系列步骤</p><h2 id="浏览器渲染" tabindex="-1">浏览器渲染 <a class="header-anchor" href="#浏览器渲染" aria-label="Permalink to &quot;浏览器渲染&quot;">​</a></h2><p>从浏览器渲染的过程进行理解以及渲染的优化步骤</p><h3 id="dom" tabindex="-1">DOM <a class="header-anchor" href="#dom" aria-label="Permalink to &quot;DOM&quot;">​</a></h3><h3 id="cssom" tabindex="-1">CSSOM <a class="header-anchor" href="#cssom" aria-label="Permalink to &quot;CSSOM&quot;">​</a></h3><h3 id="render-tree" tabindex="-1">Render Tree <a class="header-anchor" href="#render-tree" aria-label="Permalink to &quot;Render Tree&quot;">​</a></h3><h3 id="layout" tabindex="-1">Layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;Layout&quot;">​</a></h3><h3 id="paint" tabindex="-1">Paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;Paint&quot;">​</a></h3><h2 id="优化" tabindex="-1">优化 <a class="header-anchor" href="#优化" aria-label="Permalink to &quot;优化&quot;">​</a></h2><ul><li>async defer 的使用</li><li>优化资源大小数量</li><li>减少关键资源的请求数量以及大小</li><li>设置关键资源的优先级</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-10-25T08:28:11.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/interview/metrics.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>性能指标</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/interview/index.html b/interview/index.html
index 867b9e1..665ccd0 100644
--- a/interview/index.html
+++ b/interview/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>面试 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/interview_index.md.e4e6acc5.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/interview_index.md.d69cf835.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试指南</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>写在前面</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试相关</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/browser.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>浏览器渲染流水线</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/metrics.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>性能指标</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/crp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>关键路径渲染 CRP</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_interview_" data-v-6b87e69f><div><h1 id="面试" tabindex="-1">面试 <a class="header-anchor" href="#面试" aria-label="Permalink to &quot;面试&quot;">​</a></h1><blockquote><p>记录一些面试题以及面试经历</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/interview/browser.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>浏览器渲染流水线</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试指南</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>写在前面</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试相关</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/browser.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>浏览器渲染流水线</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/metrics.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>性能指标</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/crp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>关键路径渲染 CRP</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _interview_" data-v-6b87e69f><div><h1 id="面试" tabindex="-1">面试 <a class="header-anchor" href="#面试" aria-label="Permalink to &quot;面试&quot;">​</a></h1><blockquote><p>记录一些面试题以及面试经历</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/interview/browser.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>浏览器渲染流水线</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/interview/metrics.html b/interview/metrics.html
index 933fbe5..2f3047d 100644
--- a/interview/metrics.html
+++ b/interview/metrics.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>性能指标 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/interview_metrics.md.e083096b.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/interview_metrics.md.6cc2fc75.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试指南</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>写在前面</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试相关</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/browser.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>浏览器渲染流水线</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/metrics.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>性能指标</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/interview/crp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>关键路径渲染 CRP</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_interview_metrics" data-v-6b87e69f><div><h1 id="性能指标" tabindex="-1">性能指标 <a class="header-anchor" href="#性能指标" aria-label="Permalink to &quot;性能指标&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>PerformanceObserver &amp; PerformanceEntry</p></div><h2 id="lcp" tabindex="-1">LCP <a class="header-anchor" href="#lcp" aria-label="Permalink to &quot;LCP&quot;">​</a></h2><p>Largest Contentful Paint（最大内容绘制）</p><blockquote><p>最大内容绘制控制在 2.5s 之内</p></blockquote><h3 id="如何衡量" tabindex="-1">如何衡量 <a class="header-anchor" href="#如何衡量" aria-label="Permalink to &quot;如何衡量&quot;">​</a></h3><div class="warning custom-block"><p class="custom-block-title">WARNING</p><p>真正计算的指标存在差异</p></div><blockquote><p>Timing-Allow-Origin 资源指标是否允许跨域收集</p></blockquote><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">PerformanceObserver</span><span style="color:#E1E4E8;">((</span><span style="color:#FFAB70;">entryList</span><span style="color:#E1E4E8;">) </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试指南</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>写在前面</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>面试相关</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/browser.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>浏览器渲染流水线</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/metrics.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>性能指标</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/interview/crp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>关键路径渲染 CRP</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _interview_metrics" data-v-6b87e69f><div><h1 id="性能指标" tabindex="-1">性能指标 <a class="header-anchor" href="#性能指标" aria-label="Permalink to &quot;性能指标&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">TIP</p><p>PerformanceObserver &amp; PerformanceEntry</p></div><h2 id="lcp" tabindex="-1">LCP <a class="header-anchor" href="#lcp" aria-label="Permalink to &quot;LCP&quot;">​</a></h2><p>Largest Contentful Paint（最大内容绘制）</p><blockquote><p>最大内容绘制控制在 2.5s 之内</p></blockquote><h3 id="如何衡量" tabindex="-1">如何衡量 <a class="header-anchor" href="#如何衡量" aria-label="Permalink to &quot;如何衡量&quot;">​</a></h3><div class="warning custom-block"><p class="custom-block-title">WARNING</p><p>真正计算的指标存在差异</p></div><blockquote><p>Timing-Allow-Origin 资源指标是否允许跨域收集</p></blockquote><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">PerformanceObserver</span><span style="color:#E1E4E8;">((</span><span style="color:#FFAB70;">entryList</span><span style="color:#E1E4E8;">) </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">for</span><span style="color:#E1E4E8;"> (</span><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">entry</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">of</span><span style="color:#E1E4E8;"> entryList.</span><span style="color:#B392F0;">getEntries</span><span style="color:#E1E4E8;">()) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">    console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;LCP candidate:&#39;</span><span style="color:#E1E4E8;">, entry.startTime, entry);</span></span>
 <span class="line"><span style="color:#E1E4E8;">  }</span></span>
@@ -25,8 +25,8 @@
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#D73A49;">for</span><span style="color:#24292E;"> (</span><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">entry</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">of</span><span style="color:#24292E;"> entryList.</span><span style="color:#6F42C1;">getEntries</span><span style="color:#24292E;">()) {</span></span>
 <span class="line"><span style="color:#24292E;">    console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;LCP candidate:&#39;</span><span style="color:#24292E;">, entry.startTime, entry);</span></span>
 <span class="line"><span style="color:#24292E;">  }</span></span>
-<span class="line"><span style="color:#24292E;">}).</span><span style="color:#6F42C1;">observe</span><span style="color:#24292E;">({ type: </span><span style="color:#032F62;">&#39;largest-contentful-paint&#39;</span><span style="color:#24292E;">, buffered: </span><span style="color:#005CC5;">true</span><span style="color:#24292E;"> });</span></span></code></pre></div><ul><li>API 会为在后台选项卡中加载的页面分发 largest-contentful-paint 条目，但在计算 LCP 时应忽略这些页面。</li><li>API 在页面转移到后台后，会继续分发 largest-contentful-paint 条目，但在计算 LCP 时应忽略这些条目（只有当页面始终处于前台时才考虑元素）。</li><li>当页面通过往返缓存恢复时，API 不会报告 largest-contentful-paint 条目，但在这些情况下应该测量 LCP，因为这对用户来说是多次不同的页面访问体验。</li><li>API 不考虑 iframe 中的元素，但要想正确测量 LCP，您应该考虑这些元素。子框架可以使用 API 将这些元素的 largest-contentful-paint 条目报告给父框架来进行聚合。</li></ul><h3 id="改进" tabindex="-1">改进 <a class="header-anchor" href="#改进" aria-label="Permalink to &quot;改进&quot;">​</a></h3><blockquote><p>因素</p></blockquote><ul><li>服务器响应速度</li><li>JavaScript 和 CSS 渲染阻塞</li><li>资源加载时间</li><li>客户端渲染</li></ul><blockquote><p>优化 LCP</p></blockquote><ul><li>PRPL</li><li>优化关键渲染路径</li><li>优化 CSS</li><li>图像</li><li>网页字体</li><li>JavaScript</li></ul><h3 id="测量工具" tabindex="-1">测量工具 <a class="header-anchor" href="#测量工具" aria-label="Permalink to &quot;测量工具&quot;">​</a></h3><blockquote><p>实测工具</p></blockquote><ul><li>web-vitals JavaScript 库</li><li>PageSpeed Insights 网页速度测量工具</li><li>Search Console</li></ul><blockquote><p>实验室工具</p></blockquote><ul><li>chrome 开发者工具</li><li>Lighthouse</li><li>PageSpeed Insights</li><li>WebPageTest</li></ul><h2 id="fp" tabindex="-1">FP <a class="header-anchor" href="#fp" aria-label="Permalink to &quot;FP&quot;">​</a></h2><p>First Paint</p><h2 id="fcp" tabindex="-1">FCP <a class="header-anchor" href="#fcp" aria-label="Permalink to &quot;FCP&quot;">​</a></h2><p>First Contentful Paint</p><h2 id="dcl" tabindex="-1">DCL <a class="header-anchor" href="#dcl" aria-label="Permalink to &quot;DCL&quot;">​</a></h2><p>DomContentLoaded</p><h2 id="fmp" tabindex="-1">FMP <a class="header-anchor" href="#fmp" aria-label="Permalink to &quot;FMP&quot;">​</a></h2><p>First Meaningful Paint</p><h2 id="l" tabindex="-1">L <a class="header-anchor" href="#l" aria-label="Permalink to &quot;L&quot;">​</a></h2><p>onLoad</p><h2 id="tti" tabindex="-1">TTI <a class="header-anchor" href="#tti" aria-label="Permalink to &quot;TTI&quot;">​</a></h2><p>Time to Interactive</p><h2 id="tbt" tabindex="-1">TBT <a class="header-anchor" href="#tbt" aria-label="Permalink to &quot;TBT&quot;">​</a></h2><p>Total Blocking Time</p><h2 id="fid" tabindex="-1">FID <a class="header-anchor" href="#fid" aria-label="Permalink to &quot;FID&quot;">​</a></h2><p>First Input Delay</p><h2 id="cls" tabindex="-1">CLS <a class="header-anchor" href="#cls" aria-label="Permalink to &quot;CLS&quot;">​</a></h2><p>Cumulative Layout Shift 累计布局偏移</p><h2 id="si" tabindex="-1">SI <a class="header-anchor" href="#si" aria-label="Permalink to &quot;SI&quot;">​</a></h2><p>Speed Index</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-02-02T08:56:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/interview/browser.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>浏览器渲染流水线</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/interview/crp.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>关键路径渲染 CRP</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}).</span><span style="color:#6F42C1;">observe</span><span style="color:#24292E;">({ type: </span><span style="color:#032F62;">&#39;largest-contentful-paint&#39;</span><span style="color:#24292E;">, buffered: </span><span style="color:#005CC5;">true</span><span style="color:#24292E;"> });</span></span></code></pre></div><ul><li>API 会为在后台选项卡中加载的页面分发 largest-contentful-paint 条目，但在计算 LCP 时应忽略这些页面。</li><li>API 在页面转移到后台后，会继续分发 largest-contentful-paint 条目，但在计算 LCP 时应忽略这些条目（只有当页面始终处于前台时才考虑元素）。</li><li>当页面通过往返缓存恢复时，API 不会报告 largest-contentful-paint 条目，但在这些情况下应该测量 LCP，因为这对用户来说是多次不同的页面访问体验。</li><li>API 不考虑 iframe 中的元素，但要想正确测量 LCP，您应该考虑这些元素。子框架可以使用 API 将这些元素的 largest-contentful-paint 条目报告给父框架来进行聚合。</li></ul><h3 id="改进" tabindex="-1">改进 <a class="header-anchor" href="#改进" aria-label="Permalink to &quot;改进&quot;">​</a></h3><blockquote><p>因素</p></blockquote><ul><li>服务器响应速度</li><li>JavaScript 和 CSS 渲染阻塞</li><li>资源加载时间</li><li>客户端渲染</li></ul><blockquote><p>优化 LCP</p></blockquote><ul><li>PRPL</li><li>优化关键渲染路径</li><li>优化 CSS</li><li>图像</li><li>网页字体</li><li>JavaScript</li></ul><h3 id="测量工具" tabindex="-1">测量工具 <a class="header-anchor" href="#测量工具" aria-label="Permalink to &quot;测量工具&quot;">​</a></h3><blockquote><p>实测工具</p></blockquote><ul><li>web-vitals JavaScript 库</li><li>PageSpeed Insights 网页速度测量工具</li><li>Search Console</li></ul><blockquote><p>实验室工具</p></blockquote><ul><li>chrome 开发者工具</li><li>Lighthouse</li><li>PageSpeed Insights</li><li>WebPageTest</li></ul><h2 id="fp" tabindex="-1">FP <a class="header-anchor" href="#fp" aria-label="Permalink to &quot;FP&quot;">​</a></h2><p>First Paint</p><h2 id="fcp" tabindex="-1">FCP <a class="header-anchor" href="#fcp" aria-label="Permalink to &quot;FCP&quot;">​</a></h2><p>First Contentful Paint</p><h2 id="dcl" tabindex="-1">DCL <a class="header-anchor" href="#dcl" aria-label="Permalink to &quot;DCL&quot;">​</a></h2><p>DomContentLoaded</p><h2 id="fmp" tabindex="-1">FMP <a class="header-anchor" href="#fmp" aria-label="Permalink to &quot;FMP&quot;">​</a></h2><p>First Meaningful Paint</p><h2 id="l" tabindex="-1">L <a class="header-anchor" href="#l" aria-label="Permalink to &quot;L&quot;">​</a></h2><p>onLoad</p><h2 id="tti" tabindex="-1">TTI <a class="header-anchor" href="#tti" aria-label="Permalink to &quot;TTI&quot;">​</a></h2><p>Time to Interactive</p><h2 id="tbt" tabindex="-1">TBT <a class="header-anchor" href="#tbt" aria-label="Permalink to &quot;TBT&quot;">​</a></h2><p>Total Blocking Time</p><h2 id="fid" tabindex="-1">FID <a class="header-anchor" href="#fid" aria-label="Permalink to &quot;FID&quot;">​</a></h2><p>First Input Delay</p><h2 id="cls" tabindex="-1">CLS <a class="header-anchor" href="#cls" aria-label="Permalink to &quot;CLS&quot;">​</a></h2><p>Cumulative Layout Shift 累计布局偏移</p><h2 id="si" tabindex="-1">SI <a class="header-anchor" href="#si" aria-label="Permalink to &quot;SI&quot;">​</a></h2><p>Speed Index</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-02-02T08:56:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/interview/browser.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>浏览器渲染流水线</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/interview/crp.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>关键路径渲染 CRP</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/cookie.html b/network/cookie.html
index a2a8243..2850fac 100644
--- a/network/cookie.html
+++ b/network/cookie.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Cookies | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_cookie.md.14ec33fe.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_cookie.md.9860852e.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_cookie" data-v-6b87e69f><div><h1 id="cookies" tabindex="-1">Cookies <a class="header-anchor" href="#cookies" aria-label="Permalink to &quot;Cookies&quot;">​</a></h1><p>基于 HTTP 协议：由一系列字符串组成，存储在客户端（不能超过 4kb），客户端和服务端建立安全通信验证</p><h2 id="读取" tabindex="-1">读取 <a class="header-anchor" href="#读取" aria-label="Permalink to &quot;读取&quot;">​</a></h2><p>带有 http-only 属性的 cookie 不能被读取</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">alert</span><span style="color:#E1E4E8;">(document.cookie);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">alert</span><span style="color:#24292E;">(document.cookie);</span></span></code></pre></div><h2 id="写入" tabindex="-1">写入 <a class="header-anchor" href="#写入" aria-label="Permalink to &quot;写入&quot;">​</a></h2><p>已经存在的 cookie 不会被删除</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">document.cookie </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;user=name&#39;</span><span style="color:#E1E4E8;">;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_cookie" data-v-6b87e69f><div><h1 id="cookies" tabindex="-1">Cookies <a class="header-anchor" href="#cookies" aria-label="Permalink to &quot;Cookies&quot;">​</a></h1><p>基于 HTTP 协议：由一系列字符串组成，存储在客户端（不能超过 4kb），客户端和服务端建立安全通信验证</p><h2 id="读取" tabindex="-1">读取 <a class="header-anchor" href="#读取" aria-label="Permalink to &quot;读取&quot;">​</a></h2><p>带有 http-only 属性的 cookie 不能被读取</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">alert</span><span style="color:#E1E4E8;">(document.cookie);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">alert</span><span style="color:#24292E;">(document.cookie);</span></span></code></pre></div><h2 id="写入" tabindex="-1">写入 <a class="header-anchor" href="#写入" aria-label="Permalink to &quot;写入&quot;">​</a></h2><p>已经存在的 cookie 不会被删除</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">document.cookie </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;user=name&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// 设置多个 cookie 使用分号空格（: ）隔开</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">document.cookie </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;user=name&#39;</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// 设置多个 cookie 使用分号空格（: ）隔开</span></span></code></pre></div><h2 id="path" tabindex="-1">path <a class="header-anchor" href="#path" aria-label="Permalink to &quot;path&quot;">​</a></h2><p>当前设置的 cookie 在 path 的匹配下才可携带，默认为当前的 url</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// path=/admin 匹配 /admin/anything</span></span>
 <span class="line"><span style="color:#E1E4E8;">document.cookie </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;user=name;path=/admin&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// path=/admin 匹配 /admin/anything</span></span>
@@ -27,8 +27,8 @@
 <span class="line"><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">date</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">Date</span><span style="color:#24292E;">(Date.</span><span style="color:#6F42C1;">now</span><span style="color:#24292E;">() </span><span style="color:#D73A49;">+</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">86400e3</span><span style="color:#24292E;">).</span><span style="color:#6F42C1;">toUTCString</span><span style="color:#24292E;">();</span></span>
 <span class="line"><span style="color:#24292E;">document.cookie </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;user=name; expires=&#39;</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">+</span><span style="color:#24292E;"> date;</span></span></code></pre></div><h3 id="max-age" tabindex="-1">max-age <a class="header-anchor" href="#max-age" aria-label="Permalink to &quot;max-age&quot;">​</a></h3><p>接收多少秒</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 设置300s</span></span>
 <span class="line"><span style="color:#E1E4E8;">document.cookie </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;user=name; max-age=300&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// 设置300s</span></span>
-<span class="line"><span style="color:#24292E;">document.cookie </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;user=name; max-age=300&#39;</span><span style="color:#24292E;">;</span></span></code></pre></div><h2 id="secure" tabindex="-1">secure <a class="header-anchor" href="#secure" aria-label="Permalink to &quot;secure&quot;">​</a></h2><p>用于 HTTPS 传输携带</p><h2 id="samesite" tabindex="-1">samesite <a class="header-anchor" href="#samesite" aria-label="Permalink to &quot;samesite&quot;">​</a></h2><p>设置 httpOnly 属性, 防止 XSRF（cross-site request forgery）跨站攻击</p><ul><li>Strict === samesite</li><li>Lax 默认值</li></ul><table><thead><tr><th>请求类型</th><th>示例</th><th>正常情况</th><th>Lax</th></tr></thead><tbody><tr><td>链接</td><td><code>&lt;a href=&quot;...&quot;&gt;&lt;/a&gt;</code></td><td>发送</td><td>发送</td></tr><tr><td>预加载</td><td><code>&lt;link rel=&quot;prerender&quot; href=&quot;...&quot;&gt;&lt;/a&gt;</code></td><td>发送</td><td>发送</td></tr><tr><td>GET 表单</td><td><code>&lt;a method=&quot;GET&quot; action=&quot;...&quot;&gt;&lt;/a&gt;</code></td><td>发送</td><td>发送</td></tr><tr><td>POST 表单</td><td><code>&lt;form method=&quot;POST&quot; action=&quot;...&quot;&gt;&lt;/form&gt;</code></td><td>发送</td><td>不发送</td></tr><tr><td>iframe</td><td><code>&lt;iframe src=&quot;...&quot;&gt;&lt;/iframe&gt;</code></td><td>发送</td><td>不发送</td></tr><tr><td>AJAX</td><td><code>$.get()</code></td><td>发送</td><td>不发送</td></tr><tr><td>Image</td><td><code>&lt;img src=&quot;...&quot; /</code></td><td>发送</td><td>不发送</td></tr></tbody></table><ul><li>None</li></ul><h3 id="httponly" tabindex="-1">httpOnly <a class="header-anchor" href="#httponly" aria-label="Permalink to &quot;httpOnly&quot;">​</a></h3><p>设置 httpOnly 的 cookie 不能被 Javascript 读取访问</p><h2 id="第三方-cookie" tabindex="-1">第三方 cookie <a class="header-anchor" href="#第三方-cookie" aria-label="Permalink to &quot;第三方 cookie&quot;">​</a></h2><p>是否允许第三方网站设置 cookie</p><blockquote><p>注意</p></blockquote><p><code>如果一个脚本来自不同的域，设置的 cookie 仅属于当前域名和当前页</code></p><ul><li>Safari 不被允许</li><li>Firefox 黑名单不被允许</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>基础</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/cors.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Cors</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">document.cookie </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;user=name; max-age=300&#39;</span><span style="color:#24292E;">;</span></span></code></pre></div><h2 id="secure" tabindex="-1">secure <a class="header-anchor" href="#secure" aria-label="Permalink to &quot;secure&quot;">​</a></h2><p>用于 HTTPS 传输携带</p><h2 id="samesite" tabindex="-1">samesite <a class="header-anchor" href="#samesite" aria-label="Permalink to &quot;samesite&quot;">​</a></h2><p>设置 httpOnly 属性, 防止 XSRF（cross-site request forgery）跨站攻击</p><ul><li>Strict === samesite</li><li>Lax 默认值</li></ul><table><thead><tr><th>请求类型</th><th>示例</th><th>正常情况</th><th>Lax</th></tr></thead><tbody><tr><td>链接</td><td><code>&lt;a href=&quot;...&quot;&gt;&lt;/a&gt;</code></td><td>发送</td><td>发送</td></tr><tr><td>预加载</td><td><code>&lt;link rel=&quot;prerender&quot; href=&quot;...&quot;&gt;&lt;/a&gt;</code></td><td>发送</td><td>发送</td></tr><tr><td>GET 表单</td><td><code>&lt;a method=&quot;GET&quot; action=&quot;...&quot;&gt;&lt;/a&gt;</code></td><td>发送</td><td>发送</td></tr><tr><td>POST 表单</td><td><code>&lt;form method=&quot;POST&quot; action=&quot;...&quot;&gt;&lt;/form&gt;</code></td><td>发送</td><td>不发送</td></tr><tr><td>iframe</td><td><code>&lt;iframe src=&quot;...&quot;&gt;&lt;/iframe&gt;</code></td><td>发送</td><td>不发送</td></tr><tr><td>AJAX</td><td><code>$.get()</code></td><td>发送</td><td>不发送</td></tr><tr><td>Image</td><td><code>&lt;img src=&quot;...&quot; /</code></td><td>发送</td><td>不发送</td></tr></tbody></table><ul><li>None</li></ul><h3 id="httponly" tabindex="-1">httpOnly <a class="header-anchor" href="#httponly" aria-label="Permalink to &quot;httpOnly&quot;">​</a></h3><p>设置 httpOnly 的 cookie 不能被 Javascript 读取访问</p><h2 id="第三方-cookie" tabindex="-1">第三方 cookie <a class="header-anchor" href="#第三方-cookie" aria-label="Permalink to &quot;第三方 cookie&quot;">​</a></h2><p>是否允许第三方网站设置 cookie</p><blockquote><p>注意</p></blockquote><p><code>如果一个脚本来自不同的域，设置的 cookie 仅属于当前域名和当前页</code></p><ul><li>Safari 不被允许</li><li>Firefox 黑名单不被允许</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>基础</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/cors.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Cors</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/cors.html b/network/cors.html
index 4d5db10..d800e8e 100644
--- a/network/cors.html
+++ b/network/cors.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>CORS | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_cors.md.974416e8.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_cors.md.597b0a96.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_cors" data-v-6b87e69f><div><h1 id="cors" tabindex="-1">CORS <a class="header-anchor" href="#cors" aria-label="Permalink to &quot;CORS&quot;">​</a></h1><p>Cross-Origin Resource Sharing 跨域资源共享</p><div class="tip custom-block"><p class="custom-block-title">定义</p><p>由一系列传输的 Http Headers 头组成，这些 Http 头决定浏览器是否阻止前端 JavaScript 代码获取跨域请求的响应。</p></div><h2 id="cors-headers" tabindex="-1">Cors Headers <a class="header-anchor" href="#cors-headers" aria-label="Permalink to &quot;Cors Headers&quot;">​</a></h2><p>cors headers 给 web 服务器权限，允许跨域请求访问到它们的资源</p><h3 id="access-control-allow-origin" tabindex="-1">Access-Control-Allow-Origin <a class="header-anchor" href="#access-control-allow-origin" aria-label="Permalink to &quot;Access-Control-Allow-Origin&quot;">​</a></h3><p>指示请求的资源能共享给哪些域</p><h3 id="access-control-allow-credentials" tabindex="-1">Access-Control-Allow-Credentials <a class="header-anchor" href="#access-control-allow-credentials" aria-label="Permalink to &quot;Access-Control-Allow-Credentials&quot;">​</a></h3><p>指示当请求的凭证标记为 true 时，是否响应该请求</p><h3 id="access-control-allow-headers" tabindex="-1">Access-Control-Allow-Headers <a class="header-anchor" href="#access-control-allow-headers" aria-label="Permalink to &quot;Access-Control-Allow-Headers&quot;">​</a></h3><p>用在对预请求的响应中，指示实际的请求中可以使用哪些 HTTP 头</p><h3 id="access-control-allow-methods" tabindex="-1">Access-Control-Allow-Methods <a class="header-anchor" href="#access-control-allow-methods" aria-label="Permalink to &quot;Access-Control-Allow-Methods&quot;">​</a></h3><p>指定对预请求的响应中，哪些 HTTP 方法允许访问请求的资源</p><h3 id="access-control-expose-headers" tabindex="-1">Access-Control-Expose-Headers <a class="header-anchor" href="#access-control-expose-headers" aria-label="Permalink to &quot;Access-Control-Expose-Headers&quot;">​</a></h3><p>指示哪些 HTTP 头的名称能在响应中列出</p><h3 id="access-control-max-age" tabindex="-1">Access-Control-Max-Age <a class="header-anchor" href="#access-control-max-age" aria-label="Permalink to &quot;Access-Control-Max-Age&quot;">​</a></h3><p>指示预请求的结果能被缓存多久</p><h3 id="access-control-request-headers" tabindex="-1">Access-Control-Request-Headers <a class="header-anchor" href="#access-control-request-headers" aria-label="Permalink to &quot;Access-Control-Request-Headers&quot;">​</a></h3><p>用于发起一个预请求，告知服务器正式请求会使用哪些 HTTP 头</p><h3 id="access-control-request-method" tabindex="-1">Access-Control-Request-Method <a class="header-anchor" href="#access-control-request-method" aria-label="Permalink to &quot;Access-Control-Request-Method&quot;">​</a></h3><p>用于发起一个预请求，告知服务器正式请求会使用哪一种 HTTP 请求方法</p><h3 id="origin" tabindex="-1">Origin <a class="header-anchor" href="#origin" aria-label="Permalink to &quot;Origin&quot;">​</a></h3><p>指示获取资源的请求是从什么域发起的</p><h2 id="同源策略" tabindex="-1">同源策略 <a class="header-anchor" href="#同源策略" aria-label="Permalink to &quot;同源策略&quot;">​</a></h2><p>same-origin 如果两个 URL 的 protocol、port 和 host 都相同的话，则这两个 URL 同源。</p><h3 id="document-domain" tabindex="-1">document.domain <a class="header-anchor" href="#document-domain" aria-label="Permalink to &quot;document.domain&quot;">​</a></h3><p>允许获取当前页面的域名以及设置域名下的子域名（同源）</p><h2 id="跨域访问的几种方式" tabindex="-1">跨域访问的几种方式 <a class="header-anchor" href="#跨域访问的几种方式" aria-label="Permalink to &quot;跨域访问的几种方式&quot;">​</a></h2><h3 id="window-postmessage" tabindex="-1">window.postMessage <a class="header-anchor" href="#window-postmessage" aria-label="Permalink to &quot;window.postMessage&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">otherWindow.</span><span style="color:#B392F0;">postMessage</span><span style="color:#E1E4E8;">(message, targetOrigin, [transfer]);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">otherWindow.</span><span style="color:#6F42C1;">postMessage</span><span style="color:#24292E;">(message, targetOrigin, [transfer]);</span></span></code></pre></div><ul><li>otherWindow 对象</li></ul><p>其他窗口的一个引用，如：iframe.contentWindow、window.open(...) 返回的窗口对象、或者是命名过或数值索引的 window.frames</p><ul><li>message</li></ul><p>将要发送到其他 window 的数据。</p><ul><li>targetOrigin</li></ul><p>哪些域名可以被允许发送消息</p><ul><li>transfer</li></ul><p>Transferable 对象</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// http://test.com</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_cors" data-v-6b87e69f><div><h1 id="cors" tabindex="-1">CORS <a class="header-anchor" href="#cors" aria-label="Permalink to &quot;CORS&quot;">​</a></h1><p>Cross-Origin Resource Sharing 跨域资源共享</p><div class="tip custom-block"><p class="custom-block-title">定义</p><p>由一系列传输的 Http Headers 头组成，这些 Http 头决定浏览器是否阻止前端 JavaScript 代码获取跨域请求的响应。</p></div><h2 id="cors-headers" tabindex="-1">Cors Headers <a class="header-anchor" href="#cors-headers" aria-label="Permalink to &quot;Cors Headers&quot;">​</a></h2><p>cors headers 给 web 服务器权限，允许跨域请求访问到它们的资源</p><h3 id="access-control-allow-origin" tabindex="-1">Access-Control-Allow-Origin <a class="header-anchor" href="#access-control-allow-origin" aria-label="Permalink to &quot;Access-Control-Allow-Origin&quot;">​</a></h3><p>指示请求的资源能共享给哪些域</p><h3 id="access-control-allow-credentials" tabindex="-1">Access-Control-Allow-Credentials <a class="header-anchor" href="#access-control-allow-credentials" aria-label="Permalink to &quot;Access-Control-Allow-Credentials&quot;">​</a></h3><p>指示当请求的凭证标记为 true 时，是否响应该请求</p><h3 id="access-control-allow-headers" tabindex="-1">Access-Control-Allow-Headers <a class="header-anchor" href="#access-control-allow-headers" aria-label="Permalink to &quot;Access-Control-Allow-Headers&quot;">​</a></h3><p>用在对预请求的响应中，指示实际的请求中可以使用哪些 HTTP 头</p><h3 id="access-control-allow-methods" tabindex="-1">Access-Control-Allow-Methods <a class="header-anchor" href="#access-control-allow-methods" aria-label="Permalink to &quot;Access-Control-Allow-Methods&quot;">​</a></h3><p>指定对预请求的响应中，哪些 HTTP 方法允许访问请求的资源</p><h3 id="access-control-expose-headers" tabindex="-1">Access-Control-Expose-Headers <a class="header-anchor" href="#access-control-expose-headers" aria-label="Permalink to &quot;Access-Control-Expose-Headers&quot;">​</a></h3><p>指示哪些 HTTP 头的名称能在响应中列出</p><h3 id="access-control-max-age" tabindex="-1">Access-Control-Max-Age <a class="header-anchor" href="#access-control-max-age" aria-label="Permalink to &quot;Access-Control-Max-Age&quot;">​</a></h3><p>指示预请求的结果能被缓存多久</p><h3 id="access-control-request-headers" tabindex="-1">Access-Control-Request-Headers <a class="header-anchor" href="#access-control-request-headers" aria-label="Permalink to &quot;Access-Control-Request-Headers&quot;">​</a></h3><p>用于发起一个预请求，告知服务器正式请求会使用哪些 HTTP 头</p><h3 id="access-control-request-method" tabindex="-1">Access-Control-Request-Method <a class="header-anchor" href="#access-control-request-method" aria-label="Permalink to &quot;Access-Control-Request-Method&quot;">​</a></h3><p>用于发起一个预请求，告知服务器正式请求会使用哪一种 HTTP 请求方法</p><h3 id="origin" tabindex="-1">Origin <a class="header-anchor" href="#origin" aria-label="Permalink to &quot;Origin&quot;">​</a></h3><p>指示获取资源的请求是从什么域发起的</p><h2 id="同源策略" tabindex="-1">同源策略 <a class="header-anchor" href="#同源策略" aria-label="Permalink to &quot;同源策略&quot;">​</a></h2><p>same-origin 如果两个 URL 的 protocol、port 和 host 都相同的话，则这两个 URL 同源。</p><h3 id="document-domain" tabindex="-1">document.domain <a class="header-anchor" href="#document-domain" aria-label="Permalink to &quot;document.domain&quot;">​</a></h3><p>允许获取当前页面的域名以及设置域名下的子域名（同源）</p><h2 id="跨域访问的几种方式" tabindex="-1">跨域访问的几种方式 <a class="header-anchor" href="#跨域访问的几种方式" aria-label="Permalink to &quot;跨域访问的几种方式&quot;">​</a></h2><h3 id="window-postmessage" tabindex="-1">window.postMessage <a class="header-anchor" href="#window-postmessage" aria-label="Permalink to &quot;window.postMessage&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">otherWindow.</span><span style="color:#B392F0;">postMessage</span><span style="color:#E1E4E8;">(message, targetOrigin, [transfer]);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">otherWindow.</span><span style="color:#6F42C1;">postMessage</span><span style="color:#24292E;">(message, targetOrigin, [transfer]);</span></span></code></pre></div><ul><li>otherWindow 对象</li></ul><p>其他窗口的一个引用，如：iframe.contentWindow、window.open(...) 返回的窗口对象、或者是命名过或数值索引的 window.frames</p><ul><li>message</li></ul><p>将要发送到其他 window 的数据。</p><ul><li>targetOrigin</li></ul><p>哪些域名可以被允许发送消息</p><ul><li>transfer</li></ul><p>Transferable 对象</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// http://test.com</span></span>
 <span class="line"><span style="color:#6A737D;">// 发送方</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> popup </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> window.</span><span style="color:#B392F0;">open</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;http://test.com:8080&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">popup.</span><span style="color:#B392F0;">postMessage</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;hello&#39;</span><span style="color:#E1E4E8;">, </span><span style="color:#9ECBFF;">&#39;http://test.com&#39;</span><span style="color:#E1E4E8;">);</span></span>
@@ -55,8 +55,8 @@
 <span class="line"><span style="color:#24292E;">  }</span></span>
 <span class="line"><span style="color:#24292E;">  event.source.</span><span style="color:#6F42C1;">postMessage</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;world&#39;</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">+</span><span style="color:#24292E;"> event.origin);</span></span>
 <span class="line"><span style="color:#24292E;">}</span></span>
-<span class="line"><span style="color:#24292E;">window.</span><span style="color:#6F42C1;">addEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;message&#39;</span><span style="color:#24292E;">, receiveMessage, </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">);</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/cookie.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Cookie</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/dhcp.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>DHCP</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">window.</span><span style="color:#6F42C1;">addEventListener</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;message&#39;</span><span style="color:#24292E;">, receiveMessage, </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">);</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/cookie.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Cookie</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/dhcp.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>DHCP</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/dhcp.html b/network/dhcp.html
index 3ae6d5d..7d31f43 100644
--- a/network/dhcp.html
+++ b/network/dhcp.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>DHCP | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_dhcp.md.2beb2a5b.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_dhcp.md.36ba0d0c.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_dhcp" data-v-6b87e69f><div><h1 id="dhcp" tabindex="-1">DHCP <a class="header-anchor" href="#dhcp" aria-label="Permalink to &quot;DHCP&quot;">​</a></h1><p>动态主机配置协议（DHCP) - dynamic host configuration protocol</p><h2 id="如何配置-ip-地址" tabindex="-1">如何配置 IP 地址 <a class="header-anchor" href="#如何配置-ip-地址" aria-label="Permalink to &quot;如何配置 IP 地址&quot;">​</a></h2><blockquote><p>手动配置</p></blockquote><ul><li>net-tools</li></ul><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ifconfig</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">eth1</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">10.0</span><span style="color:#9ECBFF;">.0.1/24</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_dhcp" data-v-6b87e69f><div><h1 id="dhcp" tabindex="-1">DHCP <a class="header-anchor" href="#dhcp" aria-label="Permalink to &quot;DHCP&quot;">​</a></h1><p>动态主机配置协议（DHCP) - dynamic host configuration protocol</p><h2 id="如何配置-ip-地址" tabindex="-1">如何配置 IP 地址 <a class="header-anchor" href="#如何配置-ip-地址" aria-label="Permalink to &quot;如何配置 IP 地址&quot;">​</a></h2><blockquote><p>手动配置</p></blockquote><ul><li>net-tools</li></ul><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ifconfig</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">eth1</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">10.0</span><span style="color:#9ECBFF;">.0.1/24</span></span>
 <span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ifconfig</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">eth1</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">up</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">sudo</span><span style="color:#24292E;"> </span><span style="color:#032F62;">ifconfig</span><span style="color:#24292E;"> </span><span style="color:#032F62;">eth1</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">10.0</span><span style="color:#032F62;">.0.1/24</span></span>
 <span class="line"><span style="color:#6F42C1;">sudo</span><span style="color:#24292E;"> </span><span style="color:#032F62;">ifconfig</span><span style="color:#24292E;"> </span><span style="color:#032F62;">eth1</span><span style="color:#24292E;"> </span><span style="color:#032F62;">up</span></span></code></pre></div><ul><li>iproute2</li></ul><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ip</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">addr</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">add</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">10.0</span><span style="color:#9ECBFF;">.0.1/24</span></span>
 <span class="line"><span style="color:#B392F0;">sudo</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">ip</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">link</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">set</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">up</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">eth1</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">sudo</span><span style="color:#24292E;"> </span><span style="color:#032F62;">ip</span><span style="color:#24292E;"> </span><span style="color:#032F62;">addr</span><span style="color:#24292E;"> </span><span style="color:#032F62;">add</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">10.0</span><span style="color:#032F62;">.0.1/24</span></span>
@@ -49,8 +49,8 @@
 <span class="line"><span style="color:#24292E;">	</span><span style="color:#6F42C1;">range</span><span style="color:#24292E;"> </span><span style="color:#032F62;">dynamic-bootp</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">192.168</span><span style="color:#032F62;">.1.240</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">192.168</span><span style="color:#032F62;">.1.250</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">	</span><span style="color:#6F42C1;">filename</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&quot;pxelinux.0&quot;</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">	</span><span style="color:#6F42C1;">next-server</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">192.168</span><span style="color:#032F62;">.1.180</span><span style="color:#24292E;">;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><ul><li>next-server</li></ul><p>要使用 PXE，需要配置 next-server，指向 PXE 服务器的地址，另外要配置初始启动文件 filename</p><h3 id="pxe-工作过程" tabindex="-1">PXE 工作过程 <a class="header-anchor" href="#pxe-工作过程" aria-label="Permalink to &quot;PXE 工作过程&quot;">​</a></h3><ol><li>启动 PXE 客户端</li><li>DHCP Server 分配一个 IP 地址、PXE 服务器的地址、启动文件 pxelinus.0</li><li>PXE 客户端向 TFTP 服务器请求下载文件</li><li>下载完毕，执行文件（文件会指向 PXE 客户端，向 TFTP 服务器请求计算机的配置信息 pxelinux.cfg），TFTP 服务器会给 PXE 客户端一个配置文件包括内核、initramfs，PXE 客户端会请求这些文件</li><li>启动 Linux 内核</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/cors.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Cors</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/ip_addr.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>IP 地址</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><ul><li>next-server</li></ul><p>要使用 PXE，需要配置 next-server，指向 PXE 服务器的地址，另外要配置初始启动文件 filename</p><h3 id="pxe-工作过程" tabindex="-1">PXE 工作过程 <a class="header-anchor" href="#pxe-工作过程" aria-label="Permalink to &quot;PXE 工作过程&quot;">​</a></h3><ol><li>启动 PXE 客户端</li><li>DHCP Server 分配一个 IP 地址、PXE 服务器的地址、启动文件 pxelinus.0</li><li>PXE 客户端向 TFTP 服务器请求下载文件</li><li>下载完毕，执行文件（文件会指向 PXE 客户端，向 TFTP 服务器请求计算机的配置信息 pxelinux.cfg），TFTP 服务器会给 PXE 客户端一个配置文件包括内核、initramfs，PXE 客户端会请求这些文件</li><li>启动 Linux 内核</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/cors.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Cors</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/ip_addr.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>IP 地址</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/index.html b/network/index.html
index b44e121..24358d6 100644
--- a/network/index.html
+++ b/network/index.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>网络协议 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_index.md.ac3e7452.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_index.md.a4ce8b20.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_" data-v-6b87e69f><div><h1 id="网络协议" tabindex="-1">网络协议 <a class="header-anchor" href="#网络协议" aria-label="Permalink to &quot;网络协议&quot;">​</a></h1><h2 id="常见网络协议" tabindex="-1">常见网络协议 <a class="header-anchor" href="#常见网络协议" aria-label="Permalink to &quot;常见网络协议&quot;">​</a></h2><table><thead><tr><th>架构</th><th>网络协议例子</th></tr></thead><tbody><tr><td>应用层</td><td>DHCP HTTP HTTPS RTMP P2P DNS GTP RPC</td></tr><tr><td>传输层</td><td>UDP TCP</td></tr><tr><td>网络层</td><td>ICMP IP OSPF BGP IPSec GRE</td></tr><tr><td>链路层</td><td>ARP VLAN STP</td></tr><tr><td>物理层</td><td>网络跳线</td></tr></tbody></table><h2 id="ip-地址" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h2><blockquote><p>ifconfig/ipconfig</p></blockquote><p>mac ifconfig</p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">lo0:</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">flags=</span><span style="color:#79B8FF;">8049</span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">UP,LOOPBACK,RUNNING,MULTICAS</span><span style="color:#E1E4E8;">T</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">mtu</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">16384</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_" data-v-6b87e69f><div><h1 id="网络协议" tabindex="-1">网络协议 <a class="header-anchor" href="#网络协议" aria-label="Permalink to &quot;网络协议&quot;">​</a></h1><h2 id="常见网络协议" tabindex="-1">常见网络协议 <a class="header-anchor" href="#常见网络协议" aria-label="Permalink to &quot;常见网络协议&quot;">​</a></h2><table><thead><tr><th>架构</th><th>网络协议例子</th></tr></thead><tbody><tr><td>应用层</td><td>DHCP HTTP HTTPS RTMP P2P DNS GTP RPC</td></tr><tr><td>传输层</td><td>UDP TCP</td></tr><tr><td>网络层</td><td>ICMP IP OSPF BGP IPSec GRE</td></tr><tr><td>链路层</td><td>ARP VLAN STP</td></tr><tr><td>物理层</td><td>网络跳线</td></tr></tbody></table><h2 id="ip-地址" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h2><blockquote><p>ifconfig/ipconfig</p></blockquote><p>mac ifconfig</p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">lo0:</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">flags=</span><span style="color:#79B8FF;">8049</span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">UP,LOOPBACK,RUNNING,MULTICAS</span><span style="color:#E1E4E8;">T</span><span style="color:#F97583;">&gt;</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">mtu</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">16384</span></span>
 <span class="line"><span style="color:#E1E4E8;">	options</span><span style="color:#F97583;">=</span><span style="color:#79B8FF;">1203</span><span style="color:#F97583;">&lt;</span><span style="color:#9ECBFF;">RXCSUM,TXCSUM,TXSTATUS,SW_TIMESTAM</span><span style="color:#E1E4E8;">P</span><span style="color:#F97583;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">	</span><span style="color:#B392F0;">inet</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">127.0</span><span style="color:#9ECBFF;">.0.1</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">netmask</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">0xff000000</span></span>
 <span class="line"><span style="color:#E1E4E8;">	</span><span style="color:#B392F0;">inet6</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">::1</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">prefixlen</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">128</span></span>
@@ -149,8 +149,8 @@
 <span class="line"><span style="color:#24292E;">	</span><span style="color:#6F42C1;">nd6</span><span style="color:#24292E;"> </span><span style="color:#032F62;">options=</span><span style="color:#005CC5;">201</span><span style="color:#D73A49;">&lt;</span><span style="color:#032F62;">PERFORMNUD,DA</span><span style="color:#24292E;">D</span><span style="color:#D73A49;">&gt;</span></span>
 <span class="line"><span style="color:#6F42C1;">utun1:</span><span style="color:#24292E;"> </span><span style="color:#032F62;">flags=</span><span style="color:#005CC5;">8051</span><span style="color:#D73A49;">&lt;</span><span style="color:#032F62;">UP,POINTOPOINT,RUNNING,MULTICAS</span><span style="color:#24292E;">T</span><span style="color:#D73A49;">&gt;</span><span style="color:#24292E;"> </span><span style="color:#032F62;">mtu</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">2000</span></span>
 <span class="line"><span style="color:#24292E;">	</span><span style="color:#6F42C1;">inet6</span><span style="color:#24292E;"> </span><span style="color:#032F62;">fe80::db9a:b93a:b24c:5234%utun1</span><span style="color:#24292E;"> </span><span style="color:#032F62;">prefixlen</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">64</span><span style="color:#24292E;"> </span><span style="color:#032F62;">scopeid</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">0xd</span></span>
-<span class="line"><span style="color:#24292E;">	</span><span style="color:#6F42C1;">nd6</span><span style="color:#24292E;"> </span><span style="color:#032F62;">options=</span><span style="color:#005CC5;">201</span><span style="color:#D73A49;">&lt;</span><span style="color:#032F62;">PERFORMNUD,DA</span><span style="color:#24292E;">D</span><span style="color:#D73A49;">&gt;</span></span></code></pre></div><h3 id="ipv4" tabindex="-1">IPv4 <a class="header-anchor" href="#ipv4" aria-label="Permalink to &quot;IPv4&quot;">​</a></h3><p>192.0.0.1 分隔四个部分 每个部分 8 位 32 位</p><blockquote><p>32 位的 IP 地址分配地址 5 类</p></blockquote><table><thead><tr><th>类别</th><th>前几位</th><th>网络号</th><th>主机号</th></tr></thead><tbody><tr><td>A 类</td><td>0</td><td>7 位</td><td>24 位</td></tr><tr><td>B 类</td><td>1 0</td><td>14 位</td><td>16 位</td></tr><tr><td>C 类</td><td>1 1 0</td><td>21 位</td><td>8 位</td></tr><tr><td>D 类</td><td>1 1 1 0</td><td>多播组号 28 位</td><td></td></tr><tr><td>E 类</td><td>1 1 1 1 0</td><td>留待后用（27 位）</td><td></td></tr></tbody></table><blockquote><p>A B C 三类地址包含的主机数量</p></blockquote><table><thead><tr><th>类别</th><th>IP 地址范围</th><th>最大主机数</th><th>私有 IP 地址范围</th></tr></thead><tbody><tr><td>A</td><td>0.0.0.0-127.255.255.255</td><td>16777214</td><td>10.0.0.0-10.255.255.255</td></tr><tr><td>B</td><td>128.0.0.0-191.255.255.255</td><td>65534</td><td>172.16.0.0-172.31.255.255</td></tr><tr><td>C</td><td>192.0.0.0-223.255.255.255</td><td>254</td><td>192.168.0.0-192.168.255.255</td></tr></tbody></table><blockquote><p>无类型域间选路 CIDR</p></blockquote><p><code>32位的IP地址一分为二，前面是网络号，后面是主机号</code></p><ul><li>10.100.122.2/24 =&gt; 类似这种形式 CIDR =&gt; 32 位中，前 24 位是网络号，后 8 位是主机号</li><li>广播地址 同一网络号里面的机器都能收到</li><li>子网掩码 255.255.255.0</li></ul><div class="tip custom-block"><p class="custom-block-title">网络号的计算</p><p>子网掩码和 IP 地址按位计算 AND</p></div><blockquote><p>D 类地址</p></blockquote><ul><li>组播地址：某个组的机器都能收到</li><li>eth0 网卡 global =&gt; 可以对外，可以接收来自各个地方的包</li><li>lo host 本机相互通信 <ul><li>loopback 环回接口</li><li>127.0.0.1</li></ul></li></ul><h3 id="ipv6" tabindex="-1">IPv6 <a class="header-anchor" href="#ipv6" aria-label="Permalink to &quot;IPv6&quot;">​</a></h3><p>128 位</p><h3 id="ip-地址如何计算广播地址、子网掩码" tabindex="-1">IP 地址如何计算广播地址、子网掩码 <a class="header-anchor" href="#ip-地址如何计算广播地址、子网掩码" aria-label="Permalink to &quot;IP 地址如何计算广播地址、子网掩码&quot;">​</a></h3><p>???</p><h2 id="mac-地址" tabindex="-1">MAC 地址 <a class="header-anchor" href="#mac-地址" aria-label="Permalink to &quot;MAC 地址&quot;">​</a></h2><p>网卡的物理地址，十六进制，6 个 byte 表示</p><ul><li>MAC 地址号全局唯一（网卡生产出来就带着这个地址）</li><li>一个网络包从一个地方传到另一个地方，除了要有确定的地址，还需要有定位功能</li><li>IP 地址才有远程定位功能</li><li>MAC 地址像是身份证，是一个唯一的表示</li><li>MAC 地址有一定定位功能的，范围非常有限</li></ul><h2 id="网络设备的状态标识" tabindex="-1">网络设备的状态标识 <a class="header-anchor" href="#网络设备的状态标识" aria-label="Permalink to &quot;网络设备的状态标识&quot;">​</a></h2><p>&lt;UP,BROADCAST,SMART,RUNNING,PROMISC,SIMPLEX,MULTICAST&gt; mtu 1500</p><ul><li>net_device_flags 网络设备的状态标识</li></ul><table><thead><tr><th>类型</th><th>作用</th></tr></thead><tbody><tr><td>UP</td><td>网卡处于启动状态</td></tr><tr><td>BROADCAST</td><td>网卡有广播地址，可以发送广播包</td></tr><tr><td>MULTICAST</td><td>网卡可以发送多播包</td></tr><tr><td>LOWER_UP</td><td>L1 启动，网线插着</td></tr><tr><td>MTU</td><td>最大传输单元 MTU 为 1500，以太网的默认值</td></tr><tr><td>qdisc_pfifo_fast</td><td>queueing discipline 排队规则</td></tr></tbody></table><div class="tip custom-block"><p class="custom-block-title">MTU</p><p>二层 MAC 层的概念，以太网规定 MAC 头带正文合起来不允许超过 1500 字节，正文里面有 IP 的头，TCP 的头，HTTP 的头，如果放不下，就需要分片来传输</p></div><div class="tip custom-block"><p class="custom-block-title">qdisc_pfifo_fast</p><p>内核如果需要通过某个网络接口发送数据包，它都需要按照为这个接口配置的 qdisc（排队规则）把数据包加入队列</p></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/cookie.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Cookie</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">	</span><span style="color:#6F42C1;">nd6</span><span style="color:#24292E;"> </span><span style="color:#032F62;">options=</span><span style="color:#005CC5;">201</span><span style="color:#D73A49;">&lt;</span><span style="color:#032F62;">PERFORMNUD,DA</span><span style="color:#24292E;">D</span><span style="color:#D73A49;">&gt;</span></span></code></pre></div><h3 id="ipv4" tabindex="-1">IPv4 <a class="header-anchor" href="#ipv4" aria-label="Permalink to &quot;IPv4&quot;">​</a></h3><p>192.0.0.1 分隔四个部分 每个部分 8 位 32 位</p><blockquote><p>32 位的 IP 地址分配地址 5 类</p></blockquote><table><thead><tr><th>类别</th><th>前几位</th><th>网络号</th><th>主机号</th></tr></thead><tbody><tr><td>A 类</td><td>0</td><td>7 位</td><td>24 位</td></tr><tr><td>B 类</td><td>1 0</td><td>14 位</td><td>16 位</td></tr><tr><td>C 类</td><td>1 1 0</td><td>21 位</td><td>8 位</td></tr><tr><td>D 类</td><td>1 1 1 0</td><td>多播组号 28 位</td><td></td></tr><tr><td>E 类</td><td>1 1 1 1 0</td><td>留待后用（27 位）</td><td></td></tr></tbody></table><blockquote><p>A B C 三类地址包含的主机数量</p></blockquote><table><thead><tr><th>类别</th><th>IP 地址范围</th><th>最大主机数</th><th>私有 IP 地址范围</th></tr></thead><tbody><tr><td>A</td><td>0.0.0.0-127.255.255.255</td><td>16777214</td><td>10.0.0.0-10.255.255.255</td></tr><tr><td>B</td><td>128.0.0.0-191.255.255.255</td><td>65534</td><td>172.16.0.0-172.31.255.255</td></tr><tr><td>C</td><td>192.0.0.0-223.255.255.255</td><td>254</td><td>192.168.0.0-192.168.255.255</td></tr></tbody></table><blockquote><p>无类型域间选路 CIDR</p></blockquote><p><code>32位的IP地址一分为二，前面是网络号，后面是主机号</code></p><ul><li>10.100.122.2/24 =&gt; 类似这种形式 CIDR =&gt; 32 位中，前 24 位是网络号，后 8 位是主机号</li><li>广播地址 同一网络号里面的机器都能收到</li><li>子网掩码 255.255.255.0</li></ul><div class="tip custom-block"><p class="custom-block-title">网络号的计算</p><p>子网掩码和 IP 地址按位计算 AND</p></div><blockquote><p>D 类地址</p></blockquote><ul><li>组播地址：某个组的机器都能收到</li><li>eth0 网卡 global =&gt; 可以对外，可以接收来自各个地方的包</li><li>lo host 本机相互通信 <ul><li>loopback 环回接口</li><li>127.0.0.1</li></ul></li></ul><h3 id="ipv6" tabindex="-1">IPv6 <a class="header-anchor" href="#ipv6" aria-label="Permalink to &quot;IPv6&quot;">​</a></h3><p>128 位</p><h3 id="ip-地址如何计算广播地址、子网掩码" tabindex="-1">IP 地址如何计算广播地址、子网掩码 <a class="header-anchor" href="#ip-地址如何计算广播地址、子网掩码" aria-label="Permalink to &quot;IP 地址如何计算广播地址、子网掩码&quot;">​</a></h3><p>???</p><h2 id="mac-地址" tabindex="-1">MAC 地址 <a class="header-anchor" href="#mac-地址" aria-label="Permalink to &quot;MAC 地址&quot;">​</a></h2><p>网卡的物理地址，十六进制，6 个 byte 表示</p><ul><li>MAC 地址号全局唯一（网卡生产出来就带着这个地址）</li><li>一个网络包从一个地方传到另一个地方，除了要有确定的地址，还需要有定位功能</li><li>IP 地址才有远程定位功能</li><li>MAC 地址像是身份证，是一个唯一的表示</li><li>MAC 地址有一定定位功能的，范围非常有限</li></ul><h2 id="网络设备的状态标识" tabindex="-1">网络设备的状态标识 <a class="header-anchor" href="#网络设备的状态标识" aria-label="Permalink to &quot;网络设备的状态标识&quot;">​</a></h2><p>&lt;UP,BROADCAST,SMART,RUNNING,PROMISC,SIMPLEX,MULTICAST&gt; mtu 1500</p><ul><li>net_device_flags 网络设备的状态标识</li></ul><table><thead><tr><th>类型</th><th>作用</th></tr></thead><tbody><tr><td>UP</td><td>网卡处于启动状态</td></tr><tr><td>BROADCAST</td><td>网卡有广播地址，可以发送广播包</td></tr><tr><td>MULTICAST</td><td>网卡可以发送多播包</td></tr><tr><td>LOWER_UP</td><td>L1 启动，网线插着</td></tr><tr><td>MTU</td><td>最大传输单元 MTU 为 1500，以太网的默认值</td></tr><tr><td>qdisc_pfifo_fast</td><td>queueing discipline 排队规则</td></tr></tbody></table><div class="tip custom-block"><p class="custom-block-title">MTU</p><p>二层 MAC 层的概念，以太网规定 MAC 头带正文合起来不允许超过 1500 字节，正文里面有 IP 的头，TCP 的头，HTTP 的头，如果放不下，就需要分片来传输</p></div><div class="tip custom-block"><p class="custom-block-title">qdisc_pfifo_fast</p><p>内核如果需要通过某个网络接口发送数据包，它都需要按照为这个接口配置的 qdisc（排队规则）把数据包加入队列</p></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/cookie.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Cookie</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/ip_addr.html b/network/ip_addr.html
index bfbe55f..54a62fc 100644
--- a/network/ip_addr.html
+++ b/network/ip_addr.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>IP 地址 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_ip_addr.md.c87e2877.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_ip_addr.md.7e144e39.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_ip_addr" data-v-6b87e69f><div><h1 id="ip-地址" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h1><p>(Internet Protocol Address)互联网协议地址，网际协议地址</p><h2 id="ip-协议" tabindex="-1">IP 协议 <a class="header-anchor" href="#ip-协议" aria-label="Permalink to &quot;IP 协议&quot;">​</a></h2><p>计算机网络相互连接进行通信而设计的协议</p><h2 id="ip-地址-1" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址-1" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h2><p>唯一地址</p><h2 id="ip-地址类型" tabindex="-1">IP 地址类型 <a class="header-anchor" href="#ip-地址类型" aria-label="Permalink to &quot;IP 地址类型&quot;">​</a></h2><h3 id="公有地址" tabindex="-1">公有地址 <a class="header-anchor" href="#公有地址" aria-label="Permalink to &quot;公有地址&quot;">​</a></h3><p>权威机构</p><h3 id="私有地址" tabindex="-1">私有地址 <a class="header-anchor" href="#私有地址" aria-label="Permalink to &quot;私有地址&quot;">​</a></h3><p>A 类 10.0.0.0--10.255.255.255 B 类 172.16.0.0--172.31.255.255 C 类 192.168.0.0--192.168.255.255</p><p>D、E 类为特殊地址</p><h2 id="ip-地址编址方式" tabindex="-1">IP 地址编址方式 <a class="header-anchor" href="#ip-地址编址方式" aria-label="Permalink to &quot;IP 地址编址方式&quot;">​</a></h2><table><thead><tr><th>类别</th><th>最大网络数</th><th>IP 地址范围</th><th>单个网段最大主机数</th><th>私有 IP 地址范围</th></tr></thead><tbody><tr><td>A</td><td>126(2^7-2)</td><td>1.0.0.1-127.255.255.254</td><td>16777214</td><td>10.0.0.0-10.255.255.255</td></tr><tr><td>B</td><td>16384(2^14)</td><td>128.0.0.1-191.255.255.254</td><td>65534</td><td>172.16.0.0-172.31.255.255</td></tr><tr><td>C</td><td>2097152(2^21)</td><td>192.0.0.1-223.255.255.254</td><td>254</td><td>192.168.0.0-192.168.255.255</td></tr></tbody></table><h3 id="a-类地址" tabindex="-1">A 类地址 <a class="header-anchor" href="#a-类地址" aria-label="Permalink to &quot;A 类地址&quot;">​</a></h3><p>1 字节的网络地址 + 3 字节主机地址 <code>网络地址的最高位必须为 0</code></p><h3 id="b-类地址" tabindex="-1">B 类地址 <a class="header-anchor" href="#b-类地址" aria-label="Permalink to &quot;B 类地址&quot;">​</a></h3><p>2 字节的网络地址 + 2 字节主机地址 <code>网络地址的最高位必须为 10</code></p><h3 id="c-类地址" tabindex="-1">C 类地址 <a class="header-anchor" href="#c-类地址" aria-label="Permalink to &quot;C 类地址&quot;">​</a></h3><p>3 字节的网络地址 + 1 字节的主机地址 <code>网络地址的最高位必须为 110</code></p><h3 id="d-类地址" tabindex="-1">D 类地址 <a class="header-anchor" href="#d-类地址" aria-label="Permalink to &quot;D 类地址&quot;">​</a></h3><p>多播地址，也称组播地址（<code>多播地址的最高位必须为 1110</code> === 224.0.0.0 - 239.255.255.255）</p><h3 id="e-类地址" tabindex="-1">E 类地址 <a class="header-anchor" href="#e-类地址" aria-label="Permalink to &quot;E 类地址&quot;">​</a></h3><p>试验用处 <code>最高位必须为 1111</code></p><h3 id="特殊的网址" tabindex="-1">特殊的网址 <a class="header-anchor" href="#特殊的网址" aria-label="Permalink to &quot;特殊的网址&quot;">​</a></h3><ol><li>每一个字节都为 0 的地址（0.0.0.0）对应于当前主机</li><li>IP 地址中的每一个字节都为 1 的 IP 地址（255．255．255．255）是当前子网的广播地址</li><li>IP 地址中凡是以 11110 开头的 E 类 IP 地址都保留用于将来和实验使用</li><li>IP 地址中不能以十进制 127 作为开头，该类地址中数字 127．0．0．1 到 127．255．255．255 用于回路测试，如：127.0.0.1 可以代表本机 IP 地址，用 127.0.0.1 就可以测试本机中配置的 Web 服务器</li><li>网络 ID 的第一个 6 位组也不能全置为 0，全 0 表示本地网络</li></ol><h2 id="ip-地址的分配" tabindex="-1">IP 地址的分配 <a class="header-anchor" href="#ip-地址的分配" aria-label="Permalink to &quot;IP 地址的分配&quot;">​</a></h2><p>TCP/IP 协议需要针对不同的网络进行不同的设置，且每个节点一般需要一个 IP 地址、一个子网掩码、一个默认网关</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/dhcp.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>DHCP</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/layer.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>网络分层</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_ip_addr" data-v-6b87e69f><div><h1 id="ip-地址" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h1><p>(Internet Protocol Address)互联网协议地址，网际协议地址</p><h2 id="ip-协议" tabindex="-1">IP 协议 <a class="header-anchor" href="#ip-协议" aria-label="Permalink to &quot;IP 协议&quot;">​</a></h2><p>计算机网络相互连接进行通信而设计的协议</p><h2 id="ip-地址-1" tabindex="-1">IP 地址 <a class="header-anchor" href="#ip-地址-1" aria-label="Permalink to &quot;IP 地址&quot;">​</a></h2><p>唯一地址</p><h2 id="ip-地址类型" tabindex="-1">IP 地址类型 <a class="header-anchor" href="#ip-地址类型" aria-label="Permalink to &quot;IP 地址类型&quot;">​</a></h2><h3 id="公有地址" tabindex="-1">公有地址 <a class="header-anchor" href="#公有地址" aria-label="Permalink to &quot;公有地址&quot;">​</a></h3><p>权威机构</p><h3 id="私有地址" tabindex="-1">私有地址 <a class="header-anchor" href="#私有地址" aria-label="Permalink to &quot;私有地址&quot;">​</a></h3><p>A 类 10.0.0.0--10.255.255.255 B 类 172.16.0.0--172.31.255.255 C 类 192.168.0.0--192.168.255.255</p><p>D、E 类为特殊地址</p><h2 id="ip-地址编址方式" tabindex="-1">IP 地址编址方式 <a class="header-anchor" href="#ip-地址编址方式" aria-label="Permalink to &quot;IP 地址编址方式&quot;">​</a></h2><table><thead><tr><th>类别</th><th>最大网络数</th><th>IP 地址范围</th><th>单个网段最大主机数</th><th>私有 IP 地址范围</th></tr></thead><tbody><tr><td>A</td><td>126(2^7-2)</td><td>1.0.0.1-127.255.255.254</td><td>16777214</td><td>10.0.0.0-10.255.255.255</td></tr><tr><td>B</td><td>16384(2^14)</td><td>128.0.0.1-191.255.255.254</td><td>65534</td><td>172.16.0.0-172.31.255.255</td></tr><tr><td>C</td><td>2097152(2^21)</td><td>192.0.0.1-223.255.255.254</td><td>254</td><td>192.168.0.0-192.168.255.255</td></tr></tbody></table><h3 id="a-类地址" tabindex="-1">A 类地址 <a class="header-anchor" href="#a-类地址" aria-label="Permalink to &quot;A 类地址&quot;">​</a></h3><p>1 字节的网络地址 + 3 字节主机地址 <code>网络地址的最高位必须为 0</code></p><h3 id="b-类地址" tabindex="-1">B 类地址 <a class="header-anchor" href="#b-类地址" aria-label="Permalink to &quot;B 类地址&quot;">​</a></h3><p>2 字节的网络地址 + 2 字节主机地址 <code>网络地址的最高位必须为 10</code></p><h3 id="c-类地址" tabindex="-1">C 类地址 <a class="header-anchor" href="#c-类地址" aria-label="Permalink to &quot;C 类地址&quot;">​</a></h3><p>3 字节的网络地址 + 1 字节的主机地址 <code>网络地址的最高位必须为 110</code></p><h3 id="d-类地址" tabindex="-1">D 类地址 <a class="header-anchor" href="#d-类地址" aria-label="Permalink to &quot;D 类地址&quot;">​</a></h3><p>多播地址，也称组播地址（<code>多播地址的最高位必须为 1110</code> === 224.0.0.0 - 239.255.255.255）</p><h3 id="e-类地址" tabindex="-1">E 类地址 <a class="header-anchor" href="#e-类地址" aria-label="Permalink to &quot;E 类地址&quot;">​</a></h3><p>试验用处 <code>最高位必须为 1111</code></p><h3 id="特殊的网址" tabindex="-1">特殊的网址 <a class="header-anchor" href="#特殊的网址" aria-label="Permalink to &quot;特殊的网址&quot;">​</a></h3><ol><li>每一个字节都为 0 的地址（0.0.0.0）对应于当前主机</li><li>IP 地址中的每一个字节都为 1 的 IP 地址（255．255．255．255）是当前子网的广播地址</li><li>IP 地址中凡是以 11110 开头的 E 类 IP 地址都保留用于将来和实验使用</li><li>IP 地址中不能以十进制 127 作为开头，该类地址中数字 127．0．0．1 到 127．255．255．255 用于回路测试，如：127.0.0.1 可以代表本机 IP 地址，用 127.0.0.1 就可以测试本机中配置的 Web 服务器</li><li>网络 ID 的第一个 6 位组也不能全置为 0，全 0 表示本地网络</li></ol><h2 id="ip-地址的分配" tabindex="-1">IP 地址的分配 <a class="header-anchor" href="#ip-地址的分配" aria-label="Permalink to &quot;IP 地址的分配&quot;">​</a></h2><p>TCP/IP 协议需要针对不同的网络进行不同的设置，且每个节点一般需要一个 IP 地址、一个子网掩码、一个默认网关</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/dhcp.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>DHCP</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/layer.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>网络分层</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/layer.html b/network/layer.html
index 53e34a0..d23b535 100644
--- a/network/layer.html
+++ b/network/layer.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>网络分层 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_layer.md.75f275a2.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_layer.md.e12ef59e.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_layer" data-v-6b87e69f><div><h1 id="网络分层" tabindex="-1">网络分层 <a class="header-anchor" href="#网络分层" aria-label="Permalink to &quot;网络分层&quot;">​</a></h1><h2 id="工作过程" tabindex="-1">工作过程 <a class="header-anchor" href="#工作过程" aria-label="Permalink to &quot;工作过程&quot;">​</a></h2><img src="/learning-docs2/assets/images/layer.png" alt="网络分层工作流程图"></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/ip_addr.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>IP 地址</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/methods.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>HTTP 请求方式</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_layer" data-v-6b87e69f><div><h1 id="网络分层" tabindex="-1">网络分层 <a class="header-anchor" href="#网络分层" aria-label="Permalink to &quot;网络分层&quot;">​</a></h1><h2 id="工作过程" tabindex="-1">工作过程 <a class="header-anchor" href="#工作过程" aria-label="Permalink to &quot;工作过程&quot;">​</a></h2><img src="/assets/images/layer.png" alt="网络分层工作流程图"></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/ip_addr.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>IP 地址</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/methods.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>HTTP 请求方式</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/methods.html b/network/methods.html
index e0d86e5..5f96ac2 100644
--- a/network/methods.html
+++ b/network/methods.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>HTTP 请求方法 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_methods.md.d5348171.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_methods.md.a8694107.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_methods" data-v-6b87e69f><div><h1 id="http-请求方法" tabindex="-1">HTTP 请求方法 <a class="header-anchor" href="#http-请求方法" aria-label="Permalink to &quot;HTTP 请求方法&quot;">​</a></h1><p><a href="https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol#Request_methods" target="_blank" rel="noreferrer">Wiki - HyperText Transfer Protocol</a></p><p>9 种方法</p><h2 id="get" tabindex="-1">GET <a class="header-anchor" href="#get" aria-label="Permalink to &quot;GET&quot;">​</a></h2><p>向指定的资源发起请求</p><h2 id="head" tabindex="-1">HEAD <a class="header-anchor" href="#head" aria-label="Permalink to &quot;HEAD&quot;">​</a></h2><p>和 GET 一样，向服务器发出指定资源的请求，但是没有响应头</p><h2 id="post" tabindex="-1">POST <a class="header-anchor" href="#post" aria-label="Permalink to &quot;POST&quot;">​</a></h2><p>向指定资源提交数据，请求服务器进行处理（提交表单或者上传文件），可能会创建新的资源或者修改资源，或二者都可</p><h3 id="请求-body-格式" tabindex="-1">请求 body 格式 <a class="header-anchor" href="#请求-body-格式" aria-label="Permalink to &quot;请求 body 格式&quot;">​</a></h3><ul><li>application/x-www-form-urlencoded</li><li>application/json</li><li>multipart/form-data</li></ul><h2 id="put" tabindex="-1">PUT <a class="header-anchor" href="#put" aria-label="Permalink to &quot;PUT&quot;">​</a></h2><p>向指定资源位置上传其最新内容（资源已创建，直接修改）</p><h2 id="delete" tabindex="-1">DELETE <a class="header-anchor" href="#delete" aria-label="Permalink to &quot;DELETE&quot;">​</a></h2><p>请求服务删除 Request-URI 所标识的资源</p><h2 id="trace" tabindex="-1">TRACE <a class="header-anchor" href="#trace" aria-label="Permalink to &quot;TRACE&quot;">​</a></h2><p>回显服务器收到的请求，用于测试或诊断（请求目标资源在响应正文中传输收到的请求）</p><h2 id="options" tabindex="-1">OPTIONS <a class="header-anchor" href="#options" aria-label="Permalink to &quot;OPTIONS&quot;">​</a></h2><p>向服务器发出预请求，判断服务器是否支持该请求方法以及响应</p><h2 id="connect" tabindex="-1">CONNECT <a class="header-anchor" href="#connect" aria-label="Permalink to &quot;CONNECT&quot;">​</a></h2><ul><li>HTTP1.1 预留给能够将连接改为隧道方式的代理服务器（通常用于 SSL 加密服务器的链接）</li><li>请求中介建立到请求目标表示的源服务器的 TCP/IP 隧道（一个或多个带有 TLS 的 HTTP 代理来保护连接）</li></ul><h2 id="patch" tabindex="-1">PATCH <a class="header-anchor" href="#patch" aria-label="Permalink to &quot;PATCH&quot;">​</a></h2><p>请求目标资源根据请求中包含的表示中定义的部分更新来修改其状态（更新文件或文档的一部分来节省带宽，而不必完全传输）</p><h2 id="对比" tabindex="-1">对比 <a class="header-anchor" href="#对比" aria-label="Permalink to &quot;对比&quot;">​</a></h2><table><thead><tr><th>请求方法</th><th>request(请求体)</th><th>response(响应头)</th><th>safe(安全)</th><th>indempotent(幂等)</th><th>cachcable(缓存)</th></tr></thead><tbody><tr><td>GET</td><td>optional</td><td>yes</td><td>yes</td><td>yes</td><td>yes</td></tr><tr><td>POST</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td><td>yes</td></tr><tr><td>HEAD</td><td>optional</td><td><i class="warn">no</i></td><td>yes</td><td>yes</td><td>yes</td></tr><tr><td>PUT</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>DELETE</td><td>optional</td><td>yes</td><td><i class="warn">no</i></td><td>yes</td><td><i class="warn"></i></td></tr><tr><td>TRACE</td><td><i class="warn">no</i></td><td>yes</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>CONNECT</td><td>optional</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td></tr><tr><td>OPTIONS</td><td>optional</td><td>yes</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>PATCH</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td><td><i class="warn">no</i></td></tr></tbody></table><blockquote><p>总结</p></blockquote><ul><li>POST PUT PATCH 需要请求体(request)，其他请求方法可选</li><li>响应体(response)只有 HEAD 不返回，其他请求方法都可以有响应体</li><li>POST PUT PATCH 涉及到资源的修改和创建都是不安全的，其他请求方法相对安全</li><li>POST CONNCET PATCH 都不是幂等(idempotent)(请求多次，输出的结果都是一样的)，具有副作用</li><li>GET POST HEAD 三种方法可以缓存，其他方法不可缓存</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/layer.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>网络分层</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/noun.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>网络名词</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_methods" data-v-6b87e69f><div><h1 id="http-请求方法" tabindex="-1">HTTP 请求方法 <a class="header-anchor" href="#http-请求方法" aria-label="Permalink to &quot;HTTP 请求方法&quot;">​</a></h1><p><a href="https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol#Request_methods" target="_blank" rel="noreferrer">Wiki - HyperText Transfer Protocol</a></p><p>9 种方法</p><h2 id="get" tabindex="-1">GET <a class="header-anchor" href="#get" aria-label="Permalink to &quot;GET&quot;">​</a></h2><p>向指定的资源发起请求</p><h2 id="head" tabindex="-1">HEAD <a class="header-anchor" href="#head" aria-label="Permalink to &quot;HEAD&quot;">​</a></h2><p>和 GET 一样，向服务器发出指定资源的请求，但是没有响应头</p><h2 id="post" tabindex="-1">POST <a class="header-anchor" href="#post" aria-label="Permalink to &quot;POST&quot;">​</a></h2><p>向指定资源提交数据，请求服务器进行处理（提交表单或者上传文件），可能会创建新的资源或者修改资源，或二者都可</p><h3 id="请求-body-格式" tabindex="-1">请求 body 格式 <a class="header-anchor" href="#请求-body-格式" aria-label="Permalink to &quot;请求 body 格式&quot;">​</a></h3><ul><li>application/x-www-form-urlencoded</li><li>application/json</li><li>multipart/form-data</li></ul><h2 id="put" tabindex="-1">PUT <a class="header-anchor" href="#put" aria-label="Permalink to &quot;PUT&quot;">​</a></h2><p>向指定资源位置上传其最新内容（资源已创建，直接修改）</p><h2 id="delete" tabindex="-1">DELETE <a class="header-anchor" href="#delete" aria-label="Permalink to &quot;DELETE&quot;">​</a></h2><p>请求服务删除 Request-URI 所标识的资源</p><h2 id="trace" tabindex="-1">TRACE <a class="header-anchor" href="#trace" aria-label="Permalink to &quot;TRACE&quot;">​</a></h2><p>回显服务器收到的请求，用于测试或诊断（请求目标资源在响应正文中传输收到的请求）</p><h2 id="options" tabindex="-1">OPTIONS <a class="header-anchor" href="#options" aria-label="Permalink to &quot;OPTIONS&quot;">​</a></h2><p>向服务器发出预请求，判断服务器是否支持该请求方法以及响应</p><h2 id="connect" tabindex="-1">CONNECT <a class="header-anchor" href="#connect" aria-label="Permalink to &quot;CONNECT&quot;">​</a></h2><ul><li>HTTP1.1 预留给能够将连接改为隧道方式的代理服务器（通常用于 SSL 加密服务器的链接）</li><li>请求中介建立到请求目标表示的源服务器的 TCP/IP 隧道（一个或多个带有 TLS 的 HTTP 代理来保护连接）</li></ul><h2 id="patch" tabindex="-1">PATCH <a class="header-anchor" href="#patch" aria-label="Permalink to &quot;PATCH&quot;">​</a></h2><p>请求目标资源根据请求中包含的表示中定义的部分更新来修改其状态（更新文件或文档的一部分来节省带宽，而不必完全传输）</p><h2 id="对比" tabindex="-1">对比 <a class="header-anchor" href="#对比" aria-label="Permalink to &quot;对比&quot;">​</a></h2><table><thead><tr><th>请求方法</th><th>request(请求体)</th><th>response(响应头)</th><th>safe(安全)</th><th>indempotent(幂等)</th><th>cachcable(缓存)</th></tr></thead><tbody><tr><td>GET</td><td>optional</td><td>yes</td><td>yes</td><td>yes</td><td>yes</td></tr><tr><td>POST</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td><td>yes</td></tr><tr><td>HEAD</td><td>optional</td><td><i class="warn">no</i></td><td>yes</td><td>yes</td><td>yes</td></tr><tr><td>PUT</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>DELETE</td><td>optional</td><td>yes</td><td><i class="warn">no</i></td><td>yes</td><td><i class="warn"></i></td></tr><tr><td>TRACE</td><td><i class="warn">no</i></td><td>yes</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>CONNECT</td><td>optional</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td></tr><tr><td>OPTIONS</td><td>optional</td><td>yes</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td></tr><tr><td>PATCH</td><td>yes</td><td>yes</td><td><i class="warn">no</i></td><td><i class="warn">no</i></td><td><i class="warn">no</i></td></tr></tbody></table><blockquote><p>总结</p></blockquote><ul><li>POST PUT PATCH 需要请求体(request)，其他请求方法可选</li><li>响应体(response)只有 HEAD 不返回，其他请求方法都可以有响应体</li><li>POST PUT PATCH 涉及到资源的修改和创建都是不安全的，其他请求方法相对安全</li><li>POST CONNCET PATCH 都不是幂等(idempotent)(请求多次，输出的结果都是一样的)，具有副作用</li><li>GET POST HEAD 三种方法可以缓存，其他方法不可缓存</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/layer.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>网络分层</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/noun.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>网络名词</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/noun.html b/network/noun.html
index a886999..2157485 100644
--- a/network/noun.html
+++ b/network/noun.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>计算机网络名词 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_noun.md.e1eac5d1.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_noun.md.b1b4cd32.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_noun" data-v-6b87e69f><div><h1 id="计算机网络名词" tabindex="-1">计算机网络名词 <a class="header-anchor" href="#计算机网络名词" aria-label="Permalink to &quot;计算机网络名词&quot;">​</a></h1><h2 id="以太网" tabindex="-1">以太网 <a class="header-anchor" href="#以太网" aria-label="Permalink to &quot;以太网&quot;">​</a></h2><p><code>拓扑结构</code></p><p>计算机局域网技术（规定了包括物理层的连线、电子信号和介质访问层协议的内容）</p><ul><li>经典以太网（运行速度 3 - 10Mbps)</li><li>交换式以太网（使用交换机 100、1000 和 10000Mbps 高速率）</li></ul><h2 id="交换机" tabindex="-1">交换机 <a class="header-anchor" href="#交换机" aria-label="Permalink to &quot;交换机&quot;">​</a></h2><p><code>Switch 开关</code> 工作于 OSI 模型的第二层，数据链路层</p><p>用于电（光）信号转发的网络设备（为接入交换机的任意两个网络节点提供独享的电信号通路）</p><ul><li>基于 MAC 地址识别，能完成封装转发数据帧功能的网络设备</li><li>MAC 地址缓存</li></ul><h2 id="网关" tabindex="-1">网关 <a class="header-anchor" href="#网关" aria-label="Permalink to &quot;网关&quot;">​</a></h2><p><code>Gateway 网间连接器、协议转换器</code> 工作于应用层</p><p>网关在网络层以上实现网络互连，是复杂的网络互连设备，仅用于两个高层协议不同的网络互连</p><ul><li>广域网互连、局域网互连</li><li>充当转换重任的计算机系统或设备（翻译器）</li><li>一个网络通向其他网络的 IP 地址</li></ul><h2 id="路由器" tabindex="-1">路由器 <a class="header-anchor" href="#路由器" aria-label="Permalink to &quot;路由器&quot;">​</a></h2><p><code>Router</code> 网络层设备</p><p>连接两个或多个网络的硬件设备，起网关作用，是读取每一个数据包中的地址然后决定如何传送的专用智能性的网络设备</p><ul><li>实现 IP、TCP、UDP、ICMP 等网络的互连</li><li>对数据进行处理（收发数据包、具有对数据的分组过滤、复用、加密、压缩及防护墙等各项功能）</li><li>依据路由表的信息，对数据包下一传输目的地进行选择</li><li>进行外部网关协议和其他自治域之间拓扑信息的交换</li><li>实现网络管理和系统支持功能</li></ul><h2 id="mac-地址" tabindex="-1">MAC 地址 <a class="header-anchor" href="#mac-地址" aria-label="Permalink to &quot;MAC 地址&quot;">​</a></h2><p><code>Media Access Control Address</code> 媒体存取控制位址、局域网地址</p><p>用于确认网络设备位置的地址，位于数据链路层</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/methods.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>HTTP 请求方式</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/osi.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>OSI 模型</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_noun" data-v-6b87e69f><div><h1 id="计算机网络名词" tabindex="-1">计算机网络名词 <a class="header-anchor" href="#计算机网络名词" aria-label="Permalink to &quot;计算机网络名词&quot;">​</a></h1><h2 id="以太网" tabindex="-1">以太网 <a class="header-anchor" href="#以太网" aria-label="Permalink to &quot;以太网&quot;">​</a></h2><p><code>拓扑结构</code></p><p>计算机局域网技术（规定了包括物理层的连线、电子信号和介质访问层协议的内容）</p><ul><li>经典以太网（运行速度 3 - 10Mbps)</li><li>交换式以太网（使用交换机 100、1000 和 10000Mbps 高速率）</li></ul><h2 id="交换机" tabindex="-1">交换机 <a class="header-anchor" href="#交换机" aria-label="Permalink to &quot;交换机&quot;">​</a></h2><p><code>Switch 开关</code> 工作于 OSI 模型的第二层，数据链路层</p><p>用于电（光）信号转发的网络设备（为接入交换机的任意两个网络节点提供独享的电信号通路）</p><ul><li>基于 MAC 地址识别，能完成封装转发数据帧功能的网络设备</li><li>MAC 地址缓存</li></ul><h2 id="网关" tabindex="-1">网关 <a class="header-anchor" href="#网关" aria-label="Permalink to &quot;网关&quot;">​</a></h2><p><code>Gateway 网间连接器、协议转换器</code> 工作于应用层</p><p>网关在网络层以上实现网络互连，是复杂的网络互连设备，仅用于两个高层协议不同的网络互连</p><ul><li>广域网互连、局域网互连</li><li>充当转换重任的计算机系统或设备（翻译器）</li><li>一个网络通向其他网络的 IP 地址</li></ul><h2 id="路由器" tabindex="-1">路由器 <a class="header-anchor" href="#路由器" aria-label="Permalink to &quot;路由器&quot;">​</a></h2><p><code>Router</code> 网络层设备</p><p>连接两个或多个网络的硬件设备，起网关作用，是读取每一个数据包中的地址然后决定如何传送的专用智能性的网络设备</p><ul><li>实现 IP、TCP、UDP、ICMP 等网络的互连</li><li>对数据进行处理（收发数据包、具有对数据的分组过滤、复用、加密、压缩及防护墙等各项功能）</li><li>依据路由表的信息，对数据包下一传输目的地进行选择</li><li>进行外部网关协议和其他自治域之间拓扑信息的交换</li><li>实现网络管理和系统支持功能</li></ul><h2 id="mac-地址" tabindex="-1">MAC 地址 <a class="header-anchor" href="#mac-地址" aria-label="Permalink to &quot;MAC 地址&quot;">​</a></h2><p><code>Media Access Control Address</code> 媒体存取控制位址、局域网地址</p><p>用于确认网络设备位置的地址，位于数据链路层</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/methods.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>HTTP 请求方式</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/osi.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>OSI 模型</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/osi.html b/network/osi.html
index 227089a..0d835d5 100644
--- a/network/osi.html
+++ b/network/osi.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>网络模型 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_osi.md.3b1c2623.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_osi.md.021cfe3c.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_osi" data-v-6b87e69f><div><h1 id="网络模型" tabindex="-1">网络模型 <a class="header-anchor" href="#网络模型" aria-label="Permalink to &quot;网络模型&quot;">​</a></h1><h2 id="网络传输协议" tabindex="-1">网络传输协议 <a class="header-anchor" href="#网络传输协议" aria-label="Permalink to &quot;网络传输协议&quot;">​</a></h2><p><code>Communications Protocol</code></p><p>在任何物理介质中允许两个或多个在传输系统中的终端之间传播信息的系统标准，计算机通信或网上设备的共同语言</p><h2 id="osi-网络模型" tabindex="-1">OSI 网络模型 <a class="header-anchor" href="#osi-网络模型" aria-label="Permalink to &quot;OSI 网络模型&quot;">​</a></h2><p>OSI（open system interconnect）</p><h3 id="应用层" tabindex="-1">应用层 <a class="header-anchor" href="#应用层" aria-label="Permalink to &quot;应用层&quot;">​</a></h3><p><code>Application Layer</code></p><p>提供为应用软件而设的接口，以设置与另一应用软件之间的通信（HTTP, HTTPS, FTP, TELNET, SSH, SMTP, POP3）</p><h3 id="表达层" tabindex="-1">表达层 <a class="header-anchor" href="#表达层" aria-label="Permalink to &quot;表达层&quot;">​</a></h3><p><code>Presentation Layer</code></p><p>把数据转换为能与接收者的系统格式兼容并适合传输的格式</p><h3 id="会话层" tabindex="-1">会话层 <a class="header-anchor" href="#会话层" aria-label="Permalink to &quot;会话层&quot;">​</a></h3><p><code>Session Layer</code></p><p>在数据传输中设置和维护计算机网络中两台计算机之间的通信连接</p><h3 id="传输层" tabindex="-1">传输层 <a class="header-anchor" href="#传输层" aria-label="Permalink to &quot;传输层&quot;">​</a></h3><p><code>Transport Layer</code></p><p>把传输表头（TH）加至数据以形成数据包。传输表头包含了所使用的协议等发送信息（TCP）</p><h3 id="网络层" tabindex="-1">网络层 <a class="header-anchor" href="#网络层" aria-label="Permalink to &quot;网络层&quot;">​</a></h3><p><code>Network Layer</code></p><p>决定数据的路径选择和转寄，将网络表头（NH）加至数据包，以形成分组，网络表头包含了网络数据（IP 协议）</p><h3 id="数据链路层" tabindex="-1">数据链路层 <a class="header-anchor" href="#数据链路层" aria-label="Permalink to &quot;数据链路层&quot;">​</a></h3><p><code>Data Link Layer</code></p><p>负责网络寻址、错误侦测和改错。当表头和表尾被加至数据包时，会形成帧。数据链表头（DLH）是包含了物理地址和错误侦测及改错的方法。数据链表尾（DLT）是一串指示数据包末端的字符串（以太网、WiFi、GPRS）</p><ul><li>逻辑链路控制子层(login link control, LLC)</li><li>介质访问控制子层(mdia access control, MAC)</li></ul><h3 id="物理层" tabindex="-1">物理层 <a class="header-anchor" href="#物理层" aria-label="Permalink to &quot;物理层&quot;">​</a></h3><p><code>Physical Layer</code></p><p>在局部局域网上传输数据帧，负责管理计算机通信设备和网络媒体之间的互通（针脚、电压、线缆规范、集线器、中继器、网卡、主机适配器）</p><h2 id="tcp-ip-协议" tabindex="-1">TCP/IP 协议 <a class="header-anchor" href="#tcp-ip-协议" aria-label="Permalink to &quot;TCP/IP 协议&quot;">​</a></h2><p><code>Transmission Control Protocol/Internet Protocol</code> 传输控制协议/网际协议</p><p>能够在多个不同网络间实现信息传输的协议簇（TCP IP FTP SMTP UDP)</p><blockquote><p>TCP/IP 的四层架构模型</p></blockquote><h3 id="链路层" tabindex="-1">链路层 <a class="header-anchor" href="#链路层" aria-label="Permalink to &quot;链路层&quot;">​</a></h3><p>对电信号进行分组形成具有特定意义的数据帧，然后以广播的形式通过物理介质发送给接收方</p><ul><li>网卡 --- 数据包必须是一块网卡传送到另一块网卡</li><li>主机读取 MAC 地址，处理接收包</li></ul><h3 id="网络层-1" tabindex="-1">网络层 <a class="header-anchor" href="#网络层-1" aria-label="Permalink to &quot;网络层&quot;">​</a></h3><ul><li>IP 协议</li></ul><blockquote><p>引入 IP 协议，制定了一套新地址，区分两台主机是否属于同一网络（网络地址 IP 地址）</p></blockquote><ul><li>ARP 协议</li></ul><blockquote><p>根据 IP 地址获取 MAC 地址的一个网络层协议</p></blockquote><ol><li>发起请求数据包，IP 地址 + 请求数据包，生成以太网数据包，广播</li><li>主机收到数据包，取出 IP 地址，与自己的 IP 地址对比，相同则返回 MAC 地址</li><li>接收返回消息，确定 MAC 地址</li><li>缓存（ARP 缓存返回的 MAC 地址 + IP 地址对应保留一定时间，以防下次请求）</li></ol><ul><li>路由协议</li></ul><blockquote><p>ARP 获取 MAC 地址完成这个路由协议的物理设备就是路由器（交通枢纽）=== 定义网络地址、区分网段、子网内 MAC 寻址、对于不同子网的数据包进行路由</p></blockquote><ul><li>ICMP 协议</li></ul><blockquote><p>因特网控制报文协议，主机与路由器之间进行控制信息传递（检查网络是否通畅、主机是否可达、路由是否可用）出现错误，自动返回错误的信息</p></blockquote><h3 id="传输层-1" tabindex="-1">传输层 <a class="header-anchor" href="#传输层-1" aria-label="Permalink to &quot;传输层&quot;">​</a></h3><p>数据包被发送到主机上以后，是无法确定哪个应用程序要接收这个包（为应用程序标识身份，定义端口）</p><ul><li>UDP 协议</li></ul><blockquote><p>定义了端口，同一个主机上的每个应用程序都需要指定唯一的端口号，传输指定端口（传输性较差）</p></blockquote><ul><li>TCP 协议</li></ul><blockquote><p>传输控制协议，面向链接的，可靠的，基于字节流的通信协议（TCP 确认机制的 UDP 协议）</p></blockquote><ol><li>数据包丢失，无法收到确认，重新发送数据包</li><li>三次对话的确认机制</li><li>首部 + 数据（TCP 数据包没有长度限制，TCP 数据包的长度不会超过 IP 数据包的长度，不必分割）</li></ol><h3 id="应用层-1" tabindex="-1">应用层 <a class="header-anchor" href="#应用层-1" aria-label="Permalink to &quot;应用层&quot;">​</a></h3><p>HTTP FTP SMTP</p><blockquote><p>定义数据格式并按照对应的格式解读数据</p></blockquote><p>请求 Header 中，定义请求数据格式 Accept 和响应数据格式 Content-Type</p><h3 id="缺陷" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><ol><li>没有明显地区区分服务、接口和协议的概念</li><li>不通用，不适用与 TCP/IP 模型之外的任何协议栈</li><li>链路层不是通常意义的一层（一个接口处于网络层和数据链路层之间）</li><li>TCP/IP 模型不区分物理层和数据链路层</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/noun.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>网络名词</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/socket.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Socket</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_osi" data-v-6b87e69f><div><h1 id="网络模型" tabindex="-1">网络模型 <a class="header-anchor" href="#网络模型" aria-label="Permalink to &quot;网络模型&quot;">​</a></h1><h2 id="网络传输协议" tabindex="-1">网络传输协议 <a class="header-anchor" href="#网络传输协议" aria-label="Permalink to &quot;网络传输协议&quot;">​</a></h2><p><code>Communications Protocol</code></p><p>在任何物理介质中允许两个或多个在传输系统中的终端之间传播信息的系统标准，计算机通信或网上设备的共同语言</p><h2 id="osi-网络模型" tabindex="-1">OSI 网络模型 <a class="header-anchor" href="#osi-网络模型" aria-label="Permalink to &quot;OSI 网络模型&quot;">​</a></h2><p>OSI（open system interconnect）</p><h3 id="应用层" tabindex="-1">应用层 <a class="header-anchor" href="#应用层" aria-label="Permalink to &quot;应用层&quot;">​</a></h3><p><code>Application Layer</code></p><p>提供为应用软件而设的接口，以设置与另一应用软件之间的通信（HTTP, HTTPS, FTP, TELNET, SSH, SMTP, POP3）</p><h3 id="表达层" tabindex="-1">表达层 <a class="header-anchor" href="#表达层" aria-label="Permalink to &quot;表达层&quot;">​</a></h3><p><code>Presentation Layer</code></p><p>把数据转换为能与接收者的系统格式兼容并适合传输的格式</p><h3 id="会话层" tabindex="-1">会话层 <a class="header-anchor" href="#会话层" aria-label="Permalink to &quot;会话层&quot;">​</a></h3><p><code>Session Layer</code></p><p>在数据传输中设置和维护计算机网络中两台计算机之间的通信连接</p><h3 id="传输层" tabindex="-1">传输层 <a class="header-anchor" href="#传输层" aria-label="Permalink to &quot;传输层&quot;">​</a></h3><p><code>Transport Layer</code></p><p>把传输表头（TH）加至数据以形成数据包。传输表头包含了所使用的协议等发送信息（TCP）</p><h3 id="网络层" tabindex="-1">网络层 <a class="header-anchor" href="#网络层" aria-label="Permalink to &quot;网络层&quot;">​</a></h3><p><code>Network Layer</code></p><p>决定数据的路径选择和转寄，将网络表头（NH）加至数据包，以形成分组，网络表头包含了网络数据（IP 协议）</p><h3 id="数据链路层" tabindex="-1">数据链路层 <a class="header-anchor" href="#数据链路层" aria-label="Permalink to &quot;数据链路层&quot;">​</a></h3><p><code>Data Link Layer</code></p><p>负责网络寻址、错误侦测和改错。当表头和表尾被加至数据包时，会形成帧。数据链表头（DLH）是包含了物理地址和错误侦测及改错的方法。数据链表尾（DLT）是一串指示数据包末端的字符串（以太网、WiFi、GPRS）</p><ul><li>逻辑链路控制子层(login link control, LLC)</li><li>介质访问控制子层(mdia access control, MAC)</li></ul><h3 id="物理层" tabindex="-1">物理层 <a class="header-anchor" href="#物理层" aria-label="Permalink to &quot;物理层&quot;">​</a></h3><p><code>Physical Layer</code></p><p>在局部局域网上传输数据帧，负责管理计算机通信设备和网络媒体之间的互通（针脚、电压、线缆规范、集线器、中继器、网卡、主机适配器）</p><h2 id="tcp-ip-协议" tabindex="-1">TCP/IP 协议 <a class="header-anchor" href="#tcp-ip-协议" aria-label="Permalink to &quot;TCP/IP 协议&quot;">​</a></h2><p><code>Transmission Control Protocol/Internet Protocol</code> 传输控制协议/网际协议</p><p>能够在多个不同网络间实现信息传输的协议簇（TCP IP FTP SMTP UDP)</p><blockquote><p>TCP/IP 的四层架构模型</p></blockquote><h3 id="链路层" tabindex="-1">链路层 <a class="header-anchor" href="#链路层" aria-label="Permalink to &quot;链路层&quot;">​</a></h3><p>对电信号进行分组形成具有特定意义的数据帧，然后以广播的形式通过物理介质发送给接收方</p><ul><li>网卡 --- 数据包必须是一块网卡传送到另一块网卡</li><li>主机读取 MAC 地址，处理接收包</li></ul><h3 id="网络层-1" tabindex="-1">网络层 <a class="header-anchor" href="#网络层-1" aria-label="Permalink to &quot;网络层&quot;">​</a></h3><ul><li>IP 协议</li></ul><blockquote><p>引入 IP 协议，制定了一套新地址，区分两台主机是否属于同一网络（网络地址 IP 地址）</p></blockquote><ul><li>ARP 协议</li></ul><blockquote><p>根据 IP 地址获取 MAC 地址的一个网络层协议</p></blockquote><ol><li>发起请求数据包，IP 地址 + 请求数据包，生成以太网数据包，广播</li><li>主机收到数据包，取出 IP 地址，与自己的 IP 地址对比，相同则返回 MAC 地址</li><li>接收返回消息，确定 MAC 地址</li><li>缓存（ARP 缓存返回的 MAC 地址 + IP 地址对应保留一定时间，以防下次请求）</li></ol><ul><li>路由协议</li></ul><blockquote><p>ARP 获取 MAC 地址完成这个路由协议的物理设备就是路由器（交通枢纽）=== 定义网络地址、区分网段、子网内 MAC 寻址、对于不同子网的数据包进行路由</p></blockquote><ul><li>ICMP 协议</li></ul><blockquote><p>因特网控制报文协议，主机与路由器之间进行控制信息传递（检查网络是否通畅、主机是否可达、路由是否可用）出现错误，自动返回错误的信息</p></blockquote><h3 id="传输层-1" tabindex="-1">传输层 <a class="header-anchor" href="#传输层-1" aria-label="Permalink to &quot;传输层&quot;">​</a></h3><p>数据包被发送到主机上以后，是无法确定哪个应用程序要接收这个包（为应用程序标识身份，定义端口）</p><ul><li>UDP 协议</li></ul><blockquote><p>定义了端口，同一个主机上的每个应用程序都需要指定唯一的端口号，传输指定端口（传输性较差）</p></blockquote><ul><li>TCP 协议</li></ul><blockquote><p>传输控制协议，面向链接的，可靠的，基于字节流的通信协议（TCP 确认机制的 UDP 协议）</p></blockquote><ol><li>数据包丢失，无法收到确认，重新发送数据包</li><li>三次对话的确认机制</li><li>首部 + 数据（TCP 数据包没有长度限制，TCP 数据包的长度不会超过 IP 数据包的长度，不必分割）</li></ol><h3 id="应用层-1" tabindex="-1">应用层 <a class="header-anchor" href="#应用层-1" aria-label="Permalink to &quot;应用层&quot;">​</a></h3><p>HTTP FTP SMTP</p><blockquote><p>定义数据格式并按照对应的格式解读数据</p></blockquote><p>请求 Header 中，定义请求数据格式 Accept 和响应数据格式 Content-Type</p><h3 id="缺陷" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><ol><li>没有明显地区区分服务、接口和协议的概念</li><li>不通用，不适用与 TCP/IP 模型之外的任何协议栈</li><li>链路层不是通常意义的一层（一个接口处于网络层和数据链路层之间）</li><li>TCP/IP 模型不区分物理层和数据链路层</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/noun.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>网络名词</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/socket.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Socket</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/socket.html b/network/socket.html
index eef5014..5e875e5 100644
--- a/network/socket.html
+++ b/network/socket.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Socket | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_socket.md.5f45c373.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_socket.md.a2e885ec.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_socket" data-v-6b87e69f><div><h1 id="socket" tabindex="-1">Socket <a class="header-anchor" href="#socket" aria-label="Permalink to &quot;Socket&quot;">​</a></h1><h2 id="socket-1" tabindex="-1">Socket <a class="header-anchor" href="#socket-1" aria-label="Permalink to &quot;Socket&quot;">​</a></h2><p>套接字(Socket)，对网络中不同主机的应用进程之间进行双向通信的端点的抽象（应用程序访问通信协议的操作系统调用套接字）</p><ul><li>套接字上联应用进程，下联网络协议栈</li><li>应用程序通过网络协议进行通信的接口</li><li>应用程序与网络协议栈进行交互的接口</li></ul><h3 id="表示方法" tabindex="-1">表示方法 <a class="header-anchor" href="#表示方法" aria-label="Permalink to &quot;表示方法&quot;">​</a></h3><p>IP 地址:端口号</p><h3 id="连接" tabindex="-1">连接 <a class="header-anchor" href="#连接" aria-label="Permalink to &quot;连接&quot;">​</a></h3><p>一对套接字：Client Socket/Servre Socket</p><ul><li>服务器监听</li></ul><p>服务器端套接字并不定位具体的客户端套接字，处于等待连接的状态，试试监控网络状态</p><ul><li>客户端请求</li></ul><p>客户端的套接字提出连接请求，要连接的目标是服务器端的套接字</p><ul><li>连接确认</li></ul><p>服务端套接字接收到客户端套接字的连接请求，响应客户端套接字的请求，建立新的线程，并把服务器端套接字的描述发送给客户端。客户端确认了此描述，连接建立，服务器端套接字继续处于监听状态，接收其他客户端套接字的连接请求</p><h2 id="websocket" tabindex="-1">WebSocket <a class="header-anchor" href="#websocket" aria-label="Permalink to &quot;WebSocket&quot;">​</a></h2><p>浏览器中用于双向通信的一种 TCP 传输协议，并复用 HTTP 的握手通道</p><h3 id="优点" tabindex="-1">优点 <a class="header-anchor" href="#优点" aria-label="Permalink to &quot;优点&quot;">​</a></h3><ul><li>支持双向通信，实时性更强</li><li>更好的二进制支持</li><li>较少的控制开销（数据包+4 字节的掩码，而 HTTP 每次请求都要携带完整的头部）</li><li>支持扩展（WS 协议定义了扩展，自定义扩展协议、自协议）自定义压缩算法</li></ul><h3 id="建立连接" tabindex="-1">建立连接 <a class="header-anchor" href="#建立连接" aria-label="Permalink to &quot;建立连接&quot;">​</a></h3><blockquote><p>客户端：申请协议升级</p></blockquote><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">GET / HTTP/1.1</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_socket" data-v-6b87e69f><div><h1 id="socket" tabindex="-1">Socket <a class="header-anchor" href="#socket" aria-label="Permalink to &quot;Socket&quot;">​</a></h1><h2 id="socket-1" tabindex="-1">Socket <a class="header-anchor" href="#socket-1" aria-label="Permalink to &quot;Socket&quot;">​</a></h2><p>套接字(Socket)，对网络中不同主机的应用进程之间进行双向通信的端点的抽象（应用程序访问通信协议的操作系统调用套接字）</p><ul><li>套接字上联应用进程，下联网络协议栈</li><li>应用程序通过网络协议进行通信的接口</li><li>应用程序与网络协议栈进行交互的接口</li></ul><h3 id="表示方法" tabindex="-1">表示方法 <a class="header-anchor" href="#表示方法" aria-label="Permalink to &quot;表示方法&quot;">​</a></h3><p>IP 地址:端口号</p><h3 id="连接" tabindex="-1">连接 <a class="header-anchor" href="#连接" aria-label="Permalink to &quot;连接&quot;">​</a></h3><p>一对套接字：Client Socket/Servre Socket</p><ul><li>服务器监听</li></ul><p>服务器端套接字并不定位具体的客户端套接字，处于等待连接的状态，试试监控网络状态</p><ul><li>客户端请求</li></ul><p>客户端的套接字提出连接请求，要连接的目标是服务器端的套接字</p><ul><li>连接确认</li></ul><p>服务端套接字接收到客户端套接字的连接请求，响应客户端套接字的请求，建立新的线程，并把服务器端套接字的描述发送给客户端。客户端确认了此描述，连接建立，服务器端套接字继续处于监听状态，接收其他客户端套接字的连接请求</p><h2 id="websocket" tabindex="-1">WebSocket <a class="header-anchor" href="#websocket" aria-label="Permalink to &quot;WebSocket&quot;">​</a></h2><p>浏览器中用于双向通信的一种 TCP 传输协议，并复用 HTTP 的握手通道</p><h3 id="优点" tabindex="-1">优点 <a class="header-anchor" href="#优点" aria-label="Permalink to &quot;优点&quot;">​</a></h3><ul><li>支持双向通信，实时性更强</li><li>更好的二进制支持</li><li>较少的控制开销（数据包+4 字节的掩码，而 HTTP 每次请求都要携带完整的头部）</li><li>支持扩展（WS 协议定义了扩展，自定义扩展协议、自协议）自定义压缩算法</li></ul><h3 id="建立连接" tabindex="-1">建立连接 <a class="header-anchor" href="#建立连接" aria-label="Permalink to &quot;建立连接&quot;">​</a></h3><blockquote><p>客户端：申请协议升级</p></blockquote><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">GET / HTTP/1.1</span></span>
 <span class="line"><span style="color:#e1e4e8;">Host: localhost:8080</span></span>
 <span class="line"><span style="color:#e1e4e8;">Origin: http://127.0.0.1:3000</span></span>
 <span class="line"><span style="color:#e1e4e8;">Connection: Upgrade</span></span>
@@ -47,8 +47,8 @@
 <span class="line"><span style="color:#6A737D;">// 这里结果就是 Sec-Websocket-Accept 响应值</span></span>
 <span class="line"><span style="color:#D73A49;">const</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">digest</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">createHash</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;sha1&#39;</span><span style="color:#24292E;">)</span></span>
 <span class="line"><span style="color:#24292E;">  .</span><span style="color:#6F42C1;">update</span><span style="color:#24292E;">(key </span><span style="color:#D73A49;">+</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">GUID</span><span style="color:#24292E;">)</span></span>
-<span class="line"><span style="color:#24292E;">  .</span><span style="color:#6F42C1;">digest</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;base64&#39;</span><span style="color:#24292E;">);</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/osi.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>OSI 模型</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/special_addr.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>特殊地址</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">  .</span><span style="color:#6F42C1;">digest</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;base64&#39;</span><span style="color:#24292E;">);</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/osi.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>OSI 模型</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/special_addr.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>特殊地址</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/special_addr.html b/network/special_addr.html
index 7a6a320..84dd357 100644
--- a/network/special_addr.html
+++ b/network/special_addr.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>http 特殊地址 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_special_addr.md.8b6962a9.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_special_addr.md.deb0827e.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_special_addr" data-v-6b87e69f><div><h1 id="http-特殊地址" tabindex="-1">http 特殊地址 <a class="header-anchor" href="#http-特殊地址" aria-label="Permalink to &quot;http 特殊地址&quot;">​</a></h1><h2 id="_0-0-0-0" tabindex="-1">0.0.0.0 <a class="header-anchor" href="#_0-0-0-0" aria-label="Permalink to &quot;0.0.0.0&quot;">​</a></h2><p><code>INADDR_ANY</code></p><p>不可路由的源地址，用于指定无效、未知或不适用的目标（”无特定地址“占位符）</p><h3 id="服务器" tabindex="-1">服务器 <a class="header-anchor" href="#服务器" aria-label="Permalink to &quot;服务器&quot;">​</a></h3><p>常用于多机测试，监视当前分配给该多宿主设备上的接口的所有 IP 地址</p><h3 id="客户端" tabindex="-1">客户端 <a class="header-anchor" href="#客户端" aria-label="Permalink to &quot;客户端&quot;">​</a></h3><p>本地机器上的所有 IPv4 地址</p><h2 id="_127-0-0-1" tabindex="-1">127.0.0.1 <a class="header-anchor" href="#_127-0-0-1" aria-label="Permalink to &quot;127.0.0.1&quot;">​</a></h2><p>环回地址（localhost）。用于与最终用户使用的同一台机器或计算机建立 IP 连接</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/socket.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Socket</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/status_code.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>HTTP 状态码</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_special_addr" data-v-6b87e69f><div><h1 id="http-特殊地址" tabindex="-1">http 特殊地址 <a class="header-anchor" href="#http-特殊地址" aria-label="Permalink to &quot;http 特殊地址&quot;">​</a></h1><h2 id="_0-0-0-0" tabindex="-1">0.0.0.0 <a class="header-anchor" href="#_0-0-0-0" aria-label="Permalink to &quot;0.0.0.0&quot;">​</a></h2><p><code>INADDR_ANY</code></p><p>不可路由的源地址，用于指定无效、未知或不适用的目标（”无特定地址“占位符）</p><h3 id="服务器" tabindex="-1">服务器 <a class="header-anchor" href="#服务器" aria-label="Permalink to &quot;服务器&quot;">​</a></h3><p>常用于多机测试，监视当前分配给该多宿主设备上的接口的所有 IP 地址</p><h3 id="客户端" tabindex="-1">客户端 <a class="header-anchor" href="#客户端" aria-label="Permalink to &quot;客户端&quot;">​</a></h3><p>本地机器上的所有 IPv4 地址</p><h2 id="_127-0-0-1" tabindex="-1">127.0.0.1 <a class="header-anchor" href="#_127-0-0-1" aria-label="Permalink to &quot;127.0.0.1&quot;">​</a></h2><p>环回地址（localhost）。用于与最终用户使用的同一台机器或计算机建立 IP 连接</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/socket.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Socket</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/status_code.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>HTTP 状态码</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/status_code.html b/network/status_code.html
index 7b3f421..03b1bd5 100644
--- a/network/status_code.html
+++ b/network/status_code.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>HTTP 状态码 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_status_code.md.3f54f40a.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_status_code.md.b6f517ca.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_status_code" data-v-6b87e69f><div><h1 id="http-状态码" tabindex="-1">HTTP 状态码 <a class="header-anchor" href="#http-状态码" aria-label="Permalink to &quot;HTTP 状态码&quot;">​</a></h1><p>五类状态码，状态码的第一个数字代表了响应的五种状态之一。</p><p><a href="https://en.wikipedia.org/wiki/List_of_HTTP_status_codes" target="_blank" rel="noreferrer">Wiki - http status code</a></p><h2 id="_1xx" tabindex="-1">1xx <a class="header-anchor" href="#_1xx" aria-label="Permalink to &quot;1xx&quot;">​</a></h2><p>消息类型，<code>请求已被接受，需要继续等待服务器处理</code>，临时响应，以空行结束，HTTP1.0 协议中没有定义任何 1xx 状态码。</p><h3 id="_100-continue" tabindex="-1">100 Continue <a class="header-anchor" href="#_100-continue" aria-label="Permalink to &quot;100 Continue&quot;">​</a></h3><p>服务器已经接收到请求头，并且客户端应继续发送请求体。</p><h3 id="_101-switching-protocols" tabindex="-1">101 Switching Protocols <a class="header-anchor" href="#_101-switching-protocols" aria-label="Permalink to &quot;101 Switching Protocols&quot;">​</a></h3><p>服务器已经理解客户端的请求，并将通过 Upgrade 消息头通知客户端采用不同的协议来完成这个请求。（Websocket）</p><h3 id="_102-processing-webdav-rfc" tabindex="-1">102 Processing （WebDav）- RFC <a class="header-anchor" href="#_102-processing-webdav-rfc" aria-label="Permalink to &quot;102 Processing （WebDav）- RFC&quot;">​</a></h3><p>WebDav 请求包含许多涉及文件操作的自请求，需要很长时间才能完成请求。服务器已经收到并正在处理请求，但无响应可用。</p><h3 id="_103-early-hints-rfc" tabindex="-1">103 Early Hints - RFC <a class="header-anchor" href="#_103-early-hints-rfc" aria-label="Permalink to &quot;103 Early Hints - RFC&quot;">​</a></h3><p>用来在最终的 HTTP 消息之前返回一些响应头。</p><h2 id="_2xx" tabindex="-1">2xx <a class="header-anchor" href="#_2xx" aria-label="Permalink to &quot;2xx&quot;">​</a></h2><p>成功类型，代表请求已成功被服务器接收、理解、并接受。</p><h3 id="_200-ok" tabindex="-1">200 OK <a class="header-anchor" href="#_200-ok" aria-label="Permalink to &quot;200 OK&quot;">​</a></h3><p>请求已成功，请求所希望的响应头或数据体将随此响应返回。</p><h3 id="_201-created" tabindex="-1">201 Created <a class="header-anchor" href="#_201-created" aria-label="Permalink to &quot;201 Created&quot;">​</a></h3><p>请求已经被实现，而且有一个新的资源已经依据请求的需要而创建，且其 URI 已经随 Location 头信息返回。</p><h3 id="_202-accepted" tabindex="-1">202 Accepted <a class="header-anchor" href="#_202-accepted" aria-label="Permalink to &quot;202 Accepted&quot;">​</a></h3><p>服务器已经接受请求，单尚未处理。最终可能不会被执行，并且可能在处理发生时被禁止。</p><h3 id="_203-non-authroritative-information-http-1-1" tabindex="-1">203 Non-Authroritative Information HTTP/1.1 <a class="header-anchor" href="#_203-non-authroritative-information-http-1-1" aria-label="Permalink to &quot;203 Non-Authroritative Information HTTP/1.1&quot;">​</a></h3><p>服务器是一个转换代理服务器（网络加速器）</p><h3 id="_204-no-content" tabindex="-1">204 No Content <a class="header-anchor" href="#_204-no-content" aria-label="Permalink to &quot;204 No Content&quot;">​</a></h3><p>服务器成功处理了请求，没有返回任何内容。（Wi-Fi 接入，无需验证返回 204，需验证弹出网页浏览器界面）</p><h3 id="_205-reset-content" tabindex="-1">205 Reset Content <a class="header-anchor" href="#_205-reset-content" aria-label="Permalink to &quot;205 Reset Content&quot;">​</a></h3><p>与 204 不同的是，205 要求请求者重置文档视图。</p><h3 id="_206-partial-content-rfc" tabindex="-1">206 Partial Content - RFC <a class="header-anchor" href="#_206-partial-content-rfc" aria-label="Permalink to &quot;206 Partial Content - RFC&quot;">​</a></h3><p>服务器已经成功处理了部分 GET 请求（断点续传）</p><h3 id="_207-multi-status-rfc" tabindex="-1">207 Multi-Status - RFC <a class="header-anchor" href="#_207-multi-status-rfc" aria-label="Permalink to &quot;207 Multi-Status - RFC&quot;">​</a></h3><p>XML 消息</p><h3 id="_208-already-reported-rfc" tabindex="-1">208 Already Reported - RFC <a class="header-anchor" href="#_208-already-reported-rfc" aria-label="Permalink to &quot;208 Already Reported - RFC&quot;">​</a></h3><p>多状态</p><h3 id="_226-im-used-rfc" tabindex="-1">226 IM Used - RFC <a class="header-anchor" href="#_226-im-used-rfc" aria-label="Permalink to &quot;226 IM Used - RFC&quot;">​</a></h3><p>对实体请求的一个或多个实体操作的结果表示。</p><h2 id="_3xx" tabindex="-1">3xx <a class="header-anchor" href="#_3xx" aria-label="Permalink to &quot;3xx&quot;">​</a></h2><p>重定向类型，<code>需要客户端进一步的操作才能完成请求</code>，重定向目标在本次响应的 Location 域中指明。</p><h3 id="_300-multiple-choices" tabindex="-1">300 Multiple Choices <a class="header-anchor" href="#_300-multiple-choices" aria-label="Permalink to &quot;300 Multiple Choices&quot;">​</a></h3><p>被请求的资源有一系列可供选择的回馈信息，用户或浏览器自行选择一个首选的地址进行重定向。</p><h3 id="_301-moved-permanently" tabindex="-1">301 Moved Permanently <a class="header-anchor" href="#_301-moved-permanently" aria-label="Permalink to &quot;301 Moved Permanently&quot;">​</a></h3><p>被请求的资源已永久移动到新位置，并且将来对此资源的引用都应该使用本响应应返回的若干个 URI 之一。</p><h3 id="_302-found-moved-temporarily" tabindex="-1">302 Found - Moved Temporarily <a class="header-anchor" href="#_302-found-moved-temporarily" aria-label="Permalink to &quot;302 Found - Moved Temporarily&quot;">​</a></h3><p>要求客户端执行临时重定向</p><h3 id="_303-see-other" tabindex="-1">303 See Other <a class="header-anchor" href="#_303-see-other" aria-label="Permalink to &quot;303 See Other&quot;">​</a></h3><p>对应当前请求的响应可以在另一个 URI 上被找到，当响应于 POST（或 PUT/DELETE）接收到响应时，客户端应该假定服务器已经收到数据，并且应该使用单独的 GET 消息发出重定向。</p><h3 id="_304-not-modified" tabindex="-1">304 Not Modified <a class="header-anchor" href="#_304-not-modified" aria-label="Permalink to &quot;304 Not Modified&quot;">​</a></h3><p>资源在有请求头的 If-Modified-Since 或 If-None-Match 参数指定的这一版之后，未曾被修改。（资源不需要重新传输资源）</p><h3 id="_305-use-proxy" tabindex="-1">305 Use Proxy <a class="header-anchor" href="#_305-use-proxy" aria-label="Permalink to &quot;305 Use Proxy&quot;">​</a></h3><p>被请求的资源必须通过指定的代理才能被访问。</p><h3 id="_306-switch-proxy" tabindex="-1">306 Switch Proxy <a class="header-anchor" href="#_306-switch-proxy" aria-label="Permalink to &quot;306 Switch Proxy&quot;">​</a></h3><p>后续请求应使用指定的代理。</p><h3 id="_307-temporary-redirect" tabindex="-1">307 Temporary Redirect <a class="header-anchor" href="#_307-temporary-redirect" aria-label="Permalink to &quot;307 Temporary Redirect&quot;">​</a></h3><p>请求应该与另一个 URI 重复，单后续的请求应仍使用原始的 URI。</p><h3 id="_308-permanent-redirect-rfc" tabindex="-1">308 Permanent Redirect - RFC <a class="header-anchor" href="#_308-permanent-redirect-rfc" aria-label="Permalink to &quot;308 Permanent Redirect - RFC&quot;">​</a></h3><p>请求和所有将来的请求应该使用另一个 URI 重复。</p><h2 id="_4xx" tabindex="-1">4xx <a class="header-anchor" href="#_4xx" aria-label="Permalink to &quot;4xx&quot;">​</a></h2><p>客户端错误</p><h3 id="_400-bad-request" tabindex="-1">400 Bad Request <a class="header-anchor" href="#_400-bad-request" aria-label="Permalink to &quot;400 Bad Request&quot;">​</a></h3><p>格式错误的请求语法，无效的请求消息或欺骗性路由请求，服务器不能或不会处理该请求</p><h3 id="_401-unauthorized-rfc" tabindex="-1">401 Unauthorized - RFC <a class="header-anchor" href="#_401-unauthorized-rfc" aria-label="Permalink to &quot;401 Unauthorized - RFC&quot;">​</a></h3><p>未认证，用户没有必要的凭据（特定地址被拒绝访问网站）</p><h3 id="_402-payment-required" tabindex="-1">402 Payment Required <a class="header-anchor" href="#_402-payment-required" aria-label="Permalink to &quot;402 Payment Required&quot;">​</a></h3><p>将来的可能的需求而预留（在线支付、请求限制）</p><h3 id="_403-forbidden" tabindex="-1">403 Forbidden <a class="header-anchor" href="#_403-forbidden" aria-label="Permalink to &quot;403 Forbidden&quot;">​</a></h3><p>服务器已经理解请求，但是拒绝执行。身份验证并不能提供任何帮助，请求不应该被重复提交。</p><h3 id="_404-not-found" tabindex="-1">404 Not Found <a class="header-anchor" href="#_404-not-found" aria-label="Permalink to &quot;404 Not Found&quot;">​</a></h3><p>请求失败，请求所希望得到的资源未被在服务器上发现，但允许用户的后续请求。</p><h3 id="_405-method-not-allowed" tabindex="-1">405 Method Not Allowed <a class="header-anchor" href="#_405-method-not-allowed" aria-label="Permalink to &quot;405 Method Not Allowed&quot;">​</a></h3><p>请求行中指定的请求方法不能被用于请求相应的资源。</p><h3 id="_406-not-acceptable" tabindex="-1">406 Not Acceptable <a class="header-anchor" href="#_406-not-acceptable" aria-label="Permalink to &quot;406 Not Acceptable&quot;">​</a></h3><p>请求的资源的内容特性无法满足请求头中的条件，因此无法生成相应实体，该请求不可接受。</p><h3 id="_407-proxy-authentication-required-rfc" tabindex="-1">407 Proxy Authentication Required - RFC <a class="header-anchor" href="#_407-proxy-authentication-required-rfc" aria-label="Permalink to &quot;407 Proxy Authentication Required - RFC&quot;">​</a></h3><p>客户端必须在代理服务器上进行身份验证</p><h3 id="_408-request-timeout" tabindex="-1">408 Request Timeout <a class="header-anchor" href="#_408-request-timeout" aria-label="Permalink to &quot;408 Request Timeout&quot;">​</a></h3><p>请求超时</p><h3 id="_415-unsupported-media-type" tabindex="-1">415 Unsupported Media Type <a class="header-anchor" href="#_415-unsupported-media-type" aria-label="Permalink to &quot;415 Unsupported Media Type&quot;">​</a></h3><p>对于当前请求的方法和所请求的资源（请求中提交的媒体类型不支持）</p><h2 id="_5xx" tabindex="-1">5xx <a class="header-anchor" href="#_5xx" aria-label="Permalink to &quot;5xx&quot;">​</a></h2><p><code>服务器错误</code>，表示服务器无法完成明显有效的请求</p><h3 id="_500-internal-server-error" tabindex="-1">500 Internal Server Error <a class="header-anchor" href="#_500-internal-server-error" aria-label="Permalink to &quot;500 Internal Server Error&quot;">​</a></h3><p>服务器出现问题，无法完成对请求的处理。</p><h3 id="_501-not-implemented" tabindex="-1">501 Not Implemented <a class="header-anchor" href="#_501-not-implemented" aria-label="Permalink to &quot;501 Not Implemented&quot;">​</a></h3><p>服务器不支持当前请求所需要的某个功能。当服务器无法识别请求的方法，并且无法支持其对任何资源的请求。</p><h3 id="_502-bad-gateway" tabindex="-1">502 Bad Gateway <a class="header-anchor" href="#_502-bad-gateway" aria-label="Permalink to &quot;502 Bad Gateway&quot;">​</a></h3><p>作为网关或者代理工作的服务器尝试执行请求时，从上游服务器接收到无效的响应。</p><h3 id="_503-service-unavailable" tabindex="-1">503 Service Unavailable <a class="header-anchor" href="#_503-service-unavailable" aria-label="Permalink to &quot;503 Service Unavailable&quot;">​</a></h3><p>暂时性的，服务器维护或者过载，服务器当前无法处理请求。</p><h3 id="_504-gateway-timeout" tabindex="-1">504 Gateway Timeout <a class="header-anchor" href="#_504-gateway-timeout" aria-label="Permalink to &quot;504 Gateway Timeout&quot;">​</a></h3><p>作为网关或者代理工作的服务器尝试执行请求时，未能及时从上游服务器收到响应。</p><h3 id="_511-network-authentication-required" tabindex="-1">511 Network Authentication Required <a class="header-anchor" href="#_511-network-authentication-required" aria-label="Permalink to &quot;511 Network Authentication Required&quot;">​</a></h3><p>客户端需要进行身份验证才能获得网络访问权限，旨在限制用户群访问特定网络（WiFi 热点）</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/special_addr.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>特殊地址</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/subnet_mask.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>子网掩码</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_status_code" data-v-6b87e69f><div><h1 id="http-状态码" tabindex="-1">HTTP 状态码 <a class="header-anchor" href="#http-状态码" aria-label="Permalink to &quot;HTTP 状态码&quot;">​</a></h1><p>五类状态码，状态码的第一个数字代表了响应的五种状态之一。</p><p><a href="https://en.wikipedia.org/wiki/List_of_HTTP_status_codes" target="_blank" rel="noreferrer">Wiki - http status code</a></p><h2 id="_1xx" tabindex="-1">1xx <a class="header-anchor" href="#_1xx" aria-label="Permalink to &quot;1xx&quot;">​</a></h2><p>消息类型，<code>请求已被接受，需要继续等待服务器处理</code>，临时响应，以空行结束，HTTP1.0 协议中没有定义任何 1xx 状态码。</p><h3 id="_100-continue" tabindex="-1">100 Continue <a class="header-anchor" href="#_100-continue" aria-label="Permalink to &quot;100 Continue&quot;">​</a></h3><p>服务器已经接收到请求头，并且客户端应继续发送请求体。</p><h3 id="_101-switching-protocols" tabindex="-1">101 Switching Protocols <a class="header-anchor" href="#_101-switching-protocols" aria-label="Permalink to &quot;101 Switching Protocols&quot;">​</a></h3><p>服务器已经理解客户端的请求，并将通过 Upgrade 消息头通知客户端采用不同的协议来完成这个请求。（Websocket）</p><h3 id="_102-processing-webdav-rfc" tabindex="-1">102 Processing （WebDav）- RFC <a class="header-anchor" href="#_102-processing-webdav-rfc" aria-label="Permalink to &quot;102 Processing （WebDav）- RFC&quot;">​</a></h3><p>WebDav 请求包含许多涉及文件操作的自请求，需要很长时间才能完成请求。服务器已经收到并正在处理请求，但无响应可用。</p><h3 id="_103-early-hints-rfc" tabindex="-1">103 Early Hints - RFC <a class="header-anchor" href="#_103-early-hints-rfc" aria-label="Permalink to &quot;103 Early Hints - RFC&quot;">​</a></h3><p>用来在最终的 HTTP 消息之前返回一些响应头。</p><h2 id="_2xx" tabindex="-1">2xx <a class="header-anchor" href="#_2xx" aria-label="Permalink to &quot;2xx&quot;">​</a></h2><p>成功类型，代表请求已成功被服务器接收、理解、并接受。</p><h3 id="_200-ok" tabindex="-1">200 OK <a class="header-anchor" href="#_200-ok" aria-label="Permalink to &quot;200 OK&quot;">​</a></h3><p>请求已成功，请求所希望的响应头或数据体将随此响应返回。</p><h3 id="_201-created" tabindex="-1">201 Created <a class="header-anchor" href="#_201-created" aria-label="Permalink to &quot;201 Created&quot;">​</a></h3><p>请求已经被实现，而且有一个新的资源已经依据请求的需要而创建，且其 URI 已经随 Location 头信息返回。</p><h3 id="_202-accepted" tabindex="-1">202 Accepted <a class="header-anchor" href="#_202-accepted" aria-label="Permalink to &quot;202 Accepted&quot;">​</a></h3><p>服务器已经接受请求，单尚未处理。最终可能不会被执行，并且可能在处理发生时被禁止。</p><h3 id="_203-non-authroritative-information-http-1-1" tabindex="-1">203 Non-Authroritative Information HTTP/1.1 <a class="header-anchor" href="#_203-non-authroritative-information-http-1-1" aria-label="Permalink to &quot;203 Non-Authroritative Information HTTP/1.1&quot;">​</a></h3><p>服务器是一个转换代理服务器（网络加速器）</p><h3 id="_204-no-content" tabindex="-1">204 No Content <a class="header-anchor" href="#_204-no-content" aria-label="Permalink to &quot;204 No Content&quot;">​</a></h3><p>服务器成功处理了请求，没有返回任何内容。（Wi-Fi 接入，无需验证返回 204，需验证弹出网页浏览器界面）</p><h3 id="_205-reset-content" tabindex="-1">205 Reset Content <a class="header-anchor" href="#_205-reset-content" aria-label="Permalink to &quot;205 Reset Content&quot;">​</a></h3><p>与 204 不同的是，205 要求请求者重置文档视图。</p><h3 id="_206-partial-content-rfc" tabindex="-1">206 Partial Content - RFC <a class="header-anchor" href="#_206-partial-content-rfc" aria-label="Permalink to &quot;206 Partial Content - RFC&quot;">​</a></h3><p>服务器已经成功处理了部分 GET 请求（断点续传）</p><h3 id="_207-multi-status-rfc" tabindex="-1">207 Multi-Status - RFC <a class="header-anchor" href="#_207-multi-status-rfc" aria-label="Permalink to &quot;207 Multi-Status - RFC&quot;">​</a></h3><p>XML 消息</p><h3 id="_208-already-reported-rfc" tabindex="-1">208 Already Reported - RFC <a class="header-anchor" href="#_208-already-reported-rfc" aria-label="Permalink to &quot;208 Already Reported - RFC&quot;">​</a></h3><p>多状态</p><h3 id="_226-im-used-rfc" tabindex="-1">226 IM Used - RFC <a class="header-anchor" href="#_226-im-used-rfc" aria-label="Permalink to &quot;226 IM Used - RFC&quot;">​</a></h3><p>对实体请求的一个或多个实体操作的结果表示。</p><h2 id="_3xx" tabindex="-1">3xx <a class="header-anchor" href="#_3xx" aria-label="Permalink to &quot;3xx&quot;">​</a></h2><p>重定向类型，<code>需要客户端进一步的操作才能完成请求</code>，重定向目标在本次响应的 Location 域中指明。</p><h3 id="_300-multiple-choices" tabindex="-1">300 Multiple Choices <a class="header-anchor" href="#_300-multiple-choices" aria-label="Permalink to &quot;300 Multiple Choices&quot;">​</a></h3><p>被请求的资源有一系列可供选择的回馈信息，用户或浏览器自行选择一个首选的地址进行重定向。</p><h3 id="_301-moved-permanently" tabindex="-1">301 Moved Permanently <a class="header-anchor" href="#_301-moved-permanently" aria-label="Permalink to &quot;301 Moved Permanently&quot;">​</a></h3><p>被请求的资源已永久移动到新位置，并且将来对此资源的引用都应该使用本响应应返回的若干个 URI 之一。</p><h3 id="_302-found-moved-temporarily" tabindex="-1">302 Found - Moved Temporarily <a class="header-anchor" href="#_302-found-moved-temporarily" aria-label="Permalink to &quot;302 Found - Moved Temporarily&quot;">​</a></h3><p>要求客户端执行临时重定向</p><h3 id="_303-see-other" tabindex="-1">303 See Other <a class="header-anchor" href="#_303-see-other" aria-label="Permalink to &quot;303 See Other&quot;">​</a></h3><p>对应当前请求的响应可以在另一个 URI 上被找到，当响应于 POST（或 PUT/DELETE）接收到响应时，客户端应该假定服务器已经收到数据，并且应该使用单独的 GET 消息发出重定向。</p><h3 id="_304-not-modified" tabindex="-1">304 Not Modified <a class="header-anchor" href="#_304-not-modified" aria-label="Permalink to &quot;304 Not Modified&quot;">​</a></h3><p>资源在有请求头的 If-Modified-Since 或 If-None-Match 参数指定的这一版之后，未曾被修改。（资源不需要重新传输资源）</p><h3 id="_305-use-proxy" tabindex="-1">305 Use Proxy <a class="header-anchor" href="#_305-use-proxy" aria-label="Permalink to &quot;305 Use Proxy&quot;">​</a></h3><p>被请求的资源必须通过指定的代理才能被访问。</p><h3 id="_306-switch-proxy" tabindex="-1">306 Switch Proxy <a class="header-anchor" href="#_306-switch-proxy" aria-label="Permalink to &quot;306 Switch Proxy&quot;">​</a></h3><p>后续请求应使用指定的代理。</p><h3 id="_307-temporary-redirect" tabindex="-1">307 Temporary Redirect <a class="header-anchor" href="#_307-temporary-redirect" aria-label="Permalink to &quot;307 Temporary Redirect&quot;">​</a></h3><p>请求应该与另一个 URI 重复，单后续的请求应仍使用原始的 URI。</p><h3 id="_308-permanent-redirect-rfc" tabindex="-1">308 Permanent Redirect - RFC <a class="header-anchor" href="#_308-permanent-redirect-rfc" aria-label="Permalink to &quot;308 Permanent Redirect - RFC&quot;">​</a></h3><p>请求和所有将来的请求应该使用另一个 URI 重复。</p><h2 id="_4xx" tabindex="-1">4xx <a class="header-anchor" href="#_4xx" aria-label="Permalink to &quot;4xx&quot;">​</a></h2><p>客户端错误</p><h3 id="_400-bad-request" tabindex="-1">400 Bad Request <a class="header-anchor" href="#_400-bad-request" aria-label="Permalink to &quot;400 Bad Request&quot;">​</a></h3><p>格式错误的请求语法，无效的请求消息或欺骗性路由请求，服务器不能或不会处理该请求</p><h3 id="_401-unauthorized-rfc" tabindex="-1">401 Unauthorized - RFC <a class="header-anchor" href="#_401-unauthorized-rfc" aria-label="Permalink to &quot;401 Unauthorized - RFC&quot;">​</a></h3><p>未认证，用户没有必要的凭据（特定地址被拒绝访问网站）</p><h3 id="_402-payment-required" tabindex="-1">402 Payment Required <a class="header-anchor" href="#_402-payment-required" aria-label="Permalink to &quot;402 Payment Required&quot;">​</a></h3><p>将来的可能的需求而预留（在线支付、请求限制）</p><h3 id="_403-forbidden" tabindex="-1">403 Forbidden <a class="header-anchor" href="#_403-forbidden" aria-label="Permalink to &quot;403 Forbidden&quot;">​</a></h3><p>服务器已经理解请求，但是拒绝执行。身份验证并不能提供任何帮助，请求不应该被重复提交。</p><h3 id="_404-not-found" tabindex="-1">404 Not Found <a class="header-anchor" href="#_404-not-found" aria-label="Permalink to &quot;404 Not Found&quot;">​</a></h3><p>请求失败，请求所希望得到的资源未被在服务器上发现，但允许用户的后续请求。</p><h3 id="_405-method-not-allowed" tabindex="-1">405 Method Not Allowed <a class="header-anchor" href="#_405-method-not-allowed" aria-label="Permalink to &quot;405 Method Not Allowed&quot;">​</a></h3><p>请求行中指定的请求方法不能被用于请求相应的资源。</p><h3 id="_406-not-acceptable" tabindex="-1">406 Not Acceptable <a class="header-anchor" href="#_406-not-acceptable" aria-label="Permalink to &quot;406 Not Acceptable&quot;">​</a></h3><p>请求的资源的内容特性无法满足请求头中的条件，因此无法生成相应实体，该请求不可接受。</p><h3 id="_407-proxy-authentication-required-rfc" tabindex="-1">407 Proxy Authentication Required - RFC <a class="header-anchor" href="#_407-proxy-authentication-required-rfc" aria-label="Permalink to &quot;407 Proxy Authentication Required - RFC&quot;">​</a></h3><p>客户端必须在代理服务器上进行身份验证</p><h3 id="_408-request-timeout" tabindex="-1">408 Request Timeout <a class="header-anchor" href="#_408-request-timeout" aria-label="Permalink to &quot;408 Request Timeout&quot;">​</a></h3><p>请求超时</p><h3 id="_415-unsupported-media-type" tabindex="-1">415 Unsupported Media Type <a class="header-anchor" href="#_415-unsupported-media-type" aria-label="Permalink to &quot;415 Unsupported Media Type&quot;">​</a></h3><p>对于当前请求的方法和所请求的资源（请求中提交的媒体类型不支持）</p><h2 id="_5xx" tabindex="-1">5xx <a class="header-anchor" href="#_5xx" aria-label="Permalink to &quot;5xx&quot;">​</a></h2><p><code>服务器错误</code>，表示服务器无法完成明显有效的请求</p><h3 id="_500-internal-server-error" tabindex="-1">500 Internal Server Error <a class="header-anchor" href="#_500-internal-server-error" aria-label="Permalink to &quot;500 Internal Server Error&quot;">​</a></h3><p>服务器出现问题，无法完成对请求的处理。</p><h3 id="_501-not-implemented" tabindex="-1">501 Not Implemented <a class="header-anchor" href="#_501-not-implemented" aria-label="Permalink to &quot;501 Not Implemented&quot;">​</a></h3><p>服务器不支持当前请求所需要的某个功能。当服务器无法识别请求的方法，并且无法支持其对任何资源的请求。</p><h3 id="_502-bad-gateway" tabindex="-1">502 Bad Gateway <a class="header-anchor" href="#_502-bad-gateway" aria-label="Permalink to &quot;502 Bad Gateway&quot;">​</a></h3><p>作为网关或者代理工作的服务器尝试执行请求时，从上游服务器接收到无效的响应。</p><h3 id="_503-service-unavailable" tabindex="-1">503 Service Unavailable <a class="header-anchor" href="#_503-service-unavailable" aria-label="Permalink to &quot;503 Service Unavailable&quot;">​</a></h3><p>暂时性的，服务器维护或者过载，服务器当前无法处理请求。</p><h3 id="_504-gateway-timeout" tabindex="-1">504 Gateway Timeout <a class="header-anchor" href="#_504-gateway-timeout" aria-label="Permalink to &quot;504 Gateway Timeout&quot;">​</a></h3><p>作为网关或者代理工作的服务器尝试执行请求时，未能及时从上游服务器收到响应。</p><h3 id="_511-network-authentication-required" tabindex="-1">511 Network Authentication Required <a class="header-anchor" href="#_511-network-authentication-required" aria-label="Permalink to &quot;511 Network Authentication Required&quot;">​</a></h3><p>客户端需要进行身份验证才能获得网络访问权限，旨在限制用户群访问特定网络（WiFi 热点）</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/special_addr.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>特殊地址</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/subnet_mask.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>子网掩码</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/subnet_mask.html b/network/subnet_mask.html
index 3f61e80..23fd934 100644
--- a/network/subnet_mask.html
+++ b/network/subnet_mask.html
@@ -5,24 +5,24 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>子网掩码 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_subnet_mask.md.9eb6788c.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_subnet_mask.md.7a58406b.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_subnet_mask" data-v-6b87e69f><div><h1 id="子网掩码" tabindex="-1">子网掩码 <a class="header-anchor" href="#子网掩码" aria-label="Permalink to &quot;子网掩码&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">定义</p><p><code>子网掩码</code>(subnet mask)又叫网络掩码、地址掩码、子网络遮罩。指明一个 IP 地址的哪些位标识的是主机所在的子网以及哪些位标识的是主机的位掩码。不能单独存在，结合 IP 地址使用，将 IP 地址划分成网络地址和主机地址。</p></div><h2 id="背景" tabindex="-1">背景 <a class="header-anchor" href="#背景" aria-label="Permalink to &quot;背景&quot;">​</a></h2><p>IPV4 地址资源紧缺，解决 IP 地址分配而产生的虚拟 IP 技术，通过子网掩码将 A、B、C 三类地址划分为若干子网，提高 IP 地址的分配效率。</p><h2 id="功能" tabindex="-1">功能 <a class="header-anchor" href="#功能" aria-label="Permalink to &quot;功能&quot;">​</a></h2><p>32 位地址</p><ul><li>用于屏蔽 IP 地址的一部分以区别网络标识和主机标识，该 IP 地址是在局域网上还是在远程网（广域网）</li><li>将一个大的 IP 网络划分为若干个小的子网络</li></ul><h3 id="声明网络地址与主机地址" tabindex="-1">声明网络地址与主机地址 <a class="header-anchor" href="#声明网络地址与主机地址" aria-label="Permalink to &quot;声明网络地址与主机地址&quot;">​</a></h3><table><thead><tr><th>类别</th><th>子网掩码的二进制数值</th><th>子网掩码的十进制数值</th></tr></thead><tbody><tr><td>A</td><td>11111111 00000000 00000000 00000000</td><td>255.0.0.0</td></tr><tr><td>B</td><td>11111111 11111111 00000000 00000000</td><td>255.255.0.0</td></tr><tr><td>C</td><td>11111111 11111111 11111111 00000000</td><td>255.255.255.0</td></tr></tbody></table><ul><li>将子网掩码二进制和 IP 地址二进制进行逻辑与（AND）运算，得到的是主机地址</li></ul><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">IP 地址 192.168.10.11 AND 255.255.255.0 ==== 192.168.10.0</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_subnet_mask" data-v-6b87e69f><div><h1 id="子网掩码" tabindex="-1">子网掩码 <a class="header-anchor" href="#子网掩码" aria-label="Permalink to &quot;子网掩码&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">定义</p><p><code>子网掩码</code>(subnet mask)又叫网络掩码、地址掩码、子网络遮罩。指明一个 IP 地址的哪些位标识的是主机所在的子网以及哪些位标识的是主机的位掩码。不能单独存在，结合 IP 地址使用，将 IP 地址划分成网络地址和主机地址。</p></div><h2 id="背景" tabindex="-1">背景 <a class="header-anchor" href="#背景" aria-label="Permalink to &quot;背景&quot;">​</a></h2><p>IPV4 地址资源紧缺，解决 IP 地址分配而产生的虚拟 IP 技术，通过子网掩码将 A、B、C 三类地址划分为若干子网，提高 IP 地址的分配效率。</p><h2 id="功能" tabindex="-1">功能 <a class="header-anchor" href="#功能" aria-label="Permalink to &quot;功能&quot;">​</a></h2><p>32 位地址</p><ul><li>用于屏蔽 IP 地址的一部分以区别网络标识和主机标识，该 IP 地址是在局域网上还是在远程网（广域网）</li><li>将一个大的 IP 网络划分为若干个小的子网络</li></ul><h3 id="声明网络地址与主机地址" tabindex="-1">声明网络地址与主机地址 <a class="header-anchor" href="#声明网络地址与主机地址" aria-label="Permalink to &quot;声明网络地址与主机地址&quot;">​</a></h3><table><thead><tr><th>类别</th><th>子网掩码的二进制数值</th><th>子网掩码的十进制数值</th></tr></thead><tbody><tr><td>A</td><td>11111111 00000000 00000000 00000000</td><td>255.0.0.0</td></tr><tr><td>B</td><td>11111111 11111111 00000000 00000000</td><td>255.255.0.0</td></tr><tr><td>C</td><td>11111111 11111111 11111111 00000000</td><td>255.255.255.0</td></tr></tbody></table><ul><li>将子网掩码二进制和 IP 地址二进制进行逻辑与（AND）运算，得到的是主机地址</li></ul><div class="language-txt vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">txt</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#e1e4e8;">IP 地址 192.168.10.11 AND 255.255.255.0 ==== 192.168.10.0</span></span>
 <span class="line"><span style="color:#e1e4e8;"></span></span>
 <span class="line"><span style="color:#e1e4e8;">说明：该IP地址属于192.168.10.0这个网络，其主机号为11（网络中编号为11的主机）</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292e;">IP 地址 192.168.10.11 AND 255.255.255.0 ==== 192.168.10.0</span></span>
 <span class="line"><span style="color:#24292e;"></span></span>
-<span class="line"><span style="color:#24292e;">说明：该IP地址属于192.168.10.0这个网络，其主机号为11（网络中编号为11的主机）</span></span></code></pre></div><h3 id="划分子网" tabindex="-1">划分子网 <a class="header-anchor" href="#划分子网" aria-label="Permalink to &quot;划分子网&quot;">​</a></h3><p>减少网络上的通信量；节省 IP 地址；便于管理；解决物理网络本身的某些问题</p><h2 id="变长子网掩码" tabindex="-1">变长子网掩码 <a class="header-anchor" href="#变长子网掩码" aria-label="Permalink to &quot;变长子网掩码&quot;">​</a></h2><p><code>192.168.0.0/24</code> === 24 为网络号 + 8 位主机号</p><p>VLSM（variable-length subnet masks）每段 IP 地址使用不同长度的子网掩码，可以对子网进行层次化编址，以便最有效的利用现有的地址空间</p><h2 id="无类别域间路由" tabindex="-1">无类别域间路由 <a class="header-anchor" href="#无类别域间路由" aria-label="Permalink to &quot;无类别域间路由&quot;">​</a></h2><p><code>基于可变长子网掩码（VLSM）</code>来进行任意长度的前缀的分配</p><p>CIDR（classless inter-domain routing）给用户分配 IP 地址以及在互联网上有效的路由 IP 数据包的对 IP 地址进行归类的方法</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/status_code.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>HTTP 状态码</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/tls_ssl.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>TLS SSL</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292e;">说明：该IP地址属于192.168.10.0这个网络，其主机号为11（网络中编号为11的主机）</span></span></code></pre></div><h3 id="划分子网" tabindex="-1">划分子网 <a class="header-anchor" href="#划分子网" aria-label="Permalink to &quot;划分子网&quot;">​</a></h3><p>减少网络上的通信量；节省 IP 地址；便于管理；解决物理网络本身的某些问题</p><h2 id="变长子网掩码" tabindex="-1">变长子网掩码 <a class="header-anchor" href="#变长子网掩码" aria-label="Permalink to &quot;变长子网掩码&quot;">​</a></h2><p><code>192.168.0.0/24</code> === 24 为网络号 + 8 位主机号</p><p>VLSM（variable-length subnet masks）每段 IP 地址使用不同长度的子网掩码，可以对子网进行层次化编址，以便最有效的利用现有的地址空间</p><h2 id="无类别域间路由" tabindex="-1">无类别域间路由 <a class="header-anchor" href="#无类别域间路由" aria-label="Permalink to &quot;无类别域间路由&quot;">​</a></h2><p><code>基于可变长子网掩码（VLSM）</code>来进行任意长度的前缀的分配</p><p>CIDR（classless inter-domain routing）给用户分配 IP 地址以及在互联网上有效的路由 IP 数据包的对 IP 地址进行归类的方法</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/status_code.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>HTTP 状态码</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/tls_ssl.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>TLS SSL</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/tls_ssl.html b/network/tls_ssl.html
index d59158b..8c78695 100644
--- a/network/tls_ssl.html
+++ b/network/tls_ssl.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>HTTPS 加密层 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_tls_ssl.md.1b14e38d.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_tls_ssl.md.e0605f70.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_tls_ssl" data-v-6b87e69f><div><h1 id="https-加密层" tabindex="-1">HTTPS 加密层 <a class="header-anchor" href="#https-加密层" aria-label="Permalink to &quot;HTTPS 加密层&quot;">​</a></h1><p><a href="https://time.geekbang.org/column/article/156181" target="_blank" rel="noreferrer">参考链接</a></p><p>HTTP - TLS/SSL - TCP - IP - 数据链路层</p><p><code>HTTP 数据传输加密过程</code></p><blockquote><p>加密套件列表</p></blockquote><p>浏览器支持的加密方式有多少种</p><h2 id="对称加密" tabindex="-1">对称加密 <a class="header-anchor" href="#对称加密" aria-label="Permalink to &quot;对称加密&quot;">​</a></h2><ol><li>浏览器发送对称加密套件列表和 client-random 随机数</li><li>服务器收到加密套件列表，选择加密方式和 service-random 随机数，返回给浏览器</li><li>浏览器和服务器返回确认信息</li></ol><h3 id="计算密钥" tabindex="-1">计算密钥 <a class="header-anchor" href="#计算密钥" aria-label="Permalink to &quot;计算密钥&quot;">​</a></h3><blockquote><p>密钥都能用来解密</p></blockquote><ol><li>浏览器和服务器都有 client-random 和 service-random</li><li>浏览器和服务器使用相同的方法对 client-random 和 service-random 混合起来生成密钥 master-secret</li><li>使用 master-secret 加密传输数据</li></ol><h3 id="缺陷" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><blockquote><p>client-random 和 service-random 都是明文的，拿到随机数和加密方式，以及利用随机数的生成密钥的算法都是公开的，也可以生成密钥来解析数据</p></blockquote><h2 id="非对称加密" tabindex="-1">非对称加密 <a class="header-anchor" href="#非对称加密" aria-label="Permalink to &quot;非对称加密&quot;">​</a></h2><blockquote><p>非对称，公钥只有私钥能解密，私钥只有公钥能解密</p></blockquote><ol><li>浏览器发送非对称加密套件列表</li><li>服务收到非对称加密套件列表，返回加密方式和公钥</li><li>浏览器和服务器返回确认信息</li></ol><h3 id="加密数据" tabindex="-1">加密数据 <a class="header-anchor" href="#加密数据" aria-label="Permalink to &quot;加密数据&quot;">​</a></h3><ol><li>浏览器使用公钥加密数据</li><li>私钥只有服务器存在，利用私钥解密数据</li></ol><h3 id="缺陷-1" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷-1" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><ol><li>非对称加密算法效率太慢，影响数据传输速率</li><li>无法保证服务器发送给浏览器的数据安全（公钥是可以被拦截获取的）</li></ol><h2 id="对称加密-非对称加密" tabindex="-1">对称加密 + 非对称加密 <a class="header-anchor" href="#对称加密-非对称加密" aria-label="Permalink to &quot;对称加密 + 非对称加密&quot;">​</a></h2><blockquote><p>HTTPS 采用混合加密方式进行数据的加密</p></blockquote><ol><li>浏览器发送加密套件列表、非对称加密套件列表以及 client-random 随机数</li><li>服务器收到消息，选择加密方式以及生成公钥和 service-random 随机数</li><li>浏览器保存公钥，并生成随机数 pre-master</li><li>使用公钥加密 pre-master 发送给服务器确认 master-secret</li><li>服务器浏览器确认返回信息</li></ol><h3 id="加密数据-1" tabindex="-1">加密数据 <a class="header-anchor" href="#加密数据-1" aria-label="Permalink to &quot;加密数据&quot;">​</a></h3><ol><li>浏览器和服务器都拥有 client-random、service-random 以及 pre-master 三组随机数</li><li>使用三组随机数生成对称密钥，就可以使用对称加密方式传输数据</li></ol><h3 id="安全性" tabindex="-1">安全性 <a class="header-anchor" href="#安全性" aria-label="Permalink to &quot;安全性&quot;">​</a></h3><blockquote><p>获取到 pre-master 随机数，但是是经过公钥加密过的，只有私钥才能解密</p></blockquote><h2 id="ca-证书" tabindex="-1">CA 证书 <a class="header-anchor" href="#ca-证书" aria-label="Permalink to &quot;CA 证书&quot;">​</a></h2><blockquote><p>有了混合加密方式的传输数据仍然不是安全的（DNS 劫持替换 IP 地址）</p></blockquote><h3 id="加密方式" tabindex="-1">加密方式 <a class="header-anchor" href="#加密方式" aria-label="Permalink to &quot;加密方式&quot;">​</a></h3><ol><li>浏览器发送加密套件列表、非对称加密套件列表以及 client-random 随机数</li><li>服务器收到消息，选择加密方式以及返回<code>数字证书</code>和 service-random 随机数</li><li>浏览器获取数字证书中的公钥，并生成随机数 pre-master</li><li>使用公钥加密 pre-master 发送给服务器确认 master-secret</li><li>服务器浏览器确认返回信息</li></ol><h3 id="申请数字证书" tabindex="-1">申请数字证书 <a class="header-anchor" href="#申请数字证书" aria-label="Permalink to &quot;申请数字证书&quot;">​</a></h3><ol><li>准备一套公钥和私钥，私钥留着自己使用</li><li>向 CA 机构提交公钥以及相关信息（收费）</li><li>CA 机构验证信息是否合理合法</li><li>信息审核通过，签发数字证书（公钥、组织信息、CA 的信息、有效时间、证书序列号等明文信息）以及一个 CA 生成的签名</li></ol><h3 id="ca-数字签名" tabindex="-1">CA 数字签名 <a class="header-anchor" href="#ca-数字签名" aria-label="Permalink to &quot;CA 数字签名&quot;">​</a></h3><ol><li>CA 使用 Hash 函数算法计算明文信息，并得出信息摘要</li><li>CA 使用其自有的私钥对信息摘要进行加密，加密后的密文就是数字签名</li></ol><h3 id="验证数字证书" tabindex="-1">验证数字证书 <a class="header-anchor" href="#验证数字证书" aria-label="Permalink to &quot;验证数字证书&quot;">​</a></h3><ol><li>浏览器使用相同的 Hash 算法函数计算明文信息，得到信息摘要 A</li><li>再使用公钥对数字签名解密，得到信息摘要 B</li><li>信息摘要 A === 信息摘要 B</li></ol><blockquote><p>CA 是机构，会沿着 CA 机构链查找，直到根证书机构为止（否则视为不合法）</p></blockquote><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><ol><li>申请数字证书是不需要提供私钥的，私钥永远只能存在于服务器上</li><li>数字证书最核心的内容就是使用其自有的私钥生成的数字签名</li><li>内置 CA 对应的证书称为根证书，最权威的机构（自签名证书）</li></ol><h2 id="数字证书拓展" tabindex="-1">数字证书拓展 <a class="header-anchor" href="#数字证书拓展" aria-label="Permalink to &quot;数字证书拓展&quot;">​</a></h2><p>数字证书</p><blockquote><p>个人申请的证书属于 DV 类型；普通公司申请的证书属于 OV 类型；金融机构、银行、电商平台申请的证书属于 EV 类型（DV 自动验证，OV 和 EV 需要人工验证）</p></blockquote><blockquote><p>CA 机构的权威性，数字证书链，中间 CA(Intermediates CAs)和根 CA(Root CAs)</p></blockquote><blockquote><p>操作系统内置根证书，WebTrust（网络信任） 认证是电子认证服务行业中唯一的国际性认证标准（认证的根 CA 目前有 Comodo，geotrust，rapidssl，symantec，thawte，digicert），只有在操作系统中能追溯到数字证书链才能验证证书合法</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/subnet_mask.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>子网掩码</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/network/webrtc.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>WebRTC</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_tls_ssl" data-v-6b87e69f><div><h1 id="https-加密层" tabindex="-1">HTTPS 加密层 <a class="header-anchor" href="#https-加密层" aria-label="Permalink to &quot;HTTPS 加密层&quot;">​</a></h1><p><a href="https://time.geekbang.org/column/article/156181" target="_blank" rel="noreferrer">参考链接</a></p><p>HTTP - TLS/SSL - TCP - IP - 数据链路层</p><p><code>HTTP 数据传输加密过程</code></p><blockquote><p>加密套件列表</p></blockquote><p>浏览器支持的加密方式有多少种</p><h2 id="对称加密" tabindex="-1">对称加密 <a class="header-anchor" href="#对称加密" aria-label="Permalink to &quot;对称加密&quot;">​</a></h2><ol><li>浏览器发送对称加密套件列表和 client-random 随机数</li><li>服务器收到加密套件列表，选择加密方式和 service-random 随机数，返回给浏览器</li><li>浏览器和服务器返回确认信息</li></ol><h3 id="计算密钥" tabindex="-1">计算密钥 <a class="header-anchor" href="#计算密钥" aria-label="Permalink to &quot;计算密钥&quot;">​</a></h3><blockquote><p>密钥都能用来解密</p></blockquote><ol><li>浏览器和服务器都有 client-random 和 service-random</li><li>浏览器和服务器使用相同的方法对 client-random 和 service-random 混合起来生成密钥 master-secret</li><li>使用 master-secret 加密传输数据</li></ol><h3 id="缺陷" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><blockquote><p>client-random 和 service-random 都是明文的，拿到随机数和加密方式，以及利用随机数的生成密钥的算法都是公开的，也可以生成密钥来解析数据</p></blockquote><h2 id="非对称加密" tabindex="-1">非对称加密 <a class="header-anchor" href="#非对称加密" aria-label="Permalink to &quot;非对称加密&quot;">​</a></h2><blockquote><p>非对称，公钥只有私钥能解密，私钥只有公钥能解密</p></blockquote><ol><li>浏览器发送非对称加密套件列表</li><li>服务收到非对称加密套件列表，返回加密方式和公钥</li><li>浏览器和服务器返回确认信息</li></ol><h3 id="加密数据" tabindex="-1">加密数据 <a class="header-anchor" href="#加密数据" aria-label="Permalink to &quot;加密数据&quot;">​</a></h3><ol><li>浏览器使用公钥加密数据</li><li>私钥只有服务器存在，利用私钥解密数据</li></ol><h3 id="缺陷-1" tabindex="-1">缺陷 <a class="header-anchor" href="#缺陷-1" aria-label="Permalink to &quot;缺陷&quot;">​</a></h3><ol><li>非对称加密算法效率太慢，影响数据传输速率</li><li>无法保证服务器发送给浏览器的数据安全（公钥是可以被拦截获取的）</li></ol><h2 id="对称加密-非对称加密" tabindex="-1">对称加密 + 非对称加密 <a class="header-anchor" href="#对称加密-非对称加密" aria-label="Permalink to &quot;对称加密 + 非对称加密&quot;">​</a></h2><blockquote><p>HTTPS 采用混合加密方式进行数据的加密</p></blockquote><ol><li>浏览器发送加密套件列表、非对称加密套件列表以及 client-random 随机数</li><li>服务器收到消息，选择加密方式以及生成公钥和 service-random 随机数</li><li>浏览器保存公钥，并生成随机数 pre-master</li><li>使用公钥加密 pre-master 发送给服务器确认 master-secret</li><li>服务器浏览器确认返回信息</li></ol><h3 id="加密数据-1" tabindex="-1">加密数据 <a class="header-anchor" href="#加密数据-1" aria-label="Permalink to &quot;加密数据&quot;">​</a></h3><ol><li>浏览器和服务器都拥有 client-random、service-random 以及 pre-master 三组随机数</li><li>使用三组随机数生成对称密钥，就可以使用对称加密方式传输数据</li></ol><h3 id="安全性" tabindex="-1">安全性 <a class="header-anchor" href="#安全性" aria-label="Permalink to &quot;安全性&quot;">​</a></h3><blockquote><p>获取到 pre-master 随机数，但是是经过公钥加密过的，只有私钥才能解密</p></blockquote><h2 id="ca-证书" tabindex="-1">CA 证书 <a class="header-anchor" href="#ca-证书" aria-label="Permalink to &quot;CA 证书&quot;">​</a></h2><blockquote><p>有了混合加密方式的传输数据仍然不是安全的（DNS 劫持替换 IP 地址）</p></blockquote><h3 id="加密方式" tabindex="-1">加密方式 <a class="header-anchor" href="#加密方式" aria-label="Permalink to &quot;加密方式&quot;">​</a></h3><ol><li>浏览器发送加密套件列表、非对称加密套件列表以及 client-random 随机数</li><li>服务器收到消息，选择加密方式以及返回<code>数字证书</code>和 service-random 随机数</li><li>浏览器获取数字证书中的公钥，并生成随机数 pre-master</li><li>使用公钥加密 pre-master 发送给服务器确认 master-secret</li><li>服务器浏览器确认返回信息</li></ol><h3 id="申请数字证书" tabindex="-1">申请数字证书 <a class="header-anchor" href="#申请数字证书" aria-label="Permalink to &quot;申请数字证书&quot;">​</a></h3><ol><li>准备一套公钥和私钥，私钥留着自己使用</li><li>向 CA 机构提交公钥以及相关信息（收费）</li><li>CA 机构验证信息是否合理合法</li><li>信息审核通过，签发数字证书（公钥、组织信息、CA 的信息、有效时间、证书序列号等明文信息）以及一个 CA 生成的签名</li></ol><h3 id="ca-数字签名" tabindex="-1">CA 数字签名 <a class="header-anchor" href="#ca-数字签名" aria-label="Permalink to &quot;CA 数字签名&quot;">​</a></h3><ol><li>CA 使用 Hash 函数算法计算明文信息，并得出信息摘要</li><li>CA 使用其自有的私钥对信息摘要进行加密，加密后的密文就是数字签名</li></ol><h3 id="验证数字证书" tabindex="-1">验证数字证书 <a class="header-anchor" href="#验证数字证书" aria-label="Permalink to &quot;验证数字证书&quot;">​</a></h3><ol><li>浏览器使用相同的 Hash 算法函数计算明文信息，得到信息摘要 A</li><li>再使用公钥对数字签名解密，得到信息摘要 B</li><li>信息摘要 A === 信息摘要 B</li></ol><blockquote><p>CA 是机构，会沿着 CA 机构链查找，直到根证书机构为止（否则视为不合法）</p></blockquote><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><ol><li>申请数字证书是不需要提供私钥的，私钥永远只能存在于服务器上</li><li>数字证书最核心的内容就是使用其自有的私钥生成的数字签名</li><li>内置 CA 对应的证书称为根证书，最权威的机构（自签名证书）</li></ol><h2 id="数字证书拓展" tabindex="-1">数字证书拓展 <a class="header-anchor" href="#数字证书拓展" aria-label="Permalink to &quot;数字证书拓展&quot;">​</a></h2><p>数字证书</p><blockquote><p>个人申请的证书属于 DV 类型；普通公司申请的证书属于 OV 类型；金融机构、银行、电商平台申请的证书属于 EV 类型（DV 自动验证，OV 和 EV 需要人工验证）</p></blockquote><blockquote><p>CA 机构的权威性，数字证书链，中间 CA(Intermediates CAs)和根 CA(Root CAs)</p></blockquote><blockquote><p>操作系统内置根证书，WebTrust（网络信任） 认证是电子认证服务行业中唯一的国际性认证标准（认证的根 CA 目前有 Comodo，geotrust，rapidssl，symantec，thawte，digicert），只有在操作系统中能追溯到数字证书链才能验证证书合法</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/subnet_mask.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>子网掩码</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/network/webrtc.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>WebRTC</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/network/webrtc.html b/network/webrtc.html
index 44522c1..0749aae 100644
--- a/network/webrtc.html
+++ b/network/webrtc.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>WebRTC | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/network_webrtc.md.5adc7068.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/network_webrtc.md.06b0eb25.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_network_webrtc" data-v-6b87e69f><div><h1 id="webrtc" tabindex="-1">WebRTC <a class="header-anchor" href="#webrtc" aria-label="Permalink to &quot;WebRTC&quot;">​</a></h1><p>WebRTC 同时支持传输音视频数据、自定义应用数据</p><ul><li>传输音视频数据相关协议 UDP、DTLS、RTP/SRTCP</li><li>传输自定义应用数据相关协议 UDP、DTLS、SCTP</li></ul><h2 id="udp-dtls" tabindex="-1">UDP DTLS <a class="header-anchor" href="#udp-dtls" aria-label="Permalink to &quot;UDP DTLS&quot;">​</a></h2><p>加密信道建立</p><h2 id="rtp-srtp-rtcp-srtcp" tabindex="-1">RTP/SRTP RTCP/SRTCP <a class="header-anchor" href="#rtp-srtp-rtcp-srtcp" aria-label="Permalink to &quot;RTP/SRTP RTCP/SRTCP&quot;">​</a></h2><p>RTP(Realtime Transport Protocol): 实时传输协议 RTCP(RTP Transport Control Protocol): RTP 传输控制协议</p><h2 id="sctp" tabindex="-1">SCTP <a class="header-anchor" href="#sctp" aria-label="Permalink to &quot;SCTP&quot;">​</a></h2><p>SCTP(Stream Control Transimission Protocol): 流控制传输协议</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/network/tls_ssl.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>TLS SSL</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>认识网络</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>网络相关</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cookie.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cookie</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/cors.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Cors</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/dhcp.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DHCP</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/ip_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>IP 地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/layer.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络分层</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/methods.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 请求方式</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/noun.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>网络名词</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/osi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>OSI 模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/socket.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Socket</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/special_addr.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>特殊地址</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/status_code.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>HTTP 状态码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/subnet_mask.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>子网掩码</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/tls_ssl.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>TLS SSL</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/network/webrtc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>WebRTC</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _network_webrtc" data-v-6b87e69f><div><h1 id="webrtc" tabindex="-1">WebRTC <a class="header-anchor" href="#webrtc" aria-label="Permalink to &quot;WebRTC&quot;">​</a></h1><p>WebRTC 同时支持传输音视频数据、自定义应用数据</p><ul><li>传输音视频数据相关协议 UDP、DTLS、RTP/SRTCP</li><li>传输自定义应用数据相关协议 UDP、DTLS、SCTP</li></ul><h2 id="udp-dtls" tabindex="-1">UDP DTLS <a class="header-anchor" href="#udp-dtls" aria-label="Permalink to &quot;UDP DTLS&quot;">​</a></h2><p>加密信道建立</p><h2 id="rtp-srtp-rtcp-srtcp" tabindex="-1">RTP/SRTP RTCP/SRTCP <a class="header-anchor" href="#rtp-srtp-rtcp-srtcp" aria-label="Permalink to &quot;RTP/SRTP RTCP/SRTCP&quot;">​</a></h2><p>RTP(Realtime Transport Protocol): 实时传输协议 RTCP(RTP Transport Control Protocol): RTP 传输控制协议</p><h2 id="sctp" tabindex="-1">SCTP <a class="header-anchor" href="#sctp" aria-label="Permalink to &quot;SCTP&quot;">​</a></h2><p>SCTP(Stream Control Transimission Protocol): 流控制传输协议</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/network/tls_ssl.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>TLS SSL</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/bfc.html b/notes/css/bfc.html
index 34a4a62..39fc254 100644
--- a/notes/css/bfc.html
+++ b/notes/css/bfc.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>HTML 格式化上下文 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_bfc.md.cf27ad88.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_bfc.md.d9623d35.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_bfc" data-v-6b87e69f><div><h1 id="html-格式化上下文" tabindex="-1">HTML 格式化上下文 <a class="header-anchor" href="#html-格式化上下文" aria-label="Permalink to &quot;HTML 格式化上下文&quot;">​</a></h1><h2 id="bfc" tabindex="-1">BFC <a class="header-anchor" href="#bfc" aria-label="Permalink to &quot;BFC&quot;">​</a></h2><p>BFC - block formatting context 块级格式化上下文</p><div class="tip custom-block"><p class="custom-block-title">BFC 概念</p><p>文档最外层元素使用块布局规则称为初始块格式上下文</p></div><h3 id="css-属性创建-bfc" tabindex="-1">CSS 属性创建 BFC <a class="header-anchor" href="#css-属性创建-bfc" aria-label="Permalink to &quot;CSS 属性创建 BFC&quot;">​</a></h3><p>适用以下的方法可以创建一个新的 BFC</p><ul><li>使用 float 时其浮动的元素</li><li>绝对定位的元素 （position: absolute/fixed/sticky）</li><li>display: inline-block</li><li>表格单元格 display: table-cell，包括使用所有 table-* 属性的所有表格单元格</li><li>块级元素的 overflow 属性不为 visible</li><li>元素属性为 display: flow-root/list-item</li><li>元素属性为 contain: layout/content/strict</li><li>flex items（display: flex 容器布局下的子元素）</li><li>gird 布局（display: grid 容器布局下的子元素）</li><li>multicol containers 多列容器（column-count: 1 或 column-width 不为 auto）</li><li>元素属性 column-span: all</li></ul><blockquote><p>创建新的 BFC 的行为与最外层的文档非常相似，主布局中创造了一个小布局，包含了其内部所有的内容</p></blockquote><blockquote><p>float &amp; clear</p></blockquote><ol><li>float(脱离文档流) 和 clear 仅适用于同一格式上下文中的项目，页边距仅在同一格式上下文中的元素之间折叠</li><li>浮动不会影响其他 BFC 中元素的布局，而清除浮动只能清除同一 BFC 在它前面的元素的浮动</li></ol><h3 id="解决了什么问题" tabindex="-1">解决了什么问题 <a class="header-anchor" href="#解决了什么问题" aria-label="Permalink to &quot;解决了什么问题&quot;">​</a></h3><blockquote><p>高度塌陷问题</p></blockquote><ul><li>子元素设置 float 父容器高度塌陷</li></ul><blockquote><p>外边距重叠问题</p></blockquote><ul><li>创建新的 BFC 避免两个块元素之间的外边距合并问题</li></ul><h2 id="ifc" tabindex="-1">IFC <a class="header-anchor" href="#ifc" aria-label="Permalink to &quot;IFC&quot;">​</a></h2><p>IFC - inline formatting context 行内格式化上下文</p><div class="tip custom-block"><p class="custom-block-title">IFC 概念</p><p>一个块元素内存在内联元素，一次排列；内联格式上下文存在于其他格式上下文中，可以将其视为段落的上下文</p></div><h3 id="说明" tabindex="-1">说明 <a class="header-anchor" href="#说明" aria-label="Permalink to &quot;说明&quot;">​</a></h3><ul><li>行内元素设置水平间距可以适用</li><li>行内元素设置垂直间距不适用（可能会在内容的上方和下方重叠）</li><li>行内格式化上下文填充和边框不会将行框撑开</li></ul><h2 id="flow-layout" tabindex="-1">Flow Layout <a class="header-anchor" href="#flow-layout" aria-label="Permalink to &quot;Flow Layout&quot;">​</a></h2><p>流式布局(正常流)</p><ul><li>CSS2.1 水平写入模式</li></ul><h2 id="writing-mode" tabindex="-1">Writing Mode <a class="header-anchor" href="#writing-mode" aria-label="Permalink to &quot;Writing Mode&quot;">​</a></h2><p>书写模式（书写模式、方向、文本方向属性决定）</p><ul><li>css =&gt; writing-mode: verticla-lr, horizontal-tb, vertical-rl</li></ul><h3 id="说明-1" tabindex="-1">说明 <a class="header-anchor" href="#说明-1" aria-label="Permalink to &quot;说明&quot;">​</a></h3><ul><li>图像不会改变方向</li><li>块元素应用书写模式，改变文字方向，块元素不发生旋转</li></ul><h2 id="外边距重叠" tabindex="-1">外边距重叠 <a class="header-anchor" href="#外边距重叠" aria-label="Permalink to &quot;外边距重叠&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">概念</p><p>块的上外边距和下外边距有时合并（折叠）为单个边距，其大小为单个边距的最大值（如果相等，取其中一个）</p></div><ul><li>有设定 float 和 position:absolute 的元素不产生外边距重叠问题</li></ul><h3 id="情形" tabindex="-1">情形 <a class="header-anchor" href="#情形" aria-label="Permalink to &quot;情形&quot;">​</a></h3><blockquote><p>同一层相邻元素</p></blockquote><p>相邻的两个元素之间的外边距重叠，除非后一个元素加上 clearfix 清除浮动</p><blockquote><p>没有内容将父元素和后代元素分开</p></blockquote><ol><li>父级 margin-top(没有边框、内边距、行内内容、BFC、清除浮动 clearfix)，子元素的 margin-top 会与父元素重叠，并且溢出；</li><li>父级 margin-bottom(没有边框、内边距、行内内容、高度 height min-height max-height)，子元素的 margin-bottom 会与父元素重叠，并且溢出。</li></ol><blockquote><p>空的块级元素</p></blockquote><p>块元素（没有边框、内边距、行内内容、高度 height min-height max-height、inline、clearfix)，margin-top 和 margin-bottom 会发生重叠</p><blockquote><p>外边距为负值</p></blockquote><ol><li>参与折叠的外边距包含负值，折叠后的外边距的最大的正边距与最小的负边距（绝对值最大的负边距）；</li><li>所有参与折叠的元素外边距都为负值，折叠后的外边距的值为最小的负边距的值。</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-07-11T02:35:01.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>CSS 知识</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/box.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>盒模型</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_bfc" data-v-6b87e69f><div><h1 id="html-格式化上下文" tabindex="-1">HTML 格式化上下文 <a class="header-anchor" href="#html-格式化上下文" aria-label="Permalink to &quot;HTML 格式化上下文&quot;">​</a></h1><h2 id="bfc" tabindex="-1">BFC <a class="header-anchor" href="#bfc" aria-label="Permalink to &quot;BFC&quot;">​</a></h2><p>BFC - block formatting context 块级格式化上下文</p><div class="tip custom-block"><p class="custom-block-title">BFC 概念</p><p>文档最外层元素使用块布局规则称为初始块格式上下文</p></div><h3 id="css-属性创建-bfc" tabindex="-1">CSS 属性创建 BFC <a class="header-anchor" href="#css-属性创建-bfc" aria-label="Permalink to &quot;CSS 属性创建 BFC&quot;">​</a></h3><p>适用以下的方法可以创建一个新的 BFC</p><ul><li>使用 float 时其浮动的元素</li><li>绝对定位的元素 （position: absolute/fixed/sticky）</li><li>display: inline-block</li><li>表格单元格 display: table-cell，包括使用所有 table-* 属性的所有表格单元格</li><li>块级元素的 overflow 属性不为 visible</li><li>元素属性为 display: flow-root/list-item</li><li>元素属性为 contain: layout/content/strict</li><li>flex items（display: flex 容器布局下的子元素）</li><li>gird 布局（display: grid 容器布局下的子元素）</li><li>multicol containers 多列容器（column-count: 1 或 column-width 不为 auto）</li><li>元素属性 column-span: all</li></ul><blockquote><p>创建新的 BFC 的行为与最外层的文档非常相似，主布局中创造了一个小布局，包含了其内部所有的内容</p></blockquote><blockquote><p>float &amp; clear</p></blockquote><ol><li>float(脱离文档流) 和 clear 仅适用于同一格式上下文中的项目，页边距仅在同一格式上下文中的元素之间折叠</li><li>浮动不会影响其他 BFC 中元素的布局，而清除浮动只能清除同一 BFC 在它前面的元素的浮动</li></ol><h3 id="解决了什么问题" tabindex="-1">解决了什么问题 <a class="header-anchor" href="#解决了什么问题" aria-label="Permalink to &quot;解决了什么问题&quot;">​</a></h3><blockquote><p>高度塌陷问题</p></blockquote><ul><li>子元素设置 float 父容器高度塌陷</li></ul><blockquote><p>外边距重叠问题</p></blockquote><ul><li>创建新的 BFC 避免两个块元素之间的外边距合并问题</li></ul><h2 id="ifc" tabindex="-1">IFC <a class="header-anchor" href="#ifc" aria-label="Permalink to &quot;IFC&quot;">​</a></h2><p>IFC - inline formatting context 行内格式化上下文</p><div class="tip custom-block"><p class="custom-block-title">IFC 概念</p><p>一个块元素内存在内联元素，一次排列；内联格式上下文存在于其他格式上下文中，可以将其视为段落的上下文</p></div><h3 id="说明" tabindex="-1">说明 <a class="header-anchor" href="#说明" aria-label="Permalink to &quot;说明&quot;">​</a></h3><ul><li>行内元素设置水平间距可以适用</li><li>行内元素设置垂直间距不适用（可能会在内容的上方和下方重叠）</li><li>行内格式化上下文填充和边框不会将行框撑开</li></ul><h2 id="flow-layout" tabindex="-1">Flow Layout <a class="header-anchor" href="#flow-layout" aria-label="Permalink to &quot;Flow Layout&quot;">​</a></h2><p>流式布局(正常流)</p><ul><li>CSS2.1 水平写入模式</li></ul><h2 id="writing-mode" tabindex="-1">Writing Mode <a class="header-anchor" href="#writing-mode" aria-label="Permalink to &quot;Writing Mode&quot;">​</a></h2><p>书写模式（书写模式、方向、文本方向属性决定）</p><ul><li>css =&gt; writing-mode: verticla-lr, horizontal-tb, vertical-rl</li></ul><h3 id="说明-1" tabindex="-1">说明 <a class="header-anchor" href="#说明-1" aria-label="Permalink to &quot;说明&quot;">​</a></h3><ul><li>图像不会改变方向</li><li>块元素应用书写模式，改变文字方向，块元素不发生旋转</li></ul><h2 id="外边距重叠" tabindex="-1">外边距重叠 <a class="header-anchor" href="#外边距重叠" aria-label="Permalink to &quot;外边距重叠&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">概念</p><p>块的上外边距和下外边距有时合并（折叠）为单个边距，其大小为单个边距的最大值（如果相等，取其中一个）</p></div><ul><li>有设定 float 和 position:absolute 的元素不产生外边距重叠问题</li></ul><h3 id="情形" tabindex="-1">情形 <a class="header-anchor" href="#情形" aria-label="Permalink to &quot;情形&quot;">​</a></h3><blockquote><p>同一层相邻元素</p></blockquote><p>相邻的两个元素之间的外边距重叠，除非后一个元素加上 clearfix 清除浮动</p><blockquote><p>没有内容将父元素和后代元素分开</p></blockquote><ol><li>父级 margin-top(没有边框、内边距、行内内容、BFC、清除浮动 clearfix)，子元素的 margin-top 会与父元素重叠，并且溢出；</li><li>父级 margin-bottom(没有边框、内边距、行内内容、高度 height min-height max-height)，子元素的 margin-bottom 会与父元素重叠，并且溢出。</li></ol><blockquote><p>空的块级元素</p></blockquote><p>块元素（没有边框、内边距、行内内容、高度 height min-height max-height、inline、clearfix)，margin-top 和 margin-bottom 会发生重叠</p><blockquote><p>外边距为负值</p></blockquote><ol><li>参与折叠的外边距包含负值，折叠后的外边距的最大的正边距与最小的负边距（绝对值最大的负边距）；</li><li>所有参与折叠的元素外边距都为负值，折叠后的外边距的值为最小的负边距的值。</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-07-11T02:35:01.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>CSS 知识</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/box.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>盒模型</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/box.html b/notes/css/box.html
index 1d25e6c..a392033 100644
--- a/notes/css/box.html
+++ b/notes/css/box.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>盒模型 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_box.md.b41a02c1.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_box.md.b1484cf4.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_box" data-v-6b87e69f><div><h1 id="盒模型" tabindex="-1">盒模型 <a class="header-anchor" href="#盒模型" aria-label="Permalink to &quot;盒模型&quot;">​</a></h1><p>box-model</p><h2 id="基础盒模型" tabindex="-1">基础盒模型 <a class="header-anchor" href="#基础盒模型" aria-label="Permalink to &quot;基础盒模型&quot;">​</a></h2><p>每个盒子由四部分组成：内容边界、内边距边界、边框边界、外边距边界</p><h2 id="与盒模型相关的css属性" tabindex="-1">与盒模型相关的css属性 <a class="header-anchor" href="#与盒模型相关的css属性" aria-label="Permalink to &quot;与盒模型相关的css属性&quot;">​</a></h2><blockquote><p>内容流</p></blockquote><p>overflow overflow-x overflow-y</p><blockquote><p>大小</p></blockquote><p>height min-height max-height width min-width max-width</p><blockquote><p>外边距</p></blockquote><p>margin margin-left marign-right margin-top margin-bottom margin-trim</p><blockquote><p>内边距</p></blockquote><p>padding padding-left padding-right padding-top padding-bottom</p><blockquote><p>其他</p></blockquote><p>visibility</p><h2 id="视觉格式化模型" tabindex="-1">视觉格式化模型 <a class="header-anchor" href="#视觉格式化模型" aria-label="Permalink to &quot;视觉格式化模型&quot;">​</a></h2><p>用来处理在视觉媒体上显示文档时使用的计算规则</p><ul><li><p>块</p></li><li><p>包含块</p></li><li><p>盒子</p></li><li><p>块级元素</p></li><li><p>块级盒子</p></li><li><p>块盒子</p></li><li><p>块容器盒子</p></li><li><p>行内级元素</p></li><li><p>行内级盒子</p></li><li><p>行内盒子</p></li><li><p>原子行内级盒子</p></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/bfc.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>BFC</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/flex.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Flex 扩展</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_box" data-v-6b87e69f><div><h1 id="盒模型" tabindex="-1">盒模型 <a class="header-anchor" href="#盒模型" aria-label="Permalink to &quot;盒模型&quot;">​</a></h1><p>box-model</p><h2 id="基础盒模型" tabindex="-1">基础盒模型 <a class="header-anchor" href="#基础盒模型" aria-label="Permalink to &quot;基础盒模型&quot;">​</a></h2><p>每个盒子由四部分组成：内容边界、内边距边界、边框边界、外边距边界</p><h2 id="与盒模型相关的css属性" tabindex="-1">与盒模型相关的css属性 <a class="header-anchor" href="#与盒模型相关的css属性" aria-label="Permalink to &quot;与盒模型相关的css属性&quot;">​</a></h2><blockquote><p>内容流</p></blockquote><p>overflow overflow-x overflow-y</p><blockquote><p>大小</p></blockquote><p>height min-height max-height width min-width max-width</p><blockquote><p>外边距</p></blockquote><p>margin margin-left marign-right margin-top margin-bottom margin-trim</p><blockquote><p>内边距</p></blockquote><p>padding padding-left padding-right padding-top padding-bottom</p><blockquote><p>其他</p></blockquote><p>visibility</p><h2 id="视觉格式化模型" tabindex="-1">视觉格式化模型 <a class="header-anchor" href="#视觉格式化模型" aria-label="Permalink to &quot;视觉格式化模型&quot;">​</a></h2><p>用来处理在视觉媒体上显示文档时使用的计算规则</p><ul><li><p>块</p></li><li><p>包含块</p></li><li><p>盒子</p></li><li><p>块级元素</p></li><li><p>块级盒子</p></li><li><p>块盒子</p></li><li><p>块容器盒子</p></li><li><p>行内级元素</p></li><li><p>行内级盒子</p></li><li><p>行内盒子</p></li><li><p>原子行内级盒子</p></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/bfc.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>BFC</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/flex.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Flex 扩展</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/flex.html b/notes/css/flex.html
index b977a4e..787e13d 100644
--- a/notes/css/flex.html
+++ b/notes/css/flex.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>flex 扩展 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_flex.md.2119380d.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_flex.md.d5fb90fd.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_flex" data-v-6b87e69f><div><h1 id="flex-扩展" tabindex="-1">flex 扩展 <a class="header-anchor" href="#flex-扩展" aria-label="Permalink to &quot;flex 扩展&quot;">​</a></h1><h2 id="flex-margin" tabindex="-1">flex &amp; margin <a class="header-anchor" href="#flex-margin" aria-label="Permalink to &quot;flex &amp; margin&quot;">​</a></h2><blockquote><p>flex 布局容器下的项目使用 margin 属性，有些情况会得到 flex 布局中项目属性的同等效果</p></blockquote><h3 id="margin-auto" tabindex="-1">margin: auto <a class="header-anchor" href="#margin-auto" aria-label="Permalink to &quot;margin: auto&quot;">​</a></h3><ul><li>块元素在确定宽度元素下，使用 margin:auto 可以实现水平居中，无法实现垂直居中，CSS 规定 margin-top, margin-bottom 默认为 0，margin-left, margin-right 为 auto</li><li>flex 布局容器下的项目属性，margin:auto 可以实现水平垂直居中（flex 布局下的元素 margin-top, margin-bottom, margin-left, margin-right 属性值默认为 auto）</li></ul><h3 id="justify-content-align-items" tabindex="-1">justify-content/align-items <a class="header-anchor" href="#justify-content-align-items" aria-label="Permalink to &quot;justify-content/align-items&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_flex" data-v-6b87e69f><div><h1 id="flex-扩展" tabindex="-1">flex 扩展 <a class="header-anchor" href="#flex-扩展" aria-label="Permalink to &quot;flex 扩展&quot;">​</a></h1><h2 id="flex-margin" tabindex="-1">flex &amp; margin <a class="header-anchor" href="#flex-margin" aria-label="Permalink to &quot;flex &amp; margin&quot;">​</a></h2><blockquote><p>flex 布局容器下的项目使用 margin 属性，有些情况会得到 flex 布局中项目属性的同等效果</p></blockquote><h3 id="margin-auto" tabindex="-1">margin: auto <a class="header-anchor" href="#margin-auto" aria-label="Permalink to &quot;margin: auto&quot;">​</a></h3><ul><li>块元素在确定宽度元素下，使用 margin:auto 可以实现水平居中，无法实现垂直居中，CSS 规定 margin-top, margin-bottom 默认为 0，margin-left, margin-right 为 auto</li><li>flex 布局容器下的项目属性，margin:auto 可以实现水平垂直居中（flex 布局下的元素 margin-top, margin-bottom, margin-left, margin-right 属性值默认为 auto）</li></ul><h3 id="justify-content-align-items" tabindex="-1">justify-content/align-items <a class="header-anchor" href="#justify-content-align-items" aria-label="Permalink to &quot;justify-content/align-items&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;container&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">class</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;item&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#6A737D;">&lt;!-- 水平垂直居中 --&gt;</span></span>
@@ -199,8 +199,8 @@
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#6F42C1;">.footer</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">    </span><span style="color:#005CC5;">margin-top</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">auto</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">  }</span></span>
-<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">style</span><span style="color:#24292E;">&gt;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/box.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>盒模型</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/float.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Float 注意</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">style</span><span style="color:#24292E;">&gt;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/box.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>盒模型</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/float.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Float 注意</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/float.html b/notes/css/float.html
index 31d8176..604fc99 100644
--- a/notes/css/float.html
+++ b/notes/css/float.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>float & clear | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_float.md.88996ca7.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_float.md.74e6557b.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_float" data-v-6b87e69f><div><h1 id="float-clear" tabindex="-1">float &amp; clear <a class="header-anchor" href="#float-clear" aria-label="Permalink to &quot;float &amp; clear&quot;">​</a></h1><p>浮动元素 清除浮动</p><h2 id="float" tabindex="-1">float <a class="header-anchor" href="#float" aria-label="Permalink to &quot;float&quot;">​</a></h2><ul><li>浮动元素表示使用块布局</li><li>文本和行内元素围绕着浮动元素</li></ul><h3 id="float-属性取值" tabindex="-1">float 属性取值 <a class="header-anchor" href="#float-属性取值" aria-label="Permalink to &quot;float 属性取值&quot;">​</a></h3><p>left | right | none | inline-start | inline-end</p><h3 id="是否设置宽度" tabindex="-1">是否设置宽度 <a class="header-anchor" href="#是否设置宽度" aria-label="Permalink to &quot;是否设置宽度&quot;">​</a></h3><blockquote><p>行内元素</p></blockquote><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">&lt;!-- css --&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_float" data-v-6b87e69f><div><h1 id="float-clear" tabindex="-1">float &amp; clear <a class="header-anchor" href="#float-clear" aria-label="Permalink to &quot;float &amp; clear&quot;">​</a></h1><p>浮动元素 清除浮动</p><h2 id="float" tabindex="-1">float <a class="header-anchor" href="#float" aria-label="Permalink to &quot;float&quot;">​</a></h2><ul><li>浮动元素表示使用块布局</li><li>文本和行内元素围绕着浮动元素</li></ul><h3 id="float-属性取值" tabindex="-1">float 属性取值 <a class="header-anchor" href="#float-属性取值" aria-label="Permalink to &quot;float 属性取值&quot;">​</a></h3><p>left | right | none | inline-start | inline-end</p><h3 id="是否设置宽度" tabindex="-1">是否设置宽度 <a class="header-anchor" href="#是否设置宽度" aria-label="Permalink to &quot;是否设置宽度&quot;">​</a></h3><blockquote><p>行内元素</p></blockquote><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">&lt;!-- css --&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">style</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#6A737D;">/* 不设置宽度 */</span></span>
@@ -57,8 +57,8 @@
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">content</span><span style="color:#24292E;">: </span><span style="color:#032F62;">&#39;&#39;</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">display</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">block</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">clear</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">both</span><span style="color:#24292E;">;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h3 id="clear-属性取值" tabindex="-1">clear 属性取值 <a class="header-anchor" href="#clear-属性取值" aria-label="Permalink to &quot;clear 属性取值&quot;">​</a></h3><p>left | right | both | none</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/flex.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Flex 扩展</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/inline.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>行内元素</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h3 id="clear-属性取值" tabindex="-1">clear 属性取值 <a class="header-anchor" href="#clear-属性取值" aria-label="Permalink to &quot;clear 属性取值&quot;">​</a></h3><p>left | right | both | none</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/flex.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Flex 扩展</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/inline.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>行内元素</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/index.html b/notes/css/index.html
index 7f3bea4..f841c1b 100644
--- a/notes/css/index.html
+++ b/notes/css/index.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>css 选择器 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_index.md.9165b88b.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_index.md.97c1211d.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_" data-v-6b87e69f><div><h1 id="css-选择器" tabindex="-1">css 选择器 <a class="header-anchor" href="#css-选择器" aria-label="Permalink to &quot;css 选择器&quot;">​</a></h1><h2 id="元素选择器" tabindex="-1">元素选择器 <a class="header-anchor" href="#元素选择器" aria-label="Permalink to &quot;元素选择器&quot;">​</a></h2><p>div</p><h2 id="id-选择器" tabindex="-1">id 选择器 <a class="header-anchor" href="#id-选择器" aria-label="Permalink to &quot;id 选择器&quot;">​</a></h2><p>#div</p><h2 id="类选择器" tabindex="-1">类选择器 <a class="header-anchor" href="#类选择器" aria-label="Permalink to &quot;类选择器&quot;">​</a></h2><p>.div</p><h2 id="属性选择器" tabindex="-1">属性选择器 <a class="header-anchor" href="#属性选择器" aria-label="Permalink to &quot;属性选择器&quot;">​</a></h2><p>input[type=&quot;text&quot;]</p><h2 id="伪类选择器" tabindex="-1">伪类选择器 <a class="header-anchor" href="#伪类选择器" aria-label="Permalink to &quot;伪类选择器&quot;">​</a></h2><p>伪类 伪元素</p><h2 id="选择器组合" tabindex="-1">选择器组合 <a class="header-anchor" href="#选择器组合" aria-label="Permalink to &quot;选择器组合&quot;">​</a></h2><h3 id="" tabindex="-1">* <a class="header-anchor" href="#" aria-label="Permalink to &quot;\*&quot;">​</a></h3><p>全体选择器</p><h3 id="空格" tabindex="-1">空格 <a class="header-anchor" href="#空格" aria-label="Permalink to &quot;空格&quot;">​</a></h3><p>后代选择器</p><h3 id="-1" tabindex="-1">+ <a class="header-anchor" href="#-1" aria-label="Permalink to &quot;+&quot;">​</a></h3><p>兄弟元素组合选择器</p><h3 id="-2" tabindex="-1">&gt; <a class="header-anchor" href="#-2" aria-label="Permalink to &quot;&gt;&quot;">​</a></h3><p>父元素后第一代子元素选择器</p><h3 id="-3" tabindex="-1">~ <a class="header-anchor" href="#-3" aria-label="Permalink to &quot;~&quot;">​</a></h3><p>兄弟选择器</p><h3 id="-4" tabindex="-1">|| <a class="header-anchor" href="#-4" aria-label="Permalink to &quot;||&quot;">​</a></h3><p>列组合选择器（一般用于表格表示第几列中的元素指定的特殊样式）</p><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#85E89D;">col</span><span style="color:#B392F0;">.selected</span><span style="color:#E1E4E8;">||</span><span style="color:#85E89D;">td</span><span style="color:#E1E4E8;"> {</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_" data-v-6b87e69f><div><h1 id="css-选择器" tabindex="-1">css 选择器 <a class="header-anchor" href="#css-选择器" aria-label="Permalink to &quot;css 选择器&quot;">​</a></h1><h2 id="元素选择器" tabindex="-1">元素选择器 <a class="header-anchor" href="#元素选择器" aria-label="Permalink to &quot;元素选择器&quot;">​</a></h2><p>div</p><h2 id="id-选择器" tabindex="-1">id 选择器 <a class="header-anchor" href="#id-选择器" aria-label="Permalink to &quot;id 选择器&quot;">​</a></h2><p>#div</p><h2 id="类选择器" tabindex="-1">类选择器 <a class="header-anchor" href="#类选择器" aria-label="Permalink to &quot;类选择器&quot;">​</a></h2><p>.div</p><h2 id="属性选择器" tabindex="-1">属性选择器 <a class="header-anchor" href="#属性选择器" aria-label="Permalink to &quot;属性选择器&quot;">​</a></h2><p>input[type=&quot;text&quot;]</p><h2 id="伪类选择器" tabindex="-1">伪类选择器 <a class="header-anchor" href="#伪类选择器" aria-label="Permalink to &quot;伪类选择器&quot;">​</a></h2><p>伪类 伪元素</p><h2 id="选择器组合" tabindex="-1">选择器组合 <a class="header-anchor" href="#选择器组合" aria-label="Permalink to &quot;选择器组合&quot;">​</a></h2><h3 id="" tabindex="-1">* <a class="header-anchor" href="#" aria-label="Permalink to &quot;\*&quot;">​</a></h3><p>全体选择器</p><h3 id="空格" tabindex="-1">空格 <a class="header-anchor" href="#空格" aria-label="Permalink to &quot;空格&quot;">​</a></h3><p>后代选择器</p><h3 id="-1" tabindex="-1">+ <a class="header-anchor" href="#-1" aria-label="Permalink to &quot;+&quot;">​</a></h3><p>兄弟元素组合选择器</p><h3 id="-2" tabindex="-1">&gt; <a class="header-anchor" href="#-2" aria-label="Permalink to &quot;&gt;&quot;">​</a></h3><p>父元素后第一代子元素选择器</p><h3 id="-3" tabindex="-1">~ <a class="header-anchor" href="#-3" aria-label="Permalink to &quot;~&quot;">​</a></h3><p>兄弟选择器</p><h3 id="-4" tabindex="-1">|| <a class="header-anchor" href="#-4" aria-label="Permalink to &quot;||&quot;">​</a></h3><p>列组合选择器（一般用于表格表示第几列中的元素指定的特殊样式）</p><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#85E89D;">col</span><span style="color:#B392F0;">.selected</span><span style="color:#E1E4E8;">||</span><span style="color:#85E89D;">td</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">background-color</span><span style="color:#E1E4E8;">: </span><span style="color:#79B8FF;">#000</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#22863A;">col</span><span style="color:#6F42C1;">.selected</span><span style="color:#24292E;">||</span><span style="color:#22863A;">td</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">background-color</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">#000</span><span style="color:#24292E;">;</span></span>
@@ -41,8 +41,8 @@
 <span class="line"><span style="color:#24292E;">}</span></span>
 <span class="line"><span style="color:#6F42C1;">html</span><span style="color:#24292E;">|</span><span style="color:#22863A;">a</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">font-size</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">40</span><span style="color:#D73A49;">px</span><span style="color:#24292E;">;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h3 id="charset" tabindex="-1">@charset <a class="header-anchor" href="#charset" aria-label="Permalink to &quot;@charset&quot;">​</a></h3><p>字符编码</p><h3 id="import" tabindex="-1">@import <a class="header-anchor" href="#import" aria-label="Permalink to &quot;@import&quot;">​</a></h3><p>用于引入一个 css 文件</p><h3 id="media" tabindex="-1">@media <a class="header-anchor" href="#media" aria-label="Permalink to &quot;@media&quot;">​</a></h3><p>媒体响应式布局</p><h3 id="page" tabindex="-1">@page <a class="header-anchor" href="#page" aria-label="Permalink to &quot;@page&quot;">​</a></h3><p>分页媒体访问网页时的表现设置</p><h3 id="counter-style" tabindex="-1">@counter-style <a class="header-anchor" href="#counter-style" aria-label="Permalink to &quot;@counter-style&quot;">​</a></h3><p>定义列表项的表现</p><h3 id="key-frames" tabindex="-1">@key-frames <a class="header-anchor" href="#key-frames" aria-label="Permalink to &quot;@key-frames&quot;">​</a></h3><p>定义动画帧</p><h3 id="fontface" tabindex="-1">@fontface <a class="header-anchor" href="#fontface" aria-label="Permalink to &quot;@fontface&quot;">​</a></h3><p>定义字体</p><h3 id="support" tabindex="-1">@support <a class="header-anchor" href="#support" aria-label="Permalink to &quot;@support&quot;">​</a></h3><p>与 media 类似</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/html/unusual.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>扩展</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/bfc.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>BFC</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h3 id="charset" tabindex="-1">@charset <a class="header-anchor" href="#charset" aria-label="Permalink to &quot;@charset&quot;">​</a></h3><p>字符编码</p><h3 id="import" tabindex="-1">@import <a class="header-anchor" href="#import" aria-label="Permalink to &quot;@import&quot;">​</a></h3><p>用于引入一个 css 文件</p><h3 id="media" tabindex="-1">@media <a class="header-anchor" href="#media" aria-label="Permalink to &quot;@media&quot;">​</a></h3><p>媒体响应式布局</p><h3 id="page" tabindex="-1">@page <a class="header-anchor" href="#page" aria-label="Permalink to &quot;@page&quot;">​</a></h3><p>分页媒体访问网页时的表现设置</p><h3 id="counter-style" tabindex="-1">@counter-style <a class="header-anchor" href="#counter-style" aria-label="Permalink to &quot;@counter-style&quot;">​</a></h3><p>定义列表项的表现</p><h3 id="key-frames" tabindex="-1">@key-frames <a class="header-anchor" href="#key-frames" aria-label="Permalink to &quot;@key-frames&quot;">​</a></h3><p>定义动画帧</p><h3 id="fontface" tabindex="-1">@fontface <a class="header-anchor" href="#fontface" aria-label="Permalink to &quot;@fontface&quot;">​</a></h3><p>定义字体</p><h3 id="support" tabindex="-1">@support <a class="header-anchor" href="#support" aria-label="Permalink to &quot;@support&quot;">​</a></h3><p>与 media 类似</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/html/unusual.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>扩展</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/bfc.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>BFC</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/inline.html b/notes/css/inline.html
index 0e66ee2..7d6cd06 100644
--- a/notes/css/inline.html
+++ b/notes/css/inline.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>行内元素 css | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_inline.md.ed702657.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_inline.md.5f3b894b.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_inline" data-v-6b87e69f><div><h1 id="行内元素-css" tabindex="-1">行内元素 css <a class="header-anchor" href="#行内元素-css" aria-label="Permalink to &quot;行内元素 css&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">名词</p><p>line box 行框元素</p><p>inline box 行内元素（内联元素）</p></div><h2 id="vertical-align" tabindex="-1">vertical-align <a class="header-anchor" href="#vertical-align" aria-label="Permalink to &quot;vertical-align&quot;">​</a></h2><blockquote><p>适用 inline inline-block table-cell 元素盒子 box</p></blockquote><h2 id="line-height" tabindex="-1">line-height <a class="header-anchor" href="#line-height" aria-label="Permalink to &quot;line-height&quot;">​</a></h2><blockquote><p>适用 行框内文字 块元素中文字（用来设置文字行之间的间距）</p></blockquote><h3 id="取值" tabindex="-1">取值 <a class="header-anchor" href="#取值" aria-label="Permalink to &quot;取值&quot;">​</a></h3><ul><li>normal</li><li>number 相对于文字的 font-size</li><li>percentage 相对于文字的 font-size</li><li>length 行框内的高度 px/em</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/float.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Float 注意</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/pseudo.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>伪元素伪类</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_inline" data-v-6b87e69f><div><h1 id="行内元素-css" tabindex="-1">行内元素 css <a class="header-anchor" href="#行内元素-css" aria-label="Permalink to &quot;行内元素 css&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">名词</p><p>line box 行框元素</p><p>inline box 行内元素（内联元素）</p></div><h2 id="vertical-align" tabindex="-1">vertical-align <a class="header-anchor" href="#vertical-align" aria-label="Permalink to &quot;vertical-align&quot;">​</a></h2><blockquote><p>适用 inline inline-block table-cell 元素盒子 box</p></blockquote><h2 id="line-height" tabindex="-1">line-height <a class="header-anchor" href="#line-height" aria-label="Permalink to &quot;line-height&quot;">​</a></h2><blockquote><p>适用 行框内文字 块元素中文字（用来设置文字行之间的间距）</p></blockquote><h3 id="取值" tabindex="-1">取值 <a class="header-anchor" href="#取值" aria-label="Permalink to &quot;取值&quot;">​</a></h3><ul><li>normal</li><li>number 相对于文字的 font-size</li><li>percentage 相对于文字的 font-size</li><li>length 行框内的高度 px/em</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/float.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Float 注意</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/pseudo.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>伪元素伪类</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/pseudo.html b/notes/css/pseudo.html
index b5ba82d..b5bf77d 100644
--- a/notes/css/pseudo.html
+++ b/notes/css/pseudo.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>伪元素 伪类 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_pseudo.md.65d61dd8.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_pseudo.md.8a522478.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_pseudo" data-v-6b87e69f><div><h1 id="伪元素-伪类" tabindex="-1">伪元素 伪类 <a class="header-anchor" href="#伪元素-伪类" aria-label="Permalink to &quot;伪元素 伪类&quot;">​</a></h1><h2 id="伪元素" tabindex="-1">伪元素 <a class="header-anchor" href="#伪元素" aria-label="Permalink to &quot;伪元素&quot;">​</a></h2><p>伪元素是一个附加至选择器末的关键词，允许对被选择元素的特定部分修改样式</p><div class="warning custom-block"><p class="custom-block-title">注意</p><p>一个选择器中只能使用一个伪元素，伪元素必须跟在普通选择器和基础选择器之后；使用双冒号（::）以便区分伪元素（::）伪类（:）</p></div><h3 id="列举" tabindex="-1">列举 <a class="header-anchor" href="#列举" aria-label="Permalink to &quot;列举&quot;">​</a></h3><ul><li>::after</li><li>::before</li><li>::backdrop</li><li>::first-line</li><li>::first-letter</li><li>::cue</li><li>::grammar-error</li><li>::marker</li><li>::placeholder --- input::placeholder</li><li>::selection</li><li>::slotted()</li><li>::spelling-error</li></ul><h2 id="伪类" tabindex="-1">伪类 <a class="header-anchor" href="#伪类" aria-label="Permalink to &quot;伪类&quot;">​</a></h2><p>伪类是添加到选择器的关键词，指定要选择的元素的特殊状态</p><h3 id="列举-1" tabindex="-1">列举 <a class="header-anchor" href="#列举-1" aria-label="Permalink to &quot;列举&quot;">​</a></h3><table><thead><tr><th>伪类</th><th>伪类</th></tr></thead><tbody><tr><td>:active</td><td>:last-child</td></tr><tr><td>:any-link</td><td>:last-of-type</td></tr><tr><td>:blank</td><td>:left</td></tr><tr><td>:checked</td><td>:link</td></tr><tr><td>:current</td><td>:local-link</td></tr><tr><td>:default</td><td>:not()</td></tr><tr><td>:defined</td><td>:nth-child()</td></tr><tr><td>:dir()</td><td>:nth-col()</td></tr><tr><td>:disabled</td><td>:nth-last-child()</td></tr><tr><td>:drop</td><td>:nth-last-col()</td></tr><tr><td>:empty</td><td>:nth-last-of-type()</td></tr><tr><td>:enabled</td><td>:nth-of-type()</td></tr><tr><td>:first</td><td>:only-child</td></tr><tr><td>:first-child</td><td>:only-of-type</td></tr><tr><td>:first-of-type</td><td>:optional</td></tr><tr><td>:fullscreen</td><td>:out-of-range</td></tr><tr><td>:future</td><td>:past</td></tr><tr><td>:focus</td><td>:placeholder-shown</td></tr><tr><td>:focus-visible</td><td>:read-only</td></tr><tr><td>:focus-within</td><td>:read-write</td></tr><tr><td>:has()</td><td>:required</td></tr><tr><td>:host</td><td>:right</td></tr><tr><td>:host()</td><td>:root</td></tr><tr><td>:host-context()</td><td>:scope</td></tr><tr><td>:hover</td><td>:target</td></tr><tr><td>:indeterminate</td><td>:target-within</td></tr><tr><td>:in-range</td><td>:user-invalid</td></tr><tr><td>:invalid</td><td>:valid</td></tr><tr><td>:is()</td><td>:visited</td></tr><tr><td>:lang()</td><td>:where()</td></tr></tbody></table></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/inline.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>行内元素</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/replaced.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>可替换元素</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_pseudo" data-v-6b87e69f><div><h1 id="伪元素-伪类" tabindex="-1">伪元素 伪类 <a class="header-anchor" href="#伪元素-伪类" aria-label="Permalink to &quot;伪元素 伪类&quot;">​</a></h1><h2 id="伪元素" tabindex="-1">伪元素 <a class="header-anchor" href="#伪元素" aria-label="Permalink to &quot;伪元素&quot;">​</a></h2><p>伪元素是一个附加至选择器末的关键词，允许对被选择元素的特定部分修改样式</p><div class="warning custom-block"><p class="custom-block-title">注意</p><p>一个选择器中只能使用一个伪元素，伪元素必须跟在普通选择器和基础选择器之后；使用双冒号（::）以便区分伪元素（::）伪类（:）</p></div><h3 id="列举" tabindex="-1">列举 <a class="header-anchor" href="#列举" aria-label="Permalink to &quot;列举&quot;">​</a></h3><ul><li>::after</li><li>::before</li><li>::backdrop</li><li>::first-line</li><li>::first-letter</li><li>::cue</li><li>::grammar-error</li><li>::marker</li><li>::placeholder --- input::placeholder</li><li>::selection</li><li>::slotted()</li><li>::spelling-error</li></ul><h2 id="伪类" tabindex="-1">伪类 <a class="header-anchor" href="#伪类" aria-label="Permalink to &quot;伪类&quot;">​</a></h2><p>伪类是添加到选择器的关键词，指定要选择的元素的特殊状态</p><h3 id="列举-1" tabindex="-1">列举 <a class="header-anchor" href="#列举-1" aria-label="Permalink to &quot;列举&quot;">​</a></h3><table><thead><tr><th>伪类</th><th>伪类</th></tr></thead><tbody><tr><td>:active</td><td>:last-child</td></tr><tr><td>:any-link</td><td>:last-of-type</td></tr><tr><td>:blank</td><td>:left</td></tr><tr><td>:checked</td><td>:link</td></tr><tr><td>:current</td><td>:local-link</td></tr><tr><td>:default</td><td>:not()</td></tr><tr><td>:defined</td><td>:nth-child()</td></tr><tr><td>:dir()</td><td>:nth-col()</td></tr><tr><td>:disabled</td><td>:nth-last-child()</td></tr><tr><td>:drop</td><td>:nth-last-col()</td></tr><tr><td>:empty</td><td>:nth-last-of-type()</td></tr><tr><td>:enabled</td><td>:nth-of-type()</td></tr><tr><td>:first</td><td>:only-child</td></tr><tr><td>:first-child</td><td>:only-of-type</td></tr><tr><td>:first-of-type</td><td>:optional</td></tr><tr><td>:fullscreen</td><td>:out-of-range</td></tr><tr><td>:future</td><td>:past</td></tr><tr><td>:focus</td><td>:placeholder-shown</td></tr><tr><td>:focus-visible</td><td>:read-only</td></tr><tr><td>:focus-within</td><td>:read-write</td></tr><tr><td>:has()</td><td>:required</td></tr><tr><td>:host</td><td>:right</td></tr><tr><td>:host()</td><td>:root</td></tr><tr><td>:host-context()</td><td>:scope</td></tr><tr><td>:hover</td><td>:target</td></tr><tr><td>:indeterminate</td><td>:target-within</td></tr><tr><td>:in-range</td><td>:user-invalid</td></tr><tr><td>:invalid</td><td>:valid</td></tr><tr><td>:is()</td><td>:visited</td></tr><tr><td>:lang()</td><td>:where()</td></tr></tbody></table></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/inline.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>行内元素</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/replaced.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>可替换元素</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/replaced.html b/notes/css/replaced.html
index 94acc1f..d3cb63e 100644
--- a/notes/css/replaced.html
+++ b/notes/css/replaced.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>可替换元素 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_replaced.md.ceaac847.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_replaced.md.3cd3cdf4.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_replaced" data-v-6b87e69f><div><h1 id="可替换元素" tabindex="-1">可替换元素 <a class="header-anchor" href="#可替换元素" aria-label="Permalink to &quot;可替换元素&quot;">​</a></h1><p>replaced element / none-replaced element</p><h2 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h2><ul><li>在 CSS 中，替换元素是表示形式超出 CSS 范围的元素，他们是外部对象，独立于 CSS 格式模型</li><li>CSS 可影响可替换元素的位置，不会影响到可替换元素自身的内容</li><li>某些替换元素具有固有尺寸或定义的基线，只有可替换的元素才能具有固有尺寸</li></ul><h2 id="替换元素" tabindex="-1">替换元素 <a class="header-anchor" href="#替换元素" aria-label="Permalink to &quot;替换元素&quot;">​</a></h2><ul><li>iframe</li><li>video</li><li>embed</li><li>img</li></ul><p>某些特殊情况下，以下元素也可以是替换元素</p><ul><li>opiton</li><li>audio</li><li>canvas</li><li>object</li><li>applet</li><li>input type=image</li></ul><h2 id="content-属性" tabindex="-1">content 属性 <a class="header-anchor" href="#content-属性" aria-label="Permalink to &quot;content 属性&quot;">​</a></h2><blockquote><p>content 属性应用在元素的 ::before 和 ::after 伪元素中插入内容</p></blockquote><h3 id="取值" tabindex="-1">取值 <a class="header-anchor" href="#取值" aria-label="Permalink to &quot;取值&quot;">​</a></h3><ul><li>normal 默认值</li><li>none 不产生伪类元素</li><li>string 文本内容</li><li>url</li><li>counter/counters 计数/嵌套计数</li><li>attr 显示元素属性内容</li><li>open-quote close-quote 增加去除引号</li><li>no-open-quote no-close-quote 不产生任何内容（会改变引号层级）</li></ul><h3 id="counter-counters" tabindex="-1">counter/counters <a class="header-anchor" href="#counter-counters" aria-label="Permalink to &quot;counter/counters&quot;">​</a></h3><blockquote><p>嵌套计数器，返回表示指定计数器当前值的拼接字符串</p></blockquote><ul><li>两种形式 <ul><li>counters(name, string)</li><li>counters(name, string, style)</li></ul></li><li>通常与伪元素搭配使用 content 属性，理论上支持属性值为 string 的任何地方</li><li>生成的文本是具有给定名称的所有计数器的值，从最外层到最内层，之间由指定字符串分隔</li><li>style 默认为十进制（upper-roman, lower-roman, decimal-leading-zero, lower-alpha)</li></ul><h2 id="list-style-属性" tabindex="-1">list-style 属性 <a class="header-anchor" href="#list-style-属性" aria-label="Permalink to &quot;list-style 属性&quot;">​</a></h2><blockquote><p>symbols 函数</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/pseudo.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>伪元素伪类</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/text-character.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>文字特性</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_replaced" data-v-6b87e69f><div><h1 id="可替换元素" tabindex="-1">可替换元素 <a class="header-anchor" href="#可替换元素" aria-label="Permalink to &quot;可替换元素&quot;">​</a></h1><p>replaced element / none-replaced element</p><h2 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h2><ul><li>在 CSS 中，替换元素是表示形式超出 CSS 范围的元素，他们是外部对象，独立于 CSS 格式模型</li><li>CSS 可影响可替换元素的位置，不会影响到可替换元素自身的内容</li><li>某些替换元素具有固有尺寸或定义的基线，只有可替换的元素才能具有固有尺寸</li></ul><h2 id="替换元素" tabindex="-1">替换元素 <a class="header-anchor" href="#替换元素" aria-label="Permalink to &quot;替换元素&quot;">​</a></h2><ul><li>iframe</li><li>video</li><li>embed</li><li>img</li></ul><p>某些特殊情况下，以下元素也可以是替换元素</p><ul><li>opiton</li><li>audio</li><li>canvas</li><li>object</li><li>applet</li><li>input type=image</li></ul><h2 id="content-属性" tabindex="-1">content 属性 <a class="header-anchor" href="#content-属性" aria-label="Permalink to &quot;content 属性&quot;">​</a></h2><blockquote><p>content 属性应用在元素的 ::before 和 ::after 伪元素中插入内容</p></blockquote><h3 id="取值" tabindex="-1">取值 <a class="header-anchor" href="#取值" aria-label="Permalink to &quot;取值&quot;">​</a></h3><ul><li>normal 默认值</li><li>none 不产生伪类元素</li><li>string 文本内容</li><li>url</li><li>counter/counters 计数/嵌套计数</li><li>attr 显示元素属性内容</li><li>open-quote close-quote 增加去除引号</li><li>no-open-quote no-close-quote 不产生任何内容（会改变引号层级）</li></ul><h3 id="counter-counters" tabindex="-1">counter/counters <a class="header-anchor" href="#counter-counters" aria-label="Permalink to &quot;counter/counters&quot;">​</a></h3><blockquote><p>嵌套计数器，返回表示指定计数器当前值的拼接字符串</p></blockquote><ul><li>两种形式 <ul><li>counters(name, string)</li><li>counters(name, string, style)</li></ul></li><li>通常与伪元素搭配使用 content 属性，理论上支持属性值为 string 的任何地方</li><li>生成的文本是具有给定名称的所有计数器的值，从最外层到最内层，之间由指定字符串分隔</li><li>style 默认为十进制（upper-roman, lower-roman, decimal-leading-zero, lower-alpha)</li></ul><h2 id="list-style-属性" tabindex="-1">list-style 属性 <a class="header-anchor" href="#list-style-属性" aria-label="Permalink to &quot;list-style 属性&quot;">​</a></h2><blockquote><p>symbols 函数</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/pseudo.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>伪元素伪类</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/text-character.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>文字特性</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/text-character.html b/notes/css/text-character.html
index 889ef4c..17d88e2 100644
--- a/notes/css/text-character.html
+++ b/notes/css/text-character.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>文字特性 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_text-character.md.ab74a92c.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_text-character.md.567549b3.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_text-character" data-v-6b87e69f><div><h1 id="文字特性" tabindex="-1">文字特性 <a class="header-anchor" href="#文字特性" aria-label="Permalink to &quot;文字特性&quot;">​</a></h1><p><strong>文字特性的 html 标签元素：a, li, img, span, ~~~</strong></p><div class="tip custom-block"><p class="custom-block-title">扩展</p><p>html 标签设置成 display: inline-block; 元素存在间隙</p><ol><li>display: inline; 行内元素，设置高度无效；</li><li>display: block; 块级元素，设置高度有效；</li><li>display: inline-block; 行内块级元素，设置高度有效</li></ol></div><h2 id="例子" tabindex="-1">例子 <a class="header-anchor" href="#例子" aria-label="Permalink to &quot;例子&quot;">​</a></h2><ul class="tc-ul"><li class="tc-item">1</li><li class="tc-item">2</li><li class="tc-item">3</li></ul><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">ul</span><span style="color:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_text-character" data-v-6b87e69f><div><h1 id="文字特性" tabindex="-1">文字特性 <a class="header-anchor" href="#文字特性" aria-label="Permalink to &quot;文字特性&quot;">​</a></h1><p><strong>文字特性的 html 标签元素：a, li, img, span, ~~~</strong></p><div class="tip custom-block"><p class="custom-block-title">扩展</p><p>html 标签设置成 display: inline-block; 元素存在间隙</p><ol><li>display: inline; 行内元素，设置高度无效；</li><li>display: block; 块级元素，设置高度有效；</li><li>display: inline-block; 行内块级元素，设置高度有效</li></ol></div><h2 id="例子" tabindex="-1">例子 <a class="header-anchor" href="#例子" aria-label="Permalink to &quot;例子&quot;">​</a></h2><ul class="tc-ul"><li class="tc-item">1</li><li class="tc-item">2</li><li class="tc-item">3</li></ul><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">ul</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;1&lt;/</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;2&lt;/</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;3&lt;/</span><span style="color:#85E89D;">li</span><span style="color:#E1E4E8;">&gt;</span></span>
@@ -137,8 +137,8 @@
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">display</span><span style="color:#E1E4E8;">: </span><span style="color:#79B8FF;">flex</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#22863A;">ul</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">display</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">flex</span><span style="color:#24292E;">;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><p>END</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/replaced.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>可替换元素</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/visibility.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Visibility 属性</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><p>END</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/replaced.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>可替换元素</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/visibility.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Visibility 属性</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/css/visibility.html b/notes/css/visibility.html
index 9e9676f..f3c32c3 100644
--- a/notes/css/visibility.html
+++ b/notes/css/visibility.html
@@ -5,26 +5,26 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>visibility | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_css_visibility.md.4ed2886f.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_css_visibility.md.36af78c5.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_css_visibility" data-v-6b87e69f><div><h1 id="visibility" tabindex="-1">visibility <a class="header-anchor" href="#visibility" aria-label="Permalink to &quot;visibility&quot;">​</a></h1><p>css 中控制显示隐藏的属性</p><h2 id="display" tabindex="-1">display <a class="header-anchor" href="#display" aria-label="Permalink to &quot;display&quot;">​</a></h2><ul><li>none/block</li></ul><ul><li>控制元素的显隐，破坏渲染状态（代价比较高）；none 独立文档之外，不占空间大小</li></ul><h2 id="visibility-1" tabindex="-1">visibility <a class="header-anchor" href="#visibility-1" aria-label="Permalink to &quot;visibility&quot;">​</a></h2><ul><li>visible/hidden</li></ul><ul><li>隐藏元素并保持自身的渲染状态，dom 事件依然可行，空间大小依然占据（物理上显示空白）</li></ul><h2 id="content-visibility" tabindex="-1">content-visibility <a class="header-anchor" href="#content-visibility" aria-label="Permalink to &quot;content-visibility&quot;">​</a></h2><p>chrome85+ 兼容</p><ul><li>visible/hidden/auto</li></ul><ul><li>跳过屏幕之外的元素，不渲染以达到首次加载渲染速度</li><li>隐藏元素并保持自身的渲染状态，dom 操作、空间大小随着元素的显隐（显示即可操作，隐藏不可操作）</li></ul><ul><li>contain-intrinsic-size 包含固有的大小（当隐藏时仍然保有设置的大小的空间，元素空间显示为空）</li></ul><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">.container</span><span style="color:#E1E4E8;"> {</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_css_visibility" data-v-6b87e69f><div><h1 id="visibility" tabindex="-1">visibility <a class="header-anchor" href="#visibility" aria-label="Permalink to &quot;visibility&quot;">​</a></h1><p>css 中控制显示隐藏的属性</p><h2 id="display" tabindex="-1">display <a class="header-anchor" href="#display" aria-label="Permalink to &quot;display&quot;">​</a></h2><ul><li>none/block</li></ul><ul><li>控制元素的显隐，破坏渲染状态（代价比较高）；none 独立文档之外，不占空间大小</li></ul><h2 id="visibility-1" tabindex="-1">visibility <a class="header-anchor" href="#visibility-1" aria-label="Permalink to &quot;visibility&quot;">​</a></h2><ul><li>visible/hidden</li></ul><ul><li>隐藏元素并保持自身的渲染状态，dom 事件依然可行，空间大小依然占据（物理上显示空白）</li></ul><h2 id="content-visibility" tabindex="-1">content-visibility <a class="header-anchor" href="#content-visibility" aria-label="Permalink to &quot;content-visibility&quot;">​</a></h2><p>chrome85+ 兼容</p><ul><li>visible/hidden/auto</li></ul><ul><li>跳过屏幕之外的元素，不渲染以达到首次加载渲染速度</li><li>隐藏元素并保持自身的渲染状态，dom 操作、空间大小随着元素的显隐（显示即可操作，隐藏不可操作）</li></ul><ul><li>contain-intrinsic-size 包含固有的大小（当隐藏时仍然保有设置的大小的空间，元素空间显示为空）</li></ul><div class="language-css vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">css</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#B392F0;">.container</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">content-visibility</span><span style="color:#E1E4E8;">: </span><span style="color:#79B8FF;">auto</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">contain-intrinsic-size</span><span style="color:#E1E4E8;">: </span><span style="color:#79B8FF;">0</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">100</span><span style="color:#F97583;">px</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6F42C1;">.container</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">content-visibility</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">auto</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">contain-intrinsic-size</span><span style="color:#24292E;">: </span><span style="color:#005CC5;">0</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">100</span><span style="color:#D73A49;">px</span><span style="color:#24292E;">;</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h2 id="contain" tabindex="-1">contain <a class="header-anchor" href="#contain" aria-label="Permalink to &quot;contain&quot;">​</a></h2><p>Chrome 52+ Opera 40+ 兼容</p><ul><li>允许限制元素的渲染范围</li></ul><h3 id="size" tabindex="-1">size <a class="header-anchor" href="#size" aria-label="Permalink to &quot;size&quot;">​</a></h3><ul><li>元素的子元素不会影响父元素的大小，推断和设置的尺寸是使用的尺寸（性能优化不是太多）</li></ul><h3 id="layout" tabindex="-1">layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;layout&quot;">​</a></h3><ul><li>包含元素相对于布局来说是完全透明的，任何外部都不能影响内部布局</li><li>更改元素的布局，可能要检查整个DOM的元素，使用 contain: layout 可以减少检查元素的个数，达到优化效果</li></ul><h3 id="style" tabindex="-1">style <a class="header-anchor" href="#style" aria-label="Permalink to &quot;style&quot;">​</a></h3><ul><li>样式更改不会传播回包含元素（e.g. css counters 计数器的使用）</li></ul><h3 id="paint" tabindex="-1">paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;paint&quot;">​</a></h3><ul><li>包含元素的后代不会显示在其边界之外</li></ul><blockquote><p>effects</p></blockquote><ol><li>充当绝对定位和固定位置元素的包含块（任何子元素都基于元素定位）</li><li>形成堆叠上下文（z-index 对元素产生了影响，子元素将根据新的上下文堆叠）</li><li>形成一个新的格式化上下文</li></ol><h3 id="组合使用" tabindex="-1">组合使用 <a class="header-anchor" href="#组合使用" aria-label="Permalink to &quot;组合使用&quot;">​</a></h3><p>contain: strict ==== contain: size layout paint</p><ul><li>提前知道元素的尺寸，可以使用严格模式</li></ul><p>contain: content ==== contain: layout paint</p><ul><li>content 默认行为</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/text-character.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>文字特性</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>事件监听</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h2 id="contain" tabindex="-1">contain <a class="header-anchor" href="#contain" aria-label="Permalink to &quot;contain&quot;">​</a></h2><p>Chrome 52+ Opera 40+ 兼容</p><ul><li>允许限制元素的渲染范围</li></ul><h3 id="size" tabindex="-1">size <a class="header-anchor" href="#size" aria-label="Permalink to &quot;size&quot;">​</a></h3><ul><li>元素的子元素不会影响父元素的大小，推断和设置的尺寸是使用的尺寸（性能优化不是太多）</li></ul><h3 id="layout" tabindex="-1">layout <a class="header-anchor" href="#layout" aria-label="Permalink to &quot;layout&quot;">​</a></h3><ul><li>包含元素相对于布局来说是完全透明的，任何外部都不能影响内部布局</li><li>更改元素的布局，可能要检查整个DOM的元素，使用 contain: layout 可以减少检查元素的个数，达到优化效果</li></ul><h3 id="style" tabindex="-1">style <a class="header-anchor" href="#style" aria-label="Permalink to &quot;style&quot;">​</a></h3><ul><li>样式更改不会传播回包含元素（e.g. css counters 计数器的使用）</li></ul><h3 id="paint" tabindex="-1">paint <a class="header-anchor" href="#paint" aria-label="Permalink to &quot;paint&quot;">​</a></h3><ul><li>包含元素的后代不会显示在其边界之外</li></ul><blockquote><p>effects</p></blockquote><ol><li>充当绝对定位和固定位置元素的包含块（任何子元素都基于元素定位）</li><li>形成堆叠上下文（z-index 对元素产生了影响，子元素将根据新的上下文堆叠）</li><li>形成一个新的格式化上下文</li></ol><h3 id="组合使用" tabindex="-1">组合使用 <a class="header-anchor" href="#组合使用" aria-label="Permalink to &quot;组合使用&quot;">​</a></h3><p>contain: strict ==== contain: size layout paint</p><ul><li>提前知道元素的尺寸，可以使用严格模式</li></ul><p>contain: content ==== contain: layout paint</p><ul><li>content 默认行为</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/text-character.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>文字特性</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/addEventListener.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>事件监听</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/es/es6.html b/notes/es/es6.html
index 3412551..0e5c7d2 100644
--- a/notes/es/es6.html
+++ b/notes/es/es6.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>ES6 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_es_es6.md.cb465ca1.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_es_es6.md.c70b9687.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_es_es6" data-v-6b87e69f><div><h1 id="es6" tabindex="-1">ES6 <a class="header-anchor" href="#es6" aria-label="Permalink to &quot;ES6&quot;">​</a></h1><div class="warning custom-block"><p class="custom-block-title">注意</p><p>记录一些之前没有注意的地方</p></div><h2 id="let-const" tabindex="-1">let &amp; const <a class="header-anchor" href="#let-const" aria-label="Permalink to &quot;let &amp; const&quot;">​</a></h2><p><strong>1. 暂时行死区</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">typeof</span><span style="color:#E1E4E8;"> x;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_es_es6" data-v-6b87e69f><div><h1 id="es6" tabindex="-1">ES6 <a class="header-anchor" href="#es6" aria-label="Permalink to &quot;ES6&quot;">​</a></h1><div class="warning custom-block"><p class="custom-block-title">注意</p><p>记录一些之前没有注意的地方</p></div><h2 id="let-const" tabindex="-1">let &amp; const <a class="header-anchor" href="#let-const" aria-label="Permalink to &quot;let &amp; const&quot;">​</a></h2><p><strong>1. 暂时行死区</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">typeof</span><span style="color:#E1E4E8;"> x;</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> x;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">typeof</span><span style="color:#24292E;"> x;</span></span>
 <span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> x;</span></span></code></pre></div><h2 id="解构赋值" tabindex="-1">解构赋值 <a class="header-anchor" href="#解构赋值" aria-label="Permalink to &quot;解构赋值&quot;">​</a></h2><p><strong>1. 数组结构赋值</strong></p><p><code>如果等号左边不是可遍历对象，报错！需要Iterator对象</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 报错</span></span>
 <span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> [foo] </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">1</span><span style="color:#E1E4E8;">, flase, NaN, undefined, null, {};</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// 报错</span></span>
@@ -261,8 +261,8 @@
 <span class="line"><span style="color:#6A737D;">// b.js</span></span>
 <span class="line"><span style="color:#D73A49;">import</span><span style="color:#24292E;"> a </span><span style="color:#D73A49;">from</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;./a.js&#39;</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// es6 导出的对象 {a: 1, b: 2, c: 3}</span></span>
-<span class="line"><span style="color:#6A737D;">// 存在默认default导出时 对象格式 {a: 1, b: 2, c: 3, default: 1}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/regexp/unknown.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>扩展</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/nodejs/ansi.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ANSI</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6A737D;">// 存在默认default导出时 对象格式 {a: 1, b: 2, c: 3, default: 1}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/regexp/unknown.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>扩展</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/nodejs/ansi.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ANSI</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/html/esmodule.html b/notes/html/esmodule.html
index b6c0b91..0623dd5 100644
--- a/notes/html/esmodule.html
+++ b/notes/html/esmodule.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>浏览器[type="module"] | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_html_esmodule.md.ddda8566.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_html_esmodule.md.8d06acba.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_html_esmodule" data-v-6b87e69f><div><h1 id="浏览器-type-module" tabindex="-1">浏览器[type=&quot;module&quot;] <a class="header-anchor" href="#浏览器-type-module" aria-label="Permalink to &quot;浏览器[type=&quot;module&quot;]&quot;">​</a></h1><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><ul><li>Safari 10.1.</li><li>Chrome 61.</li><li>Firefox 60.</li><li>Edge 16.</li></ul><h2 id="基本使用" tabindex="-1">基本使用 <a class="header-anchor" href="#基本使用" aria-label="Permalink to &quot;基本使用&quot;">​</a></h2><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">type</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;module&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_html_esmodule" data-v-6b87e69f><div><h1 id="浏览器-type-module" tabindex="-1">浏览器[type=&quot;module&quot;] <a class="header-anchor" href="#浏览器-type-module" aria-label="Permalink to &quot;浏览器[type=&quot;module&quot;]&quot;">​</a></h1><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><ul><li>Safari 10.1.</li><li>Chrome 61.</li><li>Firefox 60.</li><li>Edge 16.</li></ul><h2 id="基本使用" tabindex="-1">基本使用 <a class="header-anchor" href="#基本使用" aria-label="Permalink to &quot;基本使用&quot;">​</a></h2><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">type</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;module&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> { sayHello } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./utils.mjs&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">sayHello</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;Let us do it!&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">script</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">script</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">type</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;module&quot;</span><span style="color:#24292E;">&gt;</span></span>
@@ -141,8 +141,8 @@
 <span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">script</span><span style="color:#24292E;">&gt;</span></span>
 <span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">script</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">type</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;module&quot;</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">src</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;hello.mjs&quot;</span><span style="color:#24292E;">&gt;&lt;/</span><span style="color:#22863A;">script</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// hello.mjs</span></span>
 <span class="line"><span style="color:#B392F0;">sayHello</span><span style="color:#E1E4E8;">(); </span><span style="color:#6A737D;">// hello</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// hello.mjs</span></span>
-<span class="line"><span style="color:#6F42C1;">sayHello</span><span style="color:#24292E;">(); </span><span style="color:#6A737D;">// hello</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/html/seo.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>SEO</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/html/unusual.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>扩展</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6F42C1;">sayHello</span><span style="color:#24292E;">(); </span><span style="color:#6A737D;">// hello</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/html/seo.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>SEO</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/html/unusual.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>扩展</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/html/seo.html b/notes/html/seo.html
index 7933e63..7597833 100644
--- a/notes/html/seo.html
+++ b/notes/html/seo.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>SEO语义化 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_html_seo.md.15c47690.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_html_seo.md.17a408c9.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_html_seo" data-v-6b87e69f><div><h1 id="seo语义化" tabindex="-1">SEO语义化 <a class="header-anchor" href="#seo语义化" aria-label="Permalink to &quot;SEO语义化&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">HTML语义</p><p>HTML语义化标签你知道多少</p><p>开发中正确使用SEO优化</p></div><h2 id="aside" tabindex="-1">aside <a class="header-anchor" href="#aside" aria-label="Permalink to &quot;aside&quot;">​</a></h2><p>左侧侧边栏</p><h2 id="article" tabindex="-1">article <a class="header-anchor" href="#article" aria-label="Permalink to &quot;article&quot;">​</a></h2><p>文章</p><h2 id="hgroup-h1-h2" tabindex="-1">hgroup h1 h2 <a class="header-anchor" href="#hgroup-h1-h2" aria-label="Permalink to &quot;hgroup h1 h2&quot;">​</a></h2><p>hgroup 是标题组 h1 ~ h6 分别为一级标题 二级标题 ...</p><h2 id="abbr" tabindex="-1">abbr <a class="header-anchor" href="#abbr" aria-label="Permalink to &quot;abbr&quot;">​</a></h2><p>缩写</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">abbr</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">title</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;World Wide Web&quot;</span><span style="color:#E1E4E8;">&gt;WWW&lt;/</span><span style="color:#85E89D;">abbr</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">abbr</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">title</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;World Wide Web&quot;</span><span style="color:#24292E;">&gt;WWW&lt;/</span><span style="color:#22863A;">abbr</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h2 id="hr" tabindex="-1">hr <a class="header-anchor" href="#hr" aria-label="Permalink to &quot;hr&quot;">​</a></h2><p>下划线</p><h2 id="p" tabindex="-1">p <a class="header-anchor" href="#p" aria-label="Permalink to &quot;p&quot;">​</a></h2><p>段落标签</p><h2 id="strong" tabindex="-1">strong <a class="header-anchor" href="#strong" aria-label="Permalink to &quot;strong&quot;">​</a></h2><p>强调</p><h2 id="blockquote-q-cite" tabindex="-1">blockquote q cite <a class="header-anchor" href="#blockquote-q-cite" aria-label="Permalink to &quot;blockquote q cite&quot;">​</a></h2><p>引用</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">blockquote</span><span style="color:#E1E4E8;">&gt;What Apple?（段落引述内容）&lt;/</span><span style="color:#85E89D;">blockquote</span><span style="color:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_html_seo" data-v-6b87e69f><div><h1 id="seo语义化" tabindex="-1">SEO语义化 <a class="header-anchor" href="#seo语义化" aria-label="Permalink to &quot;SEO语义化&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">HTML语义</p><p>HTML语义化标签你知道多少</p><p>开发中正确使用SEO优化</p></div><h2 id="aside" tabindex="-1">aside <a class="header-anchor" href="#aside" aria-label="Permalink to &quot;aside&quot;">​</a></h2><p>左侧侧边栏</p><h2 id="article" tabindex="-1">article <a class="header-anchor" href="#article" aria-label="Permalink to &quot;article&quot;">​</a></h2><p>文章</p><h2 id="hgroup-h1-h2" tabindex="-1">hgroup h1 h2 <a class="header-anchor" href="#hgroup-h1-h2" aria-label="Permalink to &quot;hgroup h1 h2&quot;">​</a></h2><p>hgroup 是标题组 h1 ~ h6 分别为一级标题 二级标题 ...</p><h2 id="abbr" tabindex="-1">abbr <a class="header-anchor" href="#abbr" aria-label="Permalink to &quot;abbr&quot;">​</a></h2><p>缩写</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">abbr</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">title</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;World Wide Web&quot;</span><span style="color:#E1E4E8;">&gt;WWW&lt;/</span><span style="color:#85E89D;">abbr</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">abbr</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">title</span><span style="color:#24292E;">=</span><span style="color:#032F62;">&quot;World Wide Web&quot;</span><span style="color:#24292E;">&gt;WWW&lt;/</span><span style="color:#22863A;">abbr</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><h2 id="hr" tabindex="-1">hr <a class="header-anchor" href="#hr" aria-label="Permalink to &quot;hr&quot;">​</a></h2><p>下划线</p><h2 id="p" tabindex="-1">p <a class="header-anchor" href="#p" aria-label="Permalink to &quot;p&quot;">​</a></h2><p>段落标签</p><h2 id="strong" tabindex="-1">strong <a class="header-anchor" href="#strong" aria-label="Permalink to &quot;strong&quot;">​</a></h2><p>强调</p><h2 id="blockquote-q-cite" tabindex="-1">blockquote q cite <a class="header-anchor" href="#blockquote-q-cite" aria-label="Permalink to &quot;blockquote q cite&quot;">​</a></h2><p>引用</p><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">blockquote</span><span style="color:#E1E4E8;">&gt;What Apple?（段落引述内容）&lt;/</span><span style="color:#85E89D;">blockquote</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">q</span><span style="color:#E1E4E8;">&gt;What Apple?（行内引述内容）&lt;/</span><span style="color:#85E89D;">q</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">cite</span><span style="color:#E1E4E8;">&gt;What Apple?（引述作品名）&lt;/</span><span style="color:#85E89D;">cite</span><span style="color:#E1E4E8;">&gt;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">blockquote</span><span style="color:#24292E;">&gt;What Apple?（段落引述内容）&lt;/</span><span style="color:#22863A;">blockquote</span><span style="color:#24292E;">&gt;</span></span>
 <span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">q</span><span style="color:#24292E;">&gt;What Apple?（行内引述内容）&lt;/</span><span style="color:#22863A;">q</span><span style="color:#24292E;">&gt;</span></span>
@@ -38,8 +38,8 @@
 <span class="line"><span style="color:#24292E;">&lt;</span><span style="color:#22863A;">code</span><span style="color:#24292E;">&gt;转义标签</span><span style="color:#005CC5;">&amp;lt;</span><span style="color:#24292E;">span</span><span style="color:#005CC5;">&amp;gt;</span><span style="color:#24292E;">hello world</span><span style="color:#005CC5;">&amp;lt;</span><span style="color:#24292E;">/span</span><span style="color:#005CC5;">&amp;gt;</span><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">code</span><span style="color:#24292E;">&gt;</span></span></code></pre></div><p>=&gt;</p><pre>hello world</pre><pre><samp>
 hello
 world
-</samp></pre><p><code>转义标签&lt;span&gt;hello world&lt;/span&gt;</code></p><h2 id="其他" tabindex="-1">其他 <a class="header-anchor" href="#其他" aria-label="Permalink to &quot;其他&quot;">​</a></h2><img src="/learning-docs2/assets/images/otherseo.jpg" alt="其它HTML语义化标签"></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>阅读前瞻</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/html/esmodule.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ES Module</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+</samp></pre><p><code>转义标签&lt;span&gt;hello world&lt;/span&gt;</code></p><h2 id="其他" tabindex="-1">其他 <a class="header-anchor" href="#其他" aria-label="Permalink to &quot;其他&quot;">​</a></h2><img src="/assets/images/otherseo.jpg" alt="其它HTML语义化标签"></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>阅读前瞻</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/html/esmodule.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ES Module</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/html/unusual.html b/notes/html/unusual.html
index 6705c92..a869167 100644
--- a/notes/html/unusual.html
+++ b/notes/html/unusual.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>你不知道的 HTML 标签 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_html_unusual.md.a78f96eb.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_html_unusual.md.76389d1b.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_html_unusual" data-v-6b87e69f><div><h1 id="你不知道的-html-标签" tabindex="-1">你不知道的 HTML 标签 <a class="header-anchor" href="#你不知道的-html-标签" aria-label="Permalink to &quot;你不知道的 HTML 标签&quot;">​</a></h1><h2 id="meta" tabindex="-1">meta <a class="header-anchor" href="#meta" aria-label="Permalink to &quot;meta&quot;">​</a></h2><ul><li>charset 指定编码集</li><li>http-equiv 为 content 属性值提供 HTTP header <ul><li>content-security-policy 定义内容策略，指定允许的服务器元和脚本端点，有助于跨站点脚本共计</li><li>content-type 内容格式 text/html</li><li>default-style 设置默认css样式表集的名称</li><li>refresh 过几秒刷新跳转 content=&quot;秒数;url=xxx&quot;</li><li>x-ua-compatible 如果指定 content 属性值必须有 IE=edge</li></ul></li><li>name <ul><li>application-name 页面应用名</li><li>author 页面作者</li><li>description 页面描述</li><li>generator</li><li>keywords 关键字</li><li>viewport 视口</li></ul></li><li>content 为 http-equiv 属性和 name 属性提供值</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/html/esmodule.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ES Module</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/css/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>CSS 知识</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_html_unusual" data-v-6b87e69f><div><h1 id="你不知道的-html-标签" tabindex="-1">你不知道的 HTML 标签 <a class="header-anchor" href="#你不知道的-html-标签" aria-label="Permalink to &quot;你不知道的 HTML 标签&quot;">​</a></h1><h2 id="meta" tabindex="-1">meta <a class="header-anchor" href="#meta" aria-label="Permalink to &quot;meta&quot;">​</a></h2><ul><li>charset 指定编码集</li><li>http-equiv 为 content 属性值提供 HTTP header <ul><li>content-security-policy 定义内容策略，指定允许的服务器元和脚本端点，有助于跨站点脚本共计</li><li>content-type 内容格式 text/html</li><li>default-style 设置默认css样式表集的名称</li><li>refresh 过几秒刷新跳转 content=&quot;秒数;url=xxx&quot;</li><li>x-ua-compatible 如果指定 content 属性值必须有 IE=edge</li></ul></li><li>name <ul><li>application-name 页面应用名</li><li>author 页面作者</li><li>description 页面描述</li><li>generator</li><li>keywords 关键字</li><li>viewport 视口</li></ul></li><li>content 为 http-equiv 属性和 name 属性提供值</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/html/esmodule.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ES Module</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/css/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>CSS 知识</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/index.html b/notes/index.html
index 4c82ed5..fb6d59d 100644
--- a/notes/index.html
+++ b/notes/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>JUST DO IT | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_index.md.778f192c.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_index.md.0f4dfe42.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_" data-v-6b87e69f><div><h1 id="just-do-it" tabindex="-1">JUST DO IT <a class="header-anchor" href="#just-do-it" aria-label="Permalink to &quot;JUST DO IT&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">专注</p><p>👊 记录前端的点点滴滴，持续成长，持续学习</p></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/html/seo.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>SEO</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_" data-v-6b87e69f><div><h1 id="just-do-it" tabindex="-1">JUST DO IT <a class="header-anchor" href="#just-do-it" aria-label="Permalink to &quot;JUST DO IT&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">专注</p><p>👊 记录前端的点点滴滴，持续成长，持续学习</p></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/html/seo.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>SEO</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/URI.html b/notes/javascript/URI.html
index c4994cc..40dabef 100644
--- a/notes/javascript/URI.html
+++ b/notes/javascript/URI.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>URI 编码 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_URI.md.aa38219c.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_URI.md.0675aa7b.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_URI" data-v-6b87e69f><div><h1 id="uri-编码" tabindex="-1">URI 编码 <a class="header-anchor" href="#uri-编码" aria-label="Permalink to &quot;URI 编码&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">URI 编码</p><p>URI 方法能对所有的 Unicode 码进行编码，escape &amp; unescape 基本别废弃，它只对 ASCII 码进行编码</p></div><h2 id="unescape" tabindex="-1">unescape <a class="header-anchor" href="#unescape" aria-label="Permalink to &quot;unescape&quot;">​</a></h2><p>ASCII 编码</p><h2 id="escape" tabindex="-1">escape <a class="header-anchor" href="#escape" aria-label="Permalink to &quot;escape&quot;">​</a></h2><p>ASCII 解码</p><h2 id="encodeuri" tabindex="-1">encodeURI <a class="header-anchor" href="#encodeuri" aria-label="Permalink to &quot;encodeURI&quot;">​</a></h2><blockquote><p>不会对本身属于 URI 特殊字符进行编码</p></blockquote><p>URI 特殊字符：冒号(😃 井号(#) 正斜杠(/) 问号(?)</p><h2 id="decodeuri" tabindex="-1">decodeURI <a class="header-anchor" href="#decodeuri" aria-label="Permalink to &quot;decodeURI&quot;">​</a></h2><p>解码</p><h2 id="encodeuricomponent" tabindex="-1">encodeURIComponent <a class="header-anchor" href="#encodeuricomponent" aria-label="Permalink to &quot;encodeURIComponent&quot;">​</a></h2><p>所有非标准字符编码</p><h2 id="decodeuricomponent" tabindex="-1">decodeURIComponent <a class="header-anchor" href="#decodeuricomponent" aria-label="Permalink to &quot;decodeURIComponent&quot;">​</a></h2><p>解码</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/this.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>This 作用域</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/regexp/base.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>基础</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_URI" data-v-6b87e69f><div><h1 id="uri-编码" tabindex="-1">URI 编码 <a class="header-anchor" href="#uri-编码" aria-label="Permalink to &quot;URI 编码&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">URI 编码</p><p>URI 方法能对所有的 Unicode 码进行编码，escape &amp; unescape 基本别废弃，它只对 ASCII 码进行编码</p></div><h2 id="unescape" tabindex="-1">unescape <a class="header-anchor" href="#unescape" aria-label="Permalink to &quot;unescape&quot;">​</a></h2><p>ASCII 编码</p><h2 id="escape" tabindex="-1">escape <a class="header-anchor" href="#escape" aria-label="Permalink to &quot;escape&quot;">​</a></h2><p>ASCII 解码</p><h2 id="encodeuri" tabindex="-1">encodeURI <a class="header-anchor" href="#encodeuri" aria-label="Permalink to &quot;encodeURI&quot;">​</a></h2><blockquote><p>不会对本身属于 URI 特殊字符进行编码</p></blockquote><p>URI 特殊字符：冒号(😃 井号(#) 正斜杠(/) 问号(?)</p><h2 id="decodeuri" tabindex="-1">decodeURI <a class="header-anchor" href="#decodeuri" aria-label="Permalink to &quot;decodeURI&quot;">​</a></h2><p>解码</p><h2 id="encodeuricomponent" tabindex="-1">encodeURIComponent <a class="header-anchor" href="#encodeuricomponent" aria-label="Permalink to &quot;encodeURIComponent&quot;">​</a></h2><p>所有非标准字符编码</p><h2 id="decodeuricomponent" tabindex="-1">decodeURIComponent <a class="header-anchor" href="#decodeuricomponent" aria-label="Permalink to &quot;decodeURIComponent&quot;">​</a></h2><p>解码</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/this.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>This 作用域</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/regexp/base.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>基础</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/addEventListener.html b/notes/javascript/addEventListener.html
index 89e1b50..8f32d26 100644
--- a/notes/javascript/addEventListener.html
+++ b/notes/javascript/addEventListener.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>DOM2 级绑定事件 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_addEventListener.md.1f4fe8a5.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_addEventListener.md.6026f065.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_addEventListener" data-v-6b87e69f><div><h1 id="dom2-级绑定事件" tabindex="-1">DOM2 级绑定事件 <a class="header-anchor" href="#dom2-级绑定事件" aria-label="Permalink to &quot;DOM2 级绑定事件&quot;">​</a></h1><h2 id="addeventlistener" tabindex="-1">addEventListener <a class="header-anchor" href="#addeventlistener" aria-label="Permalink to &quot;addEventListener&quot;">​</a></h2><blockquote><p>addEventListener 绑定事件接收三个参数</p></blockquote><h3 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h3><ul><li>event 事件名</li><li>handler 事件处理函数</li><li>boolean/object <ul><li>当为 bool 值时，false 表示冒泡阶段，true 表示捕获阶段</li><li>当为对象时 <ul><li>once 是否执行一次即销毁</li><li>capture 是否优先其他事件执行</li><li>passive 默认行为是否立即执行（多用于移动端）</li></ul></li></ul></li></ul><h3 id="例子" tabindex="-1">例子 <a class="header-anchor" href="#例子" aria-label="Permalink to &quot;例子&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;parent&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_addEventListener" data-v-6b87e69f><div><h1 id="dom2-级绑定事件" tabindex="-1">DOM2 级绑定事件 <a class="header-anchor" href="#dom2-级绑定事件" aria-label="Permalink to &quot;DOM2 级绑定事件&quot;">​</a></h1><h2 id="addeventlistener" tabindex="-1">addEventListener <a class="header-anchor" href="#addeventlistener" aria-label="Permalink to &quot;addEventListener&quot;">​</a></h2><blockquote><p>addEventListener 绑定事件接收三个参数</p></blockquote><h3 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h3><ul><li>event 事件名</li><li>handler 事件处理函数</li><li>boolean/object <ul><li>当为 bool 值时，false 表示冒泡阶段，true 表示捕获阶段</li><li>当为对象时 <ul><li>once 是否执行一次即销毁</li><li>capture 是否优先其他事件执行</li><li>passive 默认行为是否立即执行（多用于移动端）</li></ul></li></ul></li></ul><h3 id="例子" tabindex="-1">例子 <a class="header-anchor" href="#例子" aria-label="Permalink to &quot;例子&quot;">​</a></h3><div class="language-html vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">html</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;parent&quot;</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;child1&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  &lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">id</span><span style="color:#E1E4E8;">=</span><span style="color:#9ECBFF;">&quot;child2&quot;</span><span style="color:#E1E4E8;">&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
@@ -71,8 +71,8 @@
 <span class="line"><span style="color:#24292E;">    console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;child1&#39;</span><span style="color:#24292E;">);</span></span>
 <span class="line"><span style="color:#24292E;">  });</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#6A737D;">/* result: parent &gt; child1 并且执行一次 */</span></span>
-<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">script</span><span style="color:#24292E;">&gt;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/css/visibility.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Visibility 属性</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/dom.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>DOM 类型</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#22863A;">script</span><span style="color:#24292E;">&gt;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/css/visibility.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Visibility 属性</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/dom.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>DOM 类型</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/dom.html b/notes/javascript/dom.html
index fa801d7..0df71f4 100644
--- a/notes/javascript/dom.html
+++ b/notes/javascript/dom.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>DOM 类型 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_dom.md.00aacf49.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_dom.md.0af651ba.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_dom" data-v-6b87e69f><div><h1 id="dom-类型" tabindex="-1">DOM 类型 <a class="header-anchor" href="#dom-类型" aria-label="Permalink to &quot;DOM 类型&quot;">​</a></h1><h2 id="dom-链" tabindex="-1">DOM 链 <a class="header-anchor" href="#dom-链" aria-label="Permalink to &quot;DOM 链&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">JS &amp; HTML</p><p>记录原生的 js 操作 dom 链</p></div><p><code>让我们从最熟悉的的 document 开始</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">document</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_dom" data-v-6b87e69f><div><h1 id="dom-类型" tabindex="-1">DOM 类型 <a class="header-anchor" href="#dom-类型" aria-label="Permalink to &quot;DOM 类型&quot;">​</a></h1><h2 id="dom-链" tabindex="-1">DOM 链 <a class="header-anchor" href="#dom-链" aria-label="Permalink to &quot;DOM 链&quot;">​</a></h2><div class="tip custom-block"><p class="custom-block-title">JS &amp; HTML</p><p>记录原生的 js 操作 dom 链</p></div><p><code>让我们从最熟悉的的 document 开始</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#E1E4E8;">document</span></span>
 <span class="line"><span style="color:#E1E4E8;">document.</span><span style="color:#79B8FF;">__proto__</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> HTMLDocument </span><span style="color:#6A737D;">// type object</span></span>
 <span class="line"><span style="color:#E1E4E8;">HTMLDocument.</span><span style="color:#79B8FF;">__proto__</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> Document </span><span style="color:#6A737D;">// type function =&gt; f Document({[native code]}) 源码</span></span>
 <span class="line"></span>
@@ -51,7 +51,7 @@
 <span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> root </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> document.</span><span style="color:#6F42C1;">getElementById</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;root&#39;</span><span style="color:#24292E;">);</span></span>
 <span class="line"><span style="color:#24292E;">root.</span><span style="color:#005CC5;">__proto__</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> HTMLDivElement</span></span>
 <span class="line"><span style="color:#24292E;">root.</span><span style="color:#005CC5;">__proto__</span><span style="color:#24292E;">.</span><span style="color:#005CC5;">__proto__</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> HTMLElement</span></span>
-<span class="line"><span style="color:#6A737D;">// ... 同上</span></span></code></pre></div><h2 id="dom-操作" tabindex="-1">DOM 操作 <a class="header-anchor" href="#dom-操作" aria-label="Permalink to &quot;DOM 操作&quot;">​</a></h2><div class="warning custom-block"><p class="custom-block-title">NodeList NamedNodeMap HTMLCollection</p><p>有两个方法：item() nameItem()</p><p>文档结构发生变化时，它们会随时更新（减少访问的次数）</p></div><img src="/learning-docs2/assets/images/dom.png" alt="DOM图"><p><strong>DOM API</strong></p><ul><li><p>createElement</p></li><li><p>createTextNode <code>创建文本节点 normalize() 一个父元素下所有文本节点合并成一个节点</code></p></li><li><p>createComment <code>注释文本</code></p></li><li><p>createDocumentFragment <code>文档片段</code></p></li><li><p>appendChild</p></li><li><p>removeChild</p></li><li><p>replaceChild(target, source)</p></li><li><p>insertBefore(target, source)</p></li><li><p>cloneNode(bool) <code>true =&gt; 深复制 false =&gt; 浅复制</code></p></li><li><p>getAttribute</p></li><li><p>setAttribute <code>dataset 标准</code></p></li><li><p>removeAttribute</p></li><li><p>attributes[]</p></li><li><p>attr</p></li></ul><h2 id="dom-扩展" tabindex="-1">DOM 扩展 <a class="header-anchor" href="#dom-扩展" aria-label="Permalink to &quot;DOM 扩展&quot;">​</a></h2><ul><li><p>querySelector</p></li><li><p>querySelectorAll</p></li><li><p>matchesSelector</p></li><li><p>Element Traversal API 为 DOM 元素添加了以下 5 个属性。</p><ul><li> childElementCount:返回子元素(不包括文本节点和注释)的个数。</li><li> firstElementChild:指向第一个子元素;firstChild 的元素版。</li><li> lastElementChild:指向最后一个子元素;lastChild 的元素版。</li><li> previousElementSibling:指向前一个同辈元素;previousSibling 的元素版。</li><li> nextElementSibling:指向后一个同辈元素;nextSibling 的元素版。</li></ul></li><li><p>classList</p><ul><li>add</li><li>contains</li><li>remove</li><li>toggle</li></ul></li><li><p>自定义数据属性</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> div </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> document.</span><span style="color:#B392F0;">getElementById</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;myDiv&#39;</span><span style="color:#E1E4E8;">);</span></span>
+<span class="line"><span style="color:#6A737D;">// ... 同上</span></span></code></pre></div><h2 id="dom-操作" tabindex="-1">DOM 操作 <a class="header-anchor" href="#dom-操作" aria-label="Permalink to &quot;DOM 操作&quot;">​</a></h2><div class="warning custom-block"><p class="custom-block-title">NodeList NamedNodeMap HTMLCollection</p><p>有两个方法：item() nameItem()</p><p>文档结构发生变化时，它们会随时更新（减少访问的次数）</p></div><img src="/assets/images/dom.png" alt="DOM图"><p><strong>DOM API</strong></p><ul><li><p>createElement</p></li><li><p>createTextNode <code>创建文本节点 normalize() 一个父元素下所有文本节点合并成一个节点</code></p></li><li><p>createComment <code>注释文本</code></p></li><li><p>createDocumentFragment <code>文档片段</code></p></li><li><p>appendChild</p></li><li><p>removeChild</p></li><li><p>replaceChild(target, source)</p></li><li><p>insertBefore(target, source)</p></li><li><p>cloneNode(bool) <code>true =&gt; 深复制 false =&gt; 浅复制</code></p></li><li><p>getAttribute</p></li><li><p>setAttribute <code>dataset 标准</code></p></li><li><p>removeAttribute</p></li><li><p>attributes[]</p></li><li><p>attr</p></li></ul><h2 id="dom-扩展" tabindex="-1">DOM 扩展 <a class="header-anchor" href="#dom-扩展" aria-label="Permalink to &quot;DOM 扩展&quot;">​</a></h2><ul><li><p>querySelector</p></li><li><p>querySelectorAll</p></li><li><p>matchesSelector</p></li><li><p>Element Traversal API 为 DOM 元素添加了以下 5 个属性。</p><ul><li> childElementCount:返回子元素(不包括文本节点和注释)的个数。</li><li> firstElementChild:指向第一个子元素;firstChild 的元素版。</li><li> lastElementChild:指向最后一个子元素;lastChild 的元素版。</li><li> previousElementSibling:指向前一个同辈元素;previousSibling 的元素版。</li><li> nextElementSibling:指向后一个同辈元素;nextSibling 的元素版。</li></ul></li><li><p>classList</p><ul><li>add</li><li>contains</li><li>remove</li><li>toggle</li></ul></li><li><p>自定义数据属性</p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> div </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> document.</span><span style="color:#B392F0;">getElementById</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;myDiv&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#6A737D;">//取得自定义属性的值</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> appId </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> div.dataset.appId;</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> myName </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> div.dataset.myname;</span></span>
@@ -91,7 +91,7 @@
 <span class="line"><span style="color:#24292E;">myDiv.style.cssText </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;width: 25px; height: 100px; background-color: green&#39;</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#6F42C1;">alert</span><span style="color:#24292E;">(myDiv.style.cssText);</span></span>
 <span class="line"></span>
-<span class="line"><span style="color:#24292E;">myDiv.</span><span style="color:#6F42C1;">getComputedStyle</span><span style="color:#24292E;">(); </span><span style="color:#6A737D;">// 返回所有的样式 行内样式 内联样式</span></span></code></pre></div><p><strong>元素大小</strong></p><ul><li>偏移量 <ul><li> offsetHeight:元素在垂直方向上占用的空间大小，以像素计。包括元素的高度、(可见的) 水平滚动条的高度、上边框高度和下边框高度。</li><li> offsetWidth:元素在水平方向上占用的空间大小，以像素计。包括元素的宽度、(可见的)垂 直滚动条的宽度、左边框宽度和右边框宽度。</li><li> offsetLeft:元素的左外边框至包含元素的左内边框之间的像素距离。</li><li> offsetTop:元素的上外边框至包含元素的上内边框之间的像素距离。</li></ul></li></ul><img src="/learning-docs2/assets/images/tblr.png" alt="偏移量图"><ul><li>客户区大小</li></ul><img src="/learning-docs2/assets/images/clientBS.png" alt="客户区大小图"><ul><li>滚动大小 <ul><li> scrollHeight:在没有滚动条的情况下，元素内容的总高度。</li><li> scrollWidth:在没有滚动条的情况下，元素内容的总宽度。</li><li> scrollLeft:被隐藏在内容区域左侧的像素数。通过设置这个属性可以改变元素的滚动位置。</li><li> scrollTop:被隐藏在内容区域上方的像素数。通过设置这个属性可以改变元素的滚动位置。</li></ul></li></ul><img src="/learning-docs2/assets/images/scrollBS.png" alt="滚动大小图"><div class="warning custom-block"><p class="custom-block-title">混杂模式</p><p>对于运行在混杂模式下的 IE，则需要用 document.body 代替 document.documentElement</p></div><ul><li><p>确定元素大小 <code>getBoundingClientRect()</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">getBoundingClientRect</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">element</span><span style="color:#E1E4E8;">) {</span></span>
+<span class="line"><span style="color:#24292E;">myDiv.</span><span style="color:#6F42C1;">getComputedStyle</span><span style="color:#24292E;">(); </span><span style="color:#6A737D;">// 返回所有的样式 行内样式 内联样式</span></span></code></pre></div><p><strong>元素大小</strong></p><ul><li>偏移量 <ul><li> offsetHeight:元素在垂直方向上占用的空间大小，以像素计。包括元素的高度、(可见的) 水平滚动条的高度、上边框高度和下边框高度。</li><li> offsetWidth:元素在水平方向上占用的空间大小，以像素计。包括元素的宽度、(可见的)垂 直滚动条的宽度、左边框宽度和右边框宽度。</li><li> offsetLeft:元素的左外边框至包含元素的左内边框之间的像素距离。</li><li> offsetTop:元素的上外边框至包含元素的上内边框之间的像素距离。</li></ul></li></ul><img src="/assets/images/tblr.png" alt="偏移量图"><ul><li>客户区大小</li></ul><img src="/assets/images/clientBS.png" alt="客户区大小图"><ul><li>滚动大小 <ul><li> scrollHeight:在没有滚动条的情况下，元素内容的总高度。</li><li> scrollWidth:在没有滚动条的情况下，元素内容的总宽度。</li><li> scrollLeft:被隐藏在内容区域左侧的像素数。通过设置这个属性可以改变元素的滚动位置。</li><li> scrollTop:被隐藏在内容区域上方的像素数。通过设置这个属性可以改变元素的滚动位置。</li></ul></li></ul><img src="/assets/images/scrollBS.png" alt="滚动大小图"><div class="warning custom-block"><p class="custom-block-title">混杂模式</p><p>对于运行在混杂模式下的 IE，则需要用 document.body 代替 document.documentElement</p></div><ul><li><p>确定元素大小 <code>getBoundingClientRect()</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">getBoundingClientRect</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">element</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">if</span><span style="color:#E1E4E8;"> (</span><span style="color:#F97583;">typeof</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">arguments</span><span style="color:#E1E4E8;">.callee.offset </span><span style="color:#F97583;">!=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;number&#39;</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> scrollTop </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> document.documentElement.scrollTop;</span></span>
 <span class="line"><span style="color:#E1E4E8;">    </span><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> temp </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> document.</span><span style="color:#B392F0;">createElement</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;div&#39;</span><span style="color:#E1E4E8;">);</span></span>
@@ -159,8 +159,8 @@
 <span class="line"><span style="color:#24292E;">      </span><span style="color:#D73A49;">return</span><span style="color:#24292E;"> window.clipboardData.</span><span style="color:#6F42C1;">setData</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;text&#39;</span><span style="color:#24292E;">, value);</span></span>
 <span class="line"><span style="color:#24292E;">    }</span></span>
 <span class="line"><span style="color:#24292E;">  },</span></span>
-<span class="line"><span style="color:#24292E;">};</span></span></code></pre></div></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>事件监听</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/equal.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>相等性检查</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">};</span></span></code></pre></div></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/addEventListener.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>事件监听</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/equal.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>相等性检查</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/equal.html b/notes/javascript/equal.html
index 053fa04..2012123 100644
--- a/notes/javascript/equal.html
+++ b/notes/javascript/equal.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>JS 相等性 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_equal.md.392568f0.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_equal.md.0278cdef.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_equal" data-v-6b87e69f><div><h1 id="js-相等性" tabindex="-1">JS 相等性 <a class="header-anchor" href="#js-相等性" aria-label="Permalink to &quot;JS 相等性&quot;">​</a></h1><div class="warning custom-block"><p class="custom-block-title">相等性</p><p>JavaScript中的相等性检查（有的转换会感觉很奇怪，目前记住规则）</p></div><p>以下截图来源 <a href="https://github.com/dorey/JavaScript-Equality-Table" target="_blank" rel="noreferrer">Github @dorey</a></p><h2 id="相等" tabindex="-1">相等 == <a class="header-anchor" href="#相等" aria-label="Permalink to &quot;相等 ==&quot;">​</a></h2><p><code>发生强制转换类型</code></p><img src="/learning-docs2/assets/images/==.png" alt="相等"><h2 id="严格相等" tabindex="-1">严格相等 === <a class="header-anchor" href="#严格相等" aria-label="Permalink to &quot;严格相等 ===&quot;">​</a></h2><img src="/learning-docs2/assets/images/===.png" alt="严格相等"><h2 id="判断-if" tabindex="-1">判断 if() <a class="header-anchor" href="#判断-if" aria-label="Permalink to &quot;判断 if()&quot;">​</a></h2><img src="/learning-docs2/assets/images/if().png" alt="if()"><h2 id="比较" tabindex="-1">比较 &gt; = &lt; <a class="header-anchor" href="#比较" aria-label="Permalink to &quot;比较 &gt; = &lt;&quot;">​</a></h2><p><code>两边都会发生转换</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> {b: </span><span style="color:#79B8FF;">1</span><span style="color:#E1E4E8;">};</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_equal" data-v-6b87e69f><div><h1 id="js-相等性" tabindex="-1">JS 相等性 <a class="header-anchor" href="#js-相等性" aria-label="Permalink to &quot;JS 相等性&quot;">​</a></h1><div class="warning custom-block"><p class="custom-block-title">相等性</p><p>JavaScript中的相等性检查（有的转换会感觉很奇怪，目前记住规则）</p></div><p>以下截图来源 <a href="https://github.com/dorey/JavaScript-Equality-Table" target="_blank" rel="noreferrer">Github @dorey</a></p><h2 id="相等" tabindex="-1">相等 == <a class="header-anchor" href="#相等" aria-label="Permalink to &quot;相等 ==&quot;">​</a></h2><p><code>发生强制转换类型</code></p><img src="/assets/images/==.png" alt="相等"><h2 id="严格相等" tabindex="-1">严格相等 === <a class="header-anchor" href="#严格相等" aria-label="Permalink to &quot;严格相等 ===&quot;">​</a></h2><img src="/assets/images/===.png" alt="严格相等"><h2 id="判断-if" tabindex="-1">判断 if() <a class="header-anchor" href="#判断-if" aria-label="Permalink to &quot;判断 if()&quot;">​</a></h2><img src="/assets/images/if().png" alt="if()"><h2 id="比较" tabindex="-1">比较 &gt; = &lt; <a class="header-anchor" href="#比较" aria-label="Permalink to &quot;比较 &gt; = &lt;&quot;">​</a></h2><p><code>两边都会发生转换</code></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> {b: </span><span style="color:#79B8FF;">1</span><span style="color:#E1E4E8;">};</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> b </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> {c: </span><span style="color:#79B8FF;">2</span><span style="color:#E1E4E8;">};</span></span>
 <span class="line"><span style="color:#E1E4E8;">a </span><span style="color:#F97583;">==</span><span style="color:#E1E4E8;"> b </span><span style="color:#6A737D;">// false</span></span>
 <span class="line"><span style="color:#E1E4E8;">a </span><span style="color:#F97583;">&lt;=</span><span style="color:#E1E4E8;"> b </span><span style="color:#6A737D;">// true</span></span>
@@ -25,8 +25,8 @@
 <span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> b </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> {c: </span><span style="color:#005CC5;">2</span><span style="color:#24292E;">};</span></span>
 <span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">==</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// false</span></span>
 <span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">&lt;=</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// true</span></span>
-<span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">&gt;=</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// true</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-02-02T08:56:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/dom.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>DOM 类型</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/event-loop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>事件循环</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">a </span><span style="color:#D73A49;">&gt;=</span><span style="color:#24292E;"> b </span><span style="color:#6A737D;">// true</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-02-02T08:56:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/dom.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>DOM 类型</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/event-loop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>事件循环</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/event-loop.html b/notes/javascript/event-loop.html
index 6394ed0..914dfe6 100644
--- a/notes/javascript/event-loop.html
+++ b/notes/javascript/event-loop.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Event Loop | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_event-loop.md.15fccb5b.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_event-loop.md.bdac45df.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_event-loop" data-v-6b87e69f><div><h1 id="event-loop" tabindex="-1">Event Loop <a class="header-anchor" href="#event-loop" aria-label="Permalink to &quot;Event Loop&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">事件循环</p><p>🔥事件队列 异步 进程 线程</p></div><h2 id="cpu、进程、线程之间的关系" tabindex="-1">CPU、进程、线程之间的关系 <a class="header-anchor" href="#cpu、进程、线程之间的关系" aria-label="Permalink to &quot;CPU、进程、线程之间的关系&quot;">​</a></h2><p><code>进程</code>是 cpu 资源分配的最小单元（是能拥有资源和独立运行的最小单位）</p><p><code>线程</code>是 cpu 调度的最小单位（线程是建立在进程的基础上的一次程序运行单位，一个进程中可以有多个线程）</p><p>不同<code>进程</code>之间也可以通信，代价较大</p><p><code>单线程</code>与<code>多线程</code>，都是指在一个<code>进程</code>内的单和多</p><h2 id="浏览器是多进程的" tabindex="-1">浏览器是多进程的 <a class="header-anchor" href="#浏览器是多进程的" aria-label="Permalink to &quot;浏览器是多进程的&quot;">​</a></h2><p>浏览器是多进程的</p><p>每一个 tab 页，就是一个独立的进程</p><h2 id="浏览器包含了哪些进程" tabindex="-1">浏览器包含了哪些进程 <a class="header-anchor" href="#浏览器包含了哪些进程" aria-label="Permalink to &quot;浏览器包含了哪些进程&quot;">​</a></h2><h3 id="主进程" tabindex="-1">主进程 <a class="header-anchor" href="#主进程" aria-label="Permalink to &quot;主进程&quot;">​</a></h3><ul><li><p>协调控制其他子进程（创建、销毁）</p></li><li><p>浏览器界面显示，用户交互，前进、后退、收藏</p></li><li><p>将渲染进程得到的内存中的 bitmap，绘制到用户界面上</p></li><li><p>处理不可见操作，网络操作，文件访问</p></li></ul><h3 id="第三方插件进程" tabindex="-1">第三方插件进程 <a class="header-anchor" href="#第三方插件进程" aria-label="Permalink to &quot;第三方插件进程&quot;">​</a></h3><p><code>每个插件一个进程，使用的时候，进程被创建</code></p><blockquote><p>GPU 进程</p></blockquote><p>用于 3D 绘制等</p><blockquote><p>渲染进程（浏览器内核）</p></blockquote><ul><li><p>负责页面渲染，脚本执行，事件处理等</p></li><li><p>每个 tab 页一个渲染进程</p></li></ul><h2 id="浏览器内核-渲染进程" tabindex="-1">浏览器内核（渲染进程） <a class="header-anchor" href="#浏览器内核-渲染进程" aria-label="Permalink to &quot;浏览器内核（渲染进程）&quot;">​</a></h2><blockquote><p>GUI 渲染进程</p></blockquote><ul><li><p>负责渲染页面，布局和绘制</p></li><li><p>页面需要重绘和回流时，该线程就会执行</p></li><li><p>与 js 引擎互斥，防止渲染结果不可预期</p></li></ul><blockquote><p>JS 引擎线程</p></blockquote><ul><li><p>负责处理解析和执行 JavaScript 脚本程序</p></li><li><p>只有一个 JS 引擎线程（单线程）</p></li><li><p>与 GUI 渲染线程互斥，防止渲染结果不可预期</p></li></ul><blockquote><p>事件触发线程</p></blockquote><ul><li><p>用来控制事件循环（鼠标点击，setTimeout，ajax）</p></li><li><p>当事件满足触发条件时，将事件放入到 JS 引擎所在的执行队列中</p></li></ul><blockquote><p>定时触发器线程</p></blockquote><ul><li><p>setInterval 与 setTimeout 所在的线程</p></li><li><p>定时任务并不是由 JS 引擎计时的，是由定时触发线程来计时的</p></li><li><p>计时完毕后，通知事件触发线程</p></li></ul><blockquote><p>异步 http 请求线程</p></blockquote><ul><li><p>浏览器有一个单独的线程用于处理 AJAX 请求</p></li><li><p>当请求完成时，若有回调函数，通知时间触发线程</p></li></ul><h2 id="javascript-单线程" tabindex="-1">JavaScript 单线程？ <a class="header-anchor" href="#javascript-单线程" aria-label="Permalink to &quot;JavaScript 单线程？&quot;">​</a></h2><p><code>多线程需要加锁，同时操作DOM，在多线程不加锁的情况下，最终会导致DOM渲染的结果不可预期</code></p><h2 id="gui-渲染线程与-js-引擎线程互斥" tabindex="-1">GUI 渲染线程与 JS 引擎线程互斥？ <a class="header-anchor" href="#gui-渲染线程与-js-引擎线程互斥" aria-label="Permalink to &quot;GUI 渲染线程与 JS 引擎线程互斥？&quot;">​</a></h2><p><code>当JS引擎线程执行时，GUI渲染线程会被挂起，GUI更新则会被保存在一个队列中等待JS引擎线程空闲时立即被执行</code></p><h2 id="event-loop-go" tabindex="-1">Event Loop GO <a class="header-anchor" href="#event-loop-go" aria-label="Permalink to &quot;Event Loop GO&quot;">​</a></h2><ul><li><p>同步任务和异步任务</p></li><li><p>同步任务在 js 引擎线程上执行，形成一个执行栈</p></li><li><p>事件触发线程管理一个任务队列，异步任务触发条件达成，将回调事件放到任务队列中</p></li><li><p>执行栈中所有同步任务执行完毕，js 引擎线程空闲，系统会读取</p></li></ul><img src="/learning-docs2/assets/images/001.png"><ul><li><p>宏任务 --&gt; 事件队列（循环）</p></li><li><p>微任务 --&gt; 微任务队列</p></li></ul><img src="/learning-docs2/assets/images/002.png"><p><code>宏任务完成立即执行当前一轮的微任务</code></p><ul><li><p>执行一个宏任务（栈中没有从事件队列中获取）</p></li><li><p>执行过程中如果遇到微任务，添加到微任务队列</p></li><li><p>宏任务执行完毕后，立即执行当前微任务队列的所有微任务</p></li><li><p>宏任务执行完毕，开始检查渲染，然后 GUI 线程接管渲染</p></li><li><p>渲染完毕后，js 线程继续接管，开始下一个宏任务（事件队列）</p></li></ul><img src="/learning-docs2/assets/images/003.png"></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-02-02T08:56:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/equal.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>相等性检查</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/jsop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>运算符</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_event-loop" data-v-6b87e69f><div><h1 id="event-loop" tabindex="-1">Event Loop <a class="header-anchor" href="#event-loop" aria-label="Permalink to &quot;Event Loop&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">事件循环</p><p>🔥事件队列 异步 进程 线程</p></div><h2 id="cpu、进程、线程之间的关系" tabindex="-1">CPU、进程、线程之间的关系 <a class="header-anchor" href="#cpu、进程、线程之间的关系" aria-label="Permalink to &quot;CPU、进程、线程之间的关系&quot;">​</a></h2><p><code>进程</code>是 cpu 资源分配的最小单元（是能拥有资源和独立运行的最小单位）</p><p><code>线程</code>是 cpu 调度的最小单位（线程是建立在进程的基础上的一次程序运行单位，一个进程中可以有多个线程）</p><p>不同<code>进程</code>之间也可以通信，代价较大</p><p><code>单线程</code>与<code>多线程</code>，都是指在一个<code>进程</code>内的单和多</p><h2 id="浏览器是多进程的" tabindex="-1">浏览器是多进程的 <a class="header-anchor" href="#浏览器是多进程的" aria-label="Permalink to &quot;浏览器是多进程的&quot;">​</a></h2><p>浏览器是多进程的</p><p>每一个 tab 页，就是一个独立的进程</p><h2 id="浏览器包含了哪些进程" tabindex="-1">浏览器包含了哪些进程 <a class="header-anchor" href="#浏览器包含了哪些进程" aria-label="Permalink to &quot;浏览器包含了哪些进程&quot;">​</a></h2><h3 id="主进程" tabindex="-1">主进程 <a class="header-anchor" href="#主进程" aria-label="Permalink to &quot;主进程&quot;">​</a></h3><ul><li><p>协调控制其他子进程（创建、销毁）</p></li><li><p>浏览器界面显示，用户交互，前进、后退、收藏</p></li><li><p>将渲染进程得到的内存中的 bitmap，绘制到用户界面上</p></li><li><p>处理不可见操作，网络操作，文件访问</p></li></ul><h3 id="第三方插件进程" tabindex="-1">第三方插件进程 <a class="header-anchor" href="#第三方插件进程" aria-label="Permalink to &quot;第三方插件进程&quot;">​</a></h3><p><code>每个插件一个进程，使用的时候，进程被创建</code></p><blockquote><p>GPU 进程</p></blockquote><p>用于 3D 绘制等</p><blockquote><p>渲染进程（浏览器内核）</p></blockquote><ul><li><p>负责页面渲染，脚本执行，事件处理等</p></li><li><p>每个 tab 页一个渲染进程</p></li></ul><h2 id="浏览器内核-渲染进程" tabindex="-1">浏览器内核（渲染进程） <a class="header-anchor" href="#浏览器内核-渲染进程" aria-label="Permalink to &quot;浏览器内核（渲染进程）&quot;">​</a></h2><blockquote><p>GUI 渲染进程</p></blockquote><ul><li><p>负责渲染页面，布局和绘制</p></li><li><p>页面需要重绘和回流时，该线程就会执行</p></li><li><p>与 js 引擎互斥，防止渲染结果不可预期</p></li></ul><blockquote><p>JS 引擎线程</p></blockquote><ul><li><p>负责处理解析和执行 JavaScript 脚本程序</p></li><li><p>只有一个 JS 引擎线程（单线程）</p></li><li><p>与 GUI 渲染线程互斥，防止渲染结果不可预期</p></li></ul><blockquote><p>事件触发线程</p></blockquote><ul><li><p>用来控制事件循环（鼠标点击，setTimeout，ajax）</p></li><li><p>当事件满足触发条件时，将事件放入到 JS 引擎所在的执行队列中</p></li></ul><blockquote><p>定时触发器线程</p></blockquote><ul><li><p>setInterval 与 setTimeout 所在的线程</p></li><li><p>定时任务并不是由 JS 引擎计时的，是由定时触发线程来计时的</p></li><li><p>计时完毕后，通知事件触发线程</p></li></ul><blockquote><p>异步 http 请求线程</p></blockquote><ul><li><p>浏览器有一个单独的线程用于处理 AJAX 请求</p></li><li><p>当请求完成时，若有回调函数，通知时间触发线程</p></li></ul><h2 id="javascript-单线程" tabindex="-1">JavaScript 单线程？ <a class="header-anchor" href="#javascript-单线程" aria-label="Permalink to &quot;JavaScript 单线程？&quot;">​</a></h2><p><code>多线程需要加锁，同时操作DOM，在多线程不加锁的情况下，最终会导致DOM渲染的结果不可预期</code></p><h2 id="gui-渲染线程与-js-引擎线程互斥" tabindex="-1">GUI 渲染线程与 JS 引擎线程互斥？ <a class="header-anchor" href="#gui-渲染线程与-js-引擎线程互斥" aria-label="Permalink to &quot;GUI 渲染线程与 JS 引擎线程互斥？&quot;">​</a></h2><p><code>当JS引擎线程执行时，GUI渲染线程会被挂起，GUI更新则会被保存在一个队列中等待JS引擎线程空闲时立即被执行</code></p><h2 id="event-loop-go" tabindex="-1">Event Loop GO <a class="header-anchor" href="#event-loop-go" aria-label="Permalink to &quot;Event Loop GO&quot;">​</a></h2><ul><li><p>同步任务和异步任务</p></li><li><p>同步任务在 js 引擎线程上执行，形成一个执行栈</p></li><li><p>事件触发线程管理一个任务队列，异步任务触发条件达成，将回调事件放到任务队列中</p></li><li><p>执行栈中所有同步任务执行完毕，js 引擎线程空闲，系统会读取</p></li></ul><img src="/assets/images/001.png"><ul><li><p>宏任务 --&gt; 事件队列（循环）</p></li><li><p>微任务 --&gt; 微任务队列</p></li></ul><img src="/assets/images/002.png"><p><code>宏任务完成立即执行当前一轮的微任务</code></p><ul><li><p>执行一个宏任务（栈中没有从事件队列中获取）</p></li><li><p>执行过程中如果遇到微任务，添加到微任务队列</p></li><li><p>宏任务执行完毕后，立即执行当前微任务队列的所有微任务</p></li><li><p>宏任务执行完毕，开始检查渲染，然后 GUI 线程接管渲染</p></li><li><p>渲染完毕后，js 线程继续接管，开始下一个宏任务（事件队列）</p></li></ul><img src="/assets/images/003.png"></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-02-02T08:56:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/equal.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>相等性检查</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/jsop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>运算符</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/jsop.html b/notes/javascript/jsop.html
index 8860bd6..957f355 100644
--- a/notes/javascript/jsop.html
+++ b/notes/javascript/jsop.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>JS 运算符 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_jsop.md.2e56b764.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_jsop.md.a97810f8.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_jsop" data-v-6b87e69f><div><h1 id="js-运算符" tabindex="-1">JS 运算符 <a class="header-anchor" href="#js-运算符" aria-label="Permalink to &quot;JS 运算符&quot;">​</a></h1><blockquote><p>记录一些特殊的操作运算符</p></blockquote><h2 id="控制合并操作符" tabindex="-1">控制合并操作符 ?? <a class="header-anchor" href="#控制合并操作符" aria-label="Permalink to &quot;控制合并操作符 ??&quot;">​</a></h2><p>空值合并操作符（??）是一个逻辑操作符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数</p><h3 id="赋值" tabindex="-1">赋值 <a class="header-anchor" href="#赋值" aria-label="Permalink to &quot;赋值&quot;">​</a></h3><ul><li>与逻辑或操作符（||）对比</li><li>逻辑或操作符（||）会在左侧操作数为假值时返回右侧操作数</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// ??</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_jsop" data-v-6b87e69f><div><h1 id="js-运算符" tabindex="-1">JS 运算符 <a class="header-anchor" href="#js-运算符" aria-label="Permalink to &quot;JS 运算符&quot;">​</a></h1><blockquote><p>记录一些特殊的操作运算符</p></blockquote><h2 id="控制合并操作符" tabindex="-1">控制合并操作符 ?? <a class="header-anchor" href="#控制合并操作符" aria-label="Permalink to &quot;控制合并操作符 ??&quot;">​</a></h2><p>空值合并操作符（??）是一个逻辑操作符，当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数</p><h3 id="赋值" tabindex="-1">赋值 <a class="header-anchor" href="#赋值" aria-label="Permalink to &quot;赋值&quot;">​</a></h3><ul><li>与逻辑或操作符（||）对比</li><li>逻辑或操作符（||）会在左侧操作数为假值时返回右侧操作数</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// ??</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> n </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">null</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">||</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">undefined</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> o </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> n </span><span style="color:#F97583;">??</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;here value&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// output: here value</span></span>
@@ -61,8 +61,8 @@
 <span class="line"><span style="color:#E1E4E8;">obj?.a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">1</span><span style="color:#E1E4E8;">; </span><span style="color:#6A737D;">// Uncaught SyntaxError: Invalid left-hand side in assignment</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> obj </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> {};</span></span>
 <span class="line"><span style="color:#24292E;">obj?.a </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">1</span><span style="color:#24292E;">; </span><span style="color:#6A737D;">// Uncaught SyntaxError: Invalid left-hand side in assignment</span></span></code></pre></div><h3 id="访问数组元素" tabindex="-1">访问数组元素 <a class="header-anchor" href="#访问数组元素" aria-label="Permalink to &quot;访问数组元素&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> arr </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> [];</span></span>
 <span class="line"><span style="color:#E1E4E8;">arr?.[</span><span style="color:#79B8FF;">1</span><span style="color:#E1E4E8;">];</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> arr </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> [];</span></span>
-<span class="line"><span style="color:#24292E;">arr?.[</span><span style="color:#005CC5;">1</span><span style="color:#24292E;">];</span></span></code></pre></div><h2 id="运算符优先级" tabindex="-1">运算符优先级 <a class="header-anchor" href="#运算符优先级" aria-label="Permalink to &quot;运算符优先级&quot;">​</a></h2><p>以下优先级从高到底</p><p><code>左关联</code>相同操作符按照从左往右的顺序执行 <code>右关联</code>相同操作符按照从右往左的顺序执行</p><ul><li>括号</li><li>&amp;&amp;(左关联)</li><li>||(左关联)</li><li>三元运算符 ?:(右关联)</li><li>++, --</li><li>+, -(左关联)</li><li>=(右关联)</li><li>逗号表达式 ,</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/event-loop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>事件循环</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>MutationObserver</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">arr?.[</span><span style="color:#005CC5;">1</span><span style="color:#24292E;">];</span></span></code></pre></div><h2 id="运算符优先级" tabindex="-1">运算符优先级 <a class="header-anchor" href="#运算符优先级" aria-label="Permalink to &quot;运算符优先级&quot;">​</a></h2><p>以下优先级从高到底</p><p><code>左关联</code>相同操作符按照从左往右的顺序执行 <code>右关联</code>相同操作符按照从右往左的顺序执行</p><ul><li>括号</li><li>&amp;&amp;(左关联)</li><li>||(左关联)</li><li>三元运算符 ?:(右关联)</li><li>++, --</li><li>+, -(左关联)</li><li>=(右关联)</li><li>逗号表达式 ,</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/event-loop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>事件循环</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/mutationObserver.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>MutationObserver</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/mutationObserver.html b/notes/javascript/mutationObserver.html
index a1a3190..172a7a5 100644
--- a/notes/javascript/mutationObserver.html
+++ b/notes/javascript/mutationObserver.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>MutationObserver | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/mutationObserver.a5873c86.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_mutationObserver.md.a535a188.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/chunks/mutationObserver.46371927.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_mutationObserver.md.1d6ee92e.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_mutationObserver" data-v-6b87e69f><div><h1 id="mutationobserver" tabindex="-1">MutationObserver <a class="header-anchor" href="#mutationobserver" aria-label="Permalink to &quot;MutationObserver&quot;">​</a></h1><h2 id="概念" tabindex="-1">概念 <a class="header-anchor" href="#概念" aria-label="Permalink to &quot;概念&quot;">​</a></h2><blockquote><p>当 DOM 变化时，可以异步执行回调监听 DOM 的变化 监听范围：document, dom subtree, single element, attributes, childNodes, textNode</p></blockquote><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><img src="/learning-docs2/assets/images/mutationObserver.png" alt="mutaion observer browser compatible"><h2 id="用法" tabindex="-1">用法 <a class="header-anchor" href="#用法" aria-label="Permalink to &quot;用法&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;DOM was mutated!&#39;</span><span style="color:#E1E4E8;">));</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> observer </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">MutationObserver</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;DOM was mutated!&#39;</span><span style="color:#24292E;">));</span></span></code></pre></div><h2 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><p>api 介绍</p><h3 id="observe-方法" tabindex="-1">observe 方法 <a class="header-anchor" href="#observe-方法" aria-label="Permalink to &quot;observe 方法&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_mutationObserver" data-v-6b87e69f><div><h1 id="mutationobserver" tabindex="-1">MutationObserver <a class="header-anchor" href="#mutationobserver" aria-label="Permalink to &quot;MutationObserver&quot;">​</a></h1><h2 id="概念" tabindex="-1">概念 <a class="header-anchor" href="#概念" aria-label="Permalink to &quot;概念&quot;">​</a></h2><blockquote><p>当 DOM 变化时，可以异步执行回调监听 DOM 的变化 监听范围：document, dom subtree, single element, attributes, childNodes, textNode</p></blockquote><h2 id="兼容性" tabindex="-1">兼容性 <a class="header-anchor" href="#兼容性" aria-label="Permalink to &quot;兼容性&quot;">​</a></h2><img src="/assets/images/mutationObserver.png" alt="mutaion observer browser compatible"><h2 id="用法" tabindex="-1">用法 <a class="header-anchor" href="#用法" aria-label="Permalink to &quot;用法&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;DOM was mutated!&#39;</span><span style="color:#E1E4E8;">));</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> observer </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">MutationObserver</span><span style="color:#24292E;">(() </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(</span><span style="color:#032F62;">&#39;DOM was mutated!&#39;</span><span style="color:#24292E;">));</span></span></code></pre></div><h2 id="api" tabindex="-1">API <a class="header-anchor" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><p>api 介绍</p><h3 id="observe-方法" tabindex="-1">observe 方法 <a class="header-anchor" href="#observe-方法" aria-label="Permalink to &quot;observe 方法&quot;">​</a></h3><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">let</span><span style="color:#E1E4E8;"> observer </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">MutationObserver</span><span style="color:#E1E4E8;">(() </span><span style="color:#F97583;">=&gt;</span><span style="color:#E1E4E8;"> {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(</span><span style="color:#9ECBFF;">&#39;document has changed!!!&#39;</span><span style="color:#E1E4E8;">);</span></span>
 <span class="line"><span style="color:#E1E4E8;">});</span></span>
 <span class="line"><span style="color:#E1E4E8;">observer.</span><span style="color:#B392F0;">observe</span><span style="color:#E1E4E8;">(document.body, { attributes: </span><span style="color:#79B8FF;">true</span><span style="color:#E1E4E8;"> });</span></span>
@@ -232,8 +232,8 @@
 <span class="line"><span style="color:#24292E;">    characterData: </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">,</span></span>
 <span class="line"><span style="color:#24292E;">    characterDataOldValue: </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">,</span></span>
 <span class="line"><span style="color:#24292E;">    childList: </span><span style="color:#005CC5;">false</span><span style="color:#24292E;">,</span></span>
-<span class="line"><span style="color:#24292E;">})</span></span></code></pre></div><p><code>参数属性介绍</code></p><ul><li><p>subtree</p><p>默认为 false，如果为 false，只监听目标元素的改变，如果为 true，目标元素以及整个结点子树都将被监听改变</p></li><li><p>attributes</p><p>节点的属性改变时，默认为 false</p></li><li><p>attributeFilter</p><p>过滤那些节点的属性不被监听改变，默认观察为所有属性</p></li><li><p>attributeOldValue</p><p>返回属性改变的上一个值，默认为 false</p></li><li><p>characterData</p><p>监听节点的字符数据改变 =&gt; text 文本 comnent 注释 nodes 节点，默认为 false</p></li><li><p>characterDataOldValue</p><p>返回字符数据改变的上一个字符，默认为 false</p></li><li><p>childList</p><p>监听目标节点的子节点的变化，默认为 false</p></li></ul><h3 id="mutationobserver-设计规范" tabindex="-1">MutationObserver 设计规范 <a class="header-anchor" href="#mutationobserver-设计规范" aria-label="Permalink to &quot;MutationObserver 设计规范&quot;">​</a></h3><blockquote><p>规范是为性能而设计的，其设计的核心是异步回调和记录队列模型。为了允许在不降低性能的情况下注册大量的突变，每个合格的突变(由观察者实例决定)的信息被捕获到一个MutationRecord中，然后被记录到一个记录队列中。这个队列对于每个MutationObserver实例是惟一的，它表示每个DOM突变的有序记录。</p></blockquote><h4 id="异步回调和记录队列" tabindex="-1">异步回调和记录队列 <a class="header-anchor" href="#异步回调和记录队列" aria-label="Permalink to &quot;异步回调和记录队列&quot;">​</a></h4><blockquote><p>每次MutationRecord被添加到MutationObserver的记录队列时，观察者回调(最初提供给MutationObserver构造函数)只有在没有已经调度的回调微任务时才被调度为微任务，例如队列长度为&gt; 0。这确保记录队列的内容没有双重回调处理。</p></blockquote><blockquote><p>有可能，在回调的微任务异步执行时，发生的变化比最初计划回调微任务的变化更多。当MutationRecord实例出现在记录队列中时，会向被调用的回调传递一个数组。回调函数负责完整地处理数组中的每个实例，因为它们不会在函数之后持久存在退出。在回调执行之后，预期不再需要每个MutationRecord，因此记录队列被清空，其内容被丢弃</p></blockquote><h4 id="takerecords-方法" tabindex="-1">takeRecords() 方法 <a class="header-anchor" href="#takerecords-方法" aria-label="Permalink to &quot;takeRecords() 方法&quot;">​</a></h4><blockquote><p>使用takeRecords()方法来耗尽MutationObserver实例的记录队列。这将返回队列中存在的MutationRecord实例数组，并清空队列本身</p></blockquote><blockquote><p>当你想调用disconnect()时，又想处理没有结束（pending状态）的mutaion records 实例时，调用takeRecords()方法，这就达到了关闭的效果</p></blockquote><h4 id="性能分析" tabindex="-1">性能分析 <a class="header-anchor" href="#性能分析" aria-label="Permalink to &quot;性能分析&quot;">​</a></h4><blockquote><p>将突变回调的执行委托给一个微任务，可以确保避免事件的同步性和随事件而来的混乱。MutationObserver规范的记录队列实现确保即使是大量的突变事件也不会阻塞浏览器。</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/jsop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>运算符</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/prototype.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>原型 原型链</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">})</span></span></code></pre></div><p><code>参数属性介绍</code></p><ul><li><p>subtree</p><p>默认为 false，如果为 false，只监听目标元素的改变，如果为 true，目标元素以及整个结点子树都将被监听改变</p></li><li><p>attributes</p><p>节点的属性改变时，默认为 false</p></li><li><p>attributeFilter</p><p>过滤那些节点的属性不被监听改变，默认观察为所有属性</p></li><li><p>attributeOldValue</p><p>返回属性改变的上一个值，默认为 false</p></li><li><p>characterData</p><p>监听节点的字符数据改变 =&gt; text 文本 comnent 注释 nodes 节点，默认为 false</p></li><li><p>characterDataOldValue</p><p>返回字符数据改变的上一个字符，默认为 false</p></li><li><p>childList</p><p>监听目标节点的子节点的变化，默认为 false</p></li></ul><h3 id="mutationobserver-设计规范" tabindex="-1">MutationObserver 设计规范 <a class="header-anchor" href="#mutationobserver-设计规范" aria-label="Permalink to &quot;MutationObserver 设计规范&quot;">​</a></h3><blockquote><p>规范是为性能而设计的，其设计的核心是异步回调和记录队列模型。为了允许在不降低性能的情况下注册大量的突变，每个合格的突变(由观察者实例决定)的信息被捕获到一个MutationRecord中，然后被记录到一个记录队列中。这个队列对于每个MutationObserver实例是惟一的，它表示每个DOM突变的有序记录。</p></blockquote><h4 id="异步回调和记录队列" tabindex="-1">异步回调和记录队列 <a class="header-anchor" href="#异步回调和记录队列" aria-label="Permalink to &quot;异步回调和记录队列&quot;">​</a></h4><blockquote><p>每次MutationRecord被添加到MutationObserver的记录队列时，观察者回调(最初提供给MutationObserver构造函数)只有在没有已经调度的回调微任务时才被调度为微任务，例如队列长度为&gt; 0。这确保记录队列的内容没有双重回调处理。</p></blockquote><blockquote><p>有可能，在回调的微任务异步执行时，发生的变化比最初计划回调微任务的变化更多。当MutationRecord实例出现在记录队列中时，会向被调用的回调传递一个数组。回调函数负责完整地处理数组中的每个实例，因为它们不会在函数之后持久存在退出。在回调执行之后，预期不再需要每个MutationRecord，因此记录队列被清空，其内容被丢弃</p></blockquote><h4 id="takerecords-方法" tabindex="-1">takeRecords() 方法 <a class="header-anchor" href="#takerecords-方法" aria-label="Permalink to &quot;takeRecords() 方法&quot;">​</a></h4><blockquote><p>使用takeRecords()方法来耗尽MutationObserver实例的记录队列。这将返回队列中存在的MutationRecord实例数组，并清空队列本身</p></blockquote><blockquote><p>当你想调用disconnect()时，又想处理没有结束（pending状态）的mutaion records 实例时，调用takeRecords()方法，这就达到了关闭的效果</p></blockquote><h4 id="性能分析" tabindex="-1">性能分析 <a class="header-anchor" href="#性能分析" aria-label="Permalink to &quot;性能分析&quot;">​</a></h4><blockquote><p>将突变回调的执行委托给一个微任务，可以确保避免事件的同步性和随事件而来的混乱。MutationObserver规范的记录队列实现确保即使是大量的突变事件也不会阻塞浏览器。</p></blockquote></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-07T02:13:23.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/jsop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>运算符</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/prototype.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>原型 原型链</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/prototype.html b/notes/javascript/prototype.html
index 7716859..3a983ce 100644
--- a/notes/javascript/prototype.html
+++ b/notes/javascript/prototype.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>原型 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_prototype.md.b24cb541.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_prototype.md.36c69f43.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_prototype" data-v-6b87e69f><div><h1 id="原型" tabindex="-1">原型 <a class="header-anchor" href="#原型" aria-label="Permalink to &quot;原型&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">Prototype</p><p>关于原型的学习记录</p></div><h2 id="创建一个对象" tabindex="-1">创建一个对象 <span class="VPBadge warn" data-v-9613cc9f><!--[-->FIRST<!--]--></span> <a class="header-anchor" href="#创建一个对象" aria-label="Permalink to &quot;创建一个对象 &lt;Badge text=&quot;FIRST&quot; type=&quot;warn&quot;/&gt;&quot;">​</a></h2><p><strong>1. 工厂模式</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">createObject</span><span style="color:#E1E4E8;">() {</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_prototype" data-v-6b87e69f><div><h1 id="原型" tabindex="-1">原型 <a class="header-anchor" href="#原型" aria-label="Permalink to &quot;原型&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">Prototype</p><p>关于原型的学习记录</p></div><h2 id="创建一个对象" tabindex="-1">创建一个对象 <span class="VPBadge warn" data-v-9613cc9f><!--[-->FIRST<!--]--></span> <a class="header-anchor" href="#创建一个对象" aria-label="Permalink to &quot;创建一个对象 &lt;Badge text=&quot;FIRST&quot; type=&quot;warn&quot;/&gt;&quot;">​</a></h2><p><strong>1. 工厂模式</strong></p><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">createObject</span><span style="color:#E1E4E8;">() {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> o </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">new</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">Object</span><span style="color:#E1E4E8;">();</span></span>
 <span class="line"><span style="color:#E1E4E8;">  o.name </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;Hello World&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#E1E4E8;">  o.</span><span style="color:#B392F0;">sayName</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {</span></span>
@@ -305,8 +305,8 @@
 <span class="line"></span>
 <span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> user </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">createInstance</span><span style="color:#24292E;">(User, </span><span style="color:#032F62;">&#39;hello&#39;</span><span style="color:#24292E;">);</span></span>
 <span class="line"><span style="color:#D73A49;">var</span><span style="color:#24292E;"> userWithProto </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">createInstanceWithProto</span><span style="color:#24292E;">(User, </span><span style="color:#032F62;">&#39;world&#39;</span><span style="color:#24292E;">)</span></span>
-<span class="line"><span style="color:#24292E;">user.name; </span><span style="color:#6A737D;">// hello</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>MutationObserver</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/scope.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>作用域</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">user.name; </span><span style="color:#6A737D;">// hello</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/mutationObserver.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>MutationObserver</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/scope.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>作用域</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/scope.html b/notes/javascript/scope.html
index 6b79b4a..26b1469 100644
--- a/notes/javascript/scope.html
+++ b/notes/javascript/scope.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>JS 作用域 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_scope.md.9b63d680.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_scope.md.be39322f.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_scope" data-v-6b87e69f><div><h1 id="js-作用域" tabindex="-1">JS 作用域 <a class="header-anchor" href="#js-作用域" aria-label="Permalink to &quot;JS 作用域&quot;">​</a></h1><p>JavaScript 动态（解释执行）语言，不是提前编译的，编译结果也不能在分布式系统上移植</p><h2 id="编译原理" tabindex="-1">编译原理 <a class="header-anchor" href="#编译原理" aria-label="Permalink to &quot;编译原理&quot;">​</a></h2><ol><li>分词/词法分析</li></ol><ul><li>词法最小单元（token） var, a, =, 1</li></ul><ol start="2"><li>解析/语法分析</li></ol><ul><li>解析成抽象语法树</li></ul><ol start="3"><li>代码生成</li></ol><ul><li>将 AST 转换位可执行代码</li></ul><blockquote><p>负责收据并维护所有声明的标识符（变量）的一系列查询，并有一定的规则来赋予这些标识符的访问权限</p></blockquote><h2 id="理解作用域" tabindex="-1">理解作用域 <a class="header-anchor" href="#理解作用域" aria-label="Permalink to &quot;理解作用域&quot;">​</a></h2><blockquote><p>程序中定义变量的区域，该位置决定了变量的生命周期 变量和函数的可访问范围，作用域控制着变量的可见性与生命周期</p></blockquote><h3 id="lhs-rhs" tabindex="-1">LHS RHS <a class="header-anchor" href="#lhs-rhs" aria-label="Permalink to &quot;LHS RHS&quot;">​</a></h3><p>赋值操作的左侧或右侧</p><ul><li>LHS(赋值操作的目标是谁)</li><li>RHS(谁是赋值操作的源头)</li></ul><h3 id="异常" tabindex="-1">异常 <a class="header-anchor" href="#异常" aria-label="Permalink to &quot;异常&quot;">​</a></h3><ul><li>查询到作用域，引用值 null 或 undefined，TypeError</li><li>未查询到作用域，ReferenceError</li></ul><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><ul><li>作用域是一套规则，用于确定在何处以及如何查找变量（标识符）</li><li>查找的目的是为了给变量赋值，就会使用 LHS 查询</li><li>获取变量的值，使用 RHS 查询</li><li>不成功的 RHS 引用会导致 ReferenceError 异常</li></ul><p><code>作用域链</code></p><blockquote><p>通过作用域来查找变量的链条称为作用域链</p></blockquote><ul><li>作用域链保证对执行环境有权访问（变量函数的有序访问）</li><li>指向变量对象 =&gt; 变量对象包含执行环境所有变量和函数的对象（当前执行上下文的变量对象）</li></ul><h2 id="词法作用域" tabindex="-1">词法作用域 <a class="header-anchor" href="#词法作用域" aria-label="Permalink to &quot;词法作用域&quot;">​</a></h2><blockquote><p>代码编译阶段就决定好，和函数如何调用的没关系 词法阶段的作用域(将变量和块作用域写在哪里决定的) 作用域是由代码中函数声明的位置来决定的，词法作用域是静态的作用域 通过词法作用域可以预测代码在执行过程中如何查找变量</p></blockquote><h3 id="闭包" tabindex="-1">闭包 <a class="header-anchor" href="#闭包" aria-label="Permalink to &quot;闭包&quot;">​</a></h3><blockquote><p>词法作用域规定，内部函数可以访问外部函数声明中的变量，当通过调用一个外部函数返回内部函数后，即使该外部函数执行结束了，但是内部函数引用外部函数的变量依然保存在内存中，把这些变量的集合成为闭包</p></blockquote><h3 id="查找作用域" tabindex="-1">查找作用域 <a class="header-anchor" href="#查找作用域" aria-label="Permalink to &quot;查找作用域&quot;">​</a></h3><ul><li>全局环境作用域</li><li>所执行的环境作用域</li></ul><blockquote><p>作用域查找会在找到第一个匹配的标识符停止（遮蔽效应） 作用域查找始终从运行时所处的最内部作用域开始，逐级向外或者向上进行，直到遇见第一个匹配的标识符为止</p></blockquote><h3 id="欺骗作用域" tabindex="-1">欺骗作用域 <a class="header-anchor" href="#欺骗作用域" aria-label="Permalink to &quot;欺骗作用域&quot;">​</a></h3><blockquote><p>eval with 会干扰作用域，降低性能</p></blockquote><h4 id="eval" tabindex="-1">eval <a class="header-anchor" href="#eval" aria-label="Permalink to &quot;eval&quot;">​</a></h4><p>接收一个字符串作为参数，可以执行字符串代码（动态生成的函数代码）</p><ul><li>严格模式中，eval 拥有自己的作用域，无法改变所在的作用域</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">foo</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">str</span><span style="color:#E1E4E8;">) {</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_scope" data-v-6b87e69f><div><h1 id="js-作用域" tabindex="-1">JS 作用域 <a class="header-anchor" href="#js-作用域" aria-label="Permalink to &quot;JS 作用域&quot;">​</a></h1><p>JavaScript 动态（解释执行）语言，不是提前编译的，编译结果也不能在分布式系统上移植</p><h2 id="编译原理" tabindex="-1">编译原理 <a class="header-anchor" href="#编译原理" aria-label="Permalink to &quot;编译原理&quot;">​</a></h2><ol><li>分词/词法分析</li></ol><ul><li>词法最小单元（token） var, a, =, 1</li></ul><ol start="2"><li>解析/语法分析</li></ol><ul><li>解析成抽象语法树</li></ul><ol start="3"><li>代码生成</li></ol><ul><li>将 AST 转换位可执行代码</li></ul><blockquote><p>负责收据并维护所有声明的标识符（变量）的一系列查询，并有一定的规则来赋予这些标识符的访问权限</p></blockquote><h2 id="理解作用域" tabindex="-1">理解作用域 <a class="header-anchor" href="#理解作用域" aria-label="Permalink to &quot;理解作用域&quot;">​</a></h2><blockquote><p>程序中定义变量的区域，该位置决定了变量的生命周期 变量和函数的可访问范围，作用域控制着变量的可见性与生命周期</p></blockquote><h3 id="lhs-rhs" tabindex="-1">LHS RHS <a class="header-anchor" href="#lhs-rhs" aria-label="Permalink to &quot;LHS RHS&quot;">​</a></h3><p>赋值操作的左侧或右侧</p><ul><li>LHS(赋值操作的目标是谁)</li><li>RHS(谁是赋值操作的源头)</li></ul><h3 id="异常" tabindex="-1">异常 <a class="header-anchor" href="#异常" aria-label="Permalink to &quot;异常&quot;">​</a></h3><ul><li>查询到作用域，引用值 null 或 undefined，TypeError</li><li>未查询到作用域，ReferenceError</li></ul><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><ul><li>作用域是一套规则，用于确定在何处以及如何查找变量（标识符）</li><li>查找的目的是为了给变量赋值，就会使用 LHS 查询</li><li>获取变量的值，使用 RHS 查询</li><li>不成功的 RHS 引用会导致 ReferenceError 异常</li></ul><p><code>作用域链</code></p><blockquote><p>通过作用域来查找变量的链条称为作用域链</p></blockquote><ul><li>作用域链保证对执行环境有权访问（变量函数的有序访问）</li><li>指向变量对象 =&gt; 变量对象包含执行环境所有变量和函数的对象（当前执行上下文的变量对象）</li></ul><h2 id="词法作用域" tabindex="-1">词法作用域 <a class="header-anchor" href="#词法作用域" aria-label="Permalink to &quot;词法作用域&quot;">​</a></h2><blockquote><p>代码编译阶段就决定好，和函数如何调用的没关系 词法阶段的作用域(将变量和块作用域写在哪里决定的) 作用域是由代码中函数声明的位置来决定的，词法作用域是静态的作用域 通过词法作用域可以预测代码在执行过程中如何查找变量</p></blockquote><h3 id="闭包" tabindex="-1">闭包 <a class="header-anchor" href="#闭包" aria-label="Permalink to &quot;闭包&quot;">​</a></h3><blockquote><p>词法作用域规定，内部函数可以访问外部函数声明中的变量，当通过调用一个外部函数返回内部函数后，即使该外部函数执行结束了，但是内部函数引用外部函数的变量依然保存在内存中，把这些变量的集合成为闭包</p></blockquote><h3 id="查找作用域" tabindex="-1">查找作用域 <a class="header-anchor" href="#查找作用域" aria-label="Permalink to &quot;查找作用域&quot;">​</a></h3><ul><li>全局环境作用域</li><li>所执行的环境作用域</li></ul><blockquote><p>作用域查找会在找到第一个匹配的标识符停止（遮蔽效应） 作用域查找始终从运行时所处的最内部作用域开始，逐级向外或者向上进行，直到遇见第一个匹配的标识符为止</p></blockquote><h3 id="欺骗作用域" tabindex="-1">欺骗作用域 <a class="header-anchor" href="#欺骗作用域" aria-label="Permalink to &quot;欺骗作用域&quot;">​</a></h3><blockquote><p>eval with 会干扰作用域，降低性能</p></blockquote><h4 id="eval" tabindex="-1">eval <a class="header-anchor" href="#eval" aria-label="Permalink to &quot;eval&quot;">​</a></h4><p>接收一个字符串作为参数，可以执行字符串代码（动态生成的函数代码）</p><ul><li>严格模式中，eval 拥有自己的作用域，无法改变所在的作用域</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">foo</span><span style="color:#E1E4E8;">(</span><span style="color:#FFAB70;">str</span><span style="color:#E1E4E8;">) {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#9ECBFF;">&#39;use strict&#39;</span><span style="color:#E1E4E8;">; </span><span style="color:#6A737D;">// 无法改变所在的作用域 输入 ReferenceError: a is not defined</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#B392F0;">eval</span><span style="color:#E1E4E8;">(str);</span></span>
 <span class="line"><span style="color:#E1E4E8;">  console.</span><span style="color:#B392F0;">log</span><span style="color:#E1E4E8;">(a); </span><span style="color:#6A737D;">// 改变了全局作用域 输出 1</span></span>
@@ -53,8 +53,8 @@
 <span class="line"><span style="color:#24292E;">  b: </span><span style="color:#005CC5;">1</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">};</span></span>
 <span class="line"><span style="color:#6F42C1;">foo</span><span style="color:#24292E;">(o2); </span><span style="color:#6A737D;">// o2.a = undefind</span></span>
-<span class="line"><span style="color:#24292E;">console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(a) </span><span style="color:#6A737D;">// 2 由于 o2 对象中没有 a 属性，导致 with 作用域中 a = 2 改变了全局作用域</span></span></code></pre></div><h4 id="性能" tabindex="-1">性能 <a class="header-anchor" href="#性能" aria-label="Permalink to &quot;性能&quot;">​</a></h4><blockquote><p>JavaScript 在编译阶段会进行性能优化（代码的词法进行静态分析、预先确定所有变量和函数的位置），而 eval 和 with 会导致标识符的位置是无效的，从而导致性能降低</p></blockquote><div class="warning custom-block"><p class="custom-block-title">注意</p><p>在严格模式中，eval(警告 unsafe-eval)，with 无法使用</p></div><h3 id="全局作用域" tabindex="-1">全局作用域 <a class="header-anchor" href="#全局作用域" aria-label="Permalink to &quot;全局作用域&quot;">​</a></h3><h3 id="函数作用域" tabindex="-1">函数作用域 <a class="header-anchor" href="#函数作用域" aria-label="Permalink to &quot;函数作用域&quot;">​</a></h3><h3 id="块级作用域" tabindex="-1">块级作用域 <a class="header-anchor" href="#块级作用域" aria-label="Permalink to &quot;块级作用域&quot;">​</a></h3><p>块级作用域是通过词法环境的栈结构实现的，而变量提升是通过变量环境来实现，两者结合就实现了JavaScript的变量提升和块级作用域</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/prototype.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>原型 原型链</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>存储结构</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">console.</span><span style="color:#6F42C1;">log</span><span style="color:#24292E;">(a) </span><span style="color:#6A737D;">// 2 由于 o2 对象中没有 a 属性，导致 with 作用域中 a = 2 改变了全局作用域</span></span></code></pre></div><h4 id="性能" tabindex="-1">性能 <a class="header-anchor" href="#性能" aria-label="Permalink to &quot;性能&quot;">​</a></h4><blockquote><p>JavaScript 在编译阶段会进行性能优化（代码的词法进行静态分析、预先确定所有变量和函数的位置），而 eval 和 with 会导致标识符的位置是无效的，从而导致性能降低</p></blockquote><div class="warning custom-block"><p class="custom-block-title">注意</p><p>在严格模式中，eval(警告 unsafe-eval)，with 无法使用</p></div><h3 id="全局作用域" tabindex="-1">全局作用域 <a class="header-anchor" href="#全局作用域" aria-label="Permalink to &quot;全局作用域&quot;">​</a></h3><h3 id="函数作用域" tabindex="-1">函数作用域 <a class="header-anchor" href="#函数作用域" aria-label="Permalink to &quot;函数作用域&quot;">​</a></h3><h3 id="块级作用域" tabindex="-1">块级作用域 <a class="header-anchor" href="#块级作用域" aria-label="Permalink to &quot;块级作用域&quot;">​</a></h3><p>块级作用域是通过词法环境的栈结构实现的，而变量提升是通过变量环境来实现，两者结合就实现了JavaScript的变量提升和块级作用域</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/prototype.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>原型 原型链</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/storage-struct.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>存储结构</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/storage-struct.html b/notes/javascript/storage-struct.html
index 58b96a0..4872473 100644
--- a/notes/javascript/storage-struct.html
+++ b/notes/javascript/storage-struct.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>JS 的存储结构 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_storage-struct.md.43266820.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_storage-struct.md.0cab0c00.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_storage-struct" data-v-6b87e69f><div><h1 id="js-的存储结构" tabindex="-1">JS 的存储结构 <a class="header-anchor" href="#js-的存储结构" aria-label="Permalink to &quot;JS 的存储结构&quot;">​</a></h1><h2 id="栈结构" tabindex="-1">栈结构 <a class="header-anchor" href="#栈结构" aria-label="Permalink to &quot;栈结构&quot;">​</a></h2><h3 id="调用栈" tabindex="-1">调用栈 <a class="header-anchor" href="#调用栈" aria-label="Permalink to &quot;调用栈&quot;">​</a></h3><blockquote><p>管理函数调用的关系的一种数据结构</p></blockquote><h3 id="函数调用" tabindex="-1">函数调用 <a class="header-anchor" href="#函数调用" aria-label="Permalink to &quot;函数调用&quot;">​</a></h3><blockquote><p>运行一个函数，函数名称跟着一对小括号执行</p></blockquote><h3 id="栈" tabindex="-1">栈 <a class="header-anchor" href="#栈" aria-label="Permalink to &quot;栈&quot;">​</a></h3><blockquote><p>一种数据结构，后进先出</p></blockquote><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><blockquote><p>在执行上下文创建以后，JavaScript 引擎会将执行上下文压入栈中，把这种管理执行上下文称为执行上下文栈，即调用栈 函数执行完毕之后，JavaScript 引擎会将函数的上下文出栈</p></blockquote><h3 id="栈溢出" tabindex="-1">栈溢出 <a class="header-anchor" href="#栈溢出" aria-label="Permalink to &quot;栈溢出&quot;">​</a></h3><blockquote><p>调用栈是有大小的（容量限制），超过一定数目，就会栈溢出</p></blockquote><h2 id="内存空间" tabindex="-1">内存空间 <a class="header-anchor" href="#内存空间" aria-label="Permalink to &quot;内存空间&quot;">​</a></h2><p>代码空间、栈空间、堆空间</p><blockquote><p>基本原始类型</p></blockquote><p>Number, String, Boolean, Undefined, Null, Symbol, BigInt(存放安全数据，超出范围安全处理)</p><blockquote><p>引用类型</p></blockquote><p>Object</p><h3 id="代码空间" tabindex="-1">代码空间 <a class="header-anchor" href="#代码空间" aria-label="Permalink to &quot;代码空间&quot;">​</a></h3><p>存放可执行代码</p><h3 id="栈空间" tabindex="-1">栈空间 <a class="header-anchor" href="#栈空间" aria-label="Permalink to &quot;栈空间&quot;">​</a></h3><p>基本原始类型数据存放与栈空间中（调用栈）</p><h3 id="堆空间" tabindex="-1">堆空间 <a class="header-anchor" href="#堆空间" aria-label="Permalink to &quot;堆空间&quot;">​</a></h3><p>引用类型存放与堆空间中（存放的是引用地址）</p><h2 id="js-内存管理-变量分配" tabindex="-1">JS 内存管理 变量分配 <a class="header-anchor" href="#js-内存管理-变量分配" aria-label="Permalink to &quot;JS 内存管理 变量分配&quot;">​</a></h2><h3 id="静态区" tabindex="-1">静态区 <a class="header-anchor" href="#静态区" aria-label="Permalink to &quot;静态区&quot;">​</a></h3><ul><li>存放全局变量（基本类型）</li></ul><h3 id="调用栈-1" tabindex="-1">调用栈 <a class="header-anchor" href="#调用栈-1" aria-label="Permalink to &quot;调用栈&quot;">​</a></h3><ul><li>栈中执行上下文（作用域链 = 变量对象、this 指向环境）</li><li>只能读写自己栈帧的内存</li><li>调用栈调用结束自然销毁，实时性高</li></ul><h3 id="堆" tabindex="-1">堆 <a class="header-anchor" href="#堆" aria-label="Permalink to &quot;堆&quot;">​</a></h3><ul><li>对象、数组、函数（引用类型）</li><li>动态的读写</li><li>不具备很高的实时性，由单独的 gc 线程控制</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/scope.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>作用域</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/this.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>This 作用域</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_storage-struct" data-v-6b87e69f><div><h1 id="js-的存储结构" tabindex="-1">JS 的存储结构 <a class="header-anchor" href="#js-的存储结构" aria-label="Permalink to &quot;JS 的存储结构&quot;">​</a></h1><h2 id="栈结构" tabindex="-1">栈结构 <a class="header-anchor" href="#栈结构" aria-label="Permalink to &quot;栈结构&quot;">​</a></h2><h3 id="调用栈" tabindex="-1">调用栈 <a class="header-anchor" href="#调用栈" aria-label="Permalink to &quot;调用栈&quot;">​</a></h3><blockquote><p>管理函数调用的关系的一种数据结构</p></blockquote><h3 id="函数调用" tabindex="-1">函数调用 <a class="header-anchor" href="#函数调用" aria-label="Permalink to &quot;函数调用&quot;">​</a></h3><blockquote><p>运行一个函数，函数名称跟着一对小括号执行</p></blockquote><h3 id="栈" tabindex="-1">栈 <a class="header-anchor" href="#栈" aria-label="Permalink to &quot;栈&quot;">​</a></h3><blockquote><p>一种数据结构，后进先出</p></blockquote><h3 id="总结" tabindex="-1">总结 <a class="header-anchor" href="#总结" aria-label="Permalink to &quot;总结&quot;">​</a></h3><blockquote><p>在执行上下文创建以后，JavaScript 引擎会将执行上下文压入栈中，把这种管理执行上下文称为执行上下文栈，即调用栈 函数执行完毕之后，JavaScript 引擎会将函数的上下文出栈</p></blockquote><h3 id="栈溢出" tabindex="-1">栈溢出 <a class="header-anchor" href="#栈溢出" aria-label="Permalink to &quot;栈溢出&quot;">​</a></h3><blockquote><p>调用栈是有大小的（容量限制），超过一定数目，就会栈溢出</p></blockquote><h2 id="内存空间" tabindex="-1">内存空间 <a class="header-anchor" href="#内存空间" aria-label="Permalink to &quot;内存空间&quot;">​</a></h2><p>代码空间、栈空间、堆空间</p><blockquote><p>基本原始类型</p></blockquote><p>Number, String, Boolean, Undefined, Null, Symbol, BigInt(存放安全数据，超出范围安全处理)</p><blockquote><p>引用类型</p></blockquote><p>Object</p><h3 id="代码空间" tabindex="-1">代码空间 <a class="header-anchor" href="#代码空间" aria-label="Permalink to &quot;代码空间&quot;">​</a></h3><p>存放可执行代码</p><h3 id="栈空间" tabindex="-1">栈空间 <a class="header-anchor" href="#栈空间" aria-label="Permalink to &quot;栈空间&quot;">​</a></h3><p>基本原始类型数据存放与栈空间中（调用栈）</p><h3 id="堆空间" tabindex="-1">堆空间 <a class="header-anchor" href="#堆空间" aria-label="Permalink to &quot;堆空间&quot;">​</a></h3><p>引用类型存放与堆空间中（存放的是引用地址）</p><h2 id="js-内存管理-变量分配" tabindex="-1">JS 内存管理 变量分配 <a class="header-anchor" href="#js-内存管理-变量分配" aria-label="Permalink to &quot;JS 内存管理 变量分配&quot;">​</a></h2><h3 id="静态区" tabindex="-1">静态区 <a class="header-anchor" href="#静态区" aria-label="Permalink to &quot;静态区&quot;">​</a></h3><ul><li>存放全局变量（基本类型）</li></ul><h3 id="调用栈-1" tabindex="-1">调用栈 <a class="header-anchor" href="#调用栈-1" aria-label="Permalink to &quot;调用栈&quot;">​</a></h3><ul><li>栈中执行上下文（作用域链 = 变量对象、this 指向环境）</li><li>只能读写自己栈帧的内存</li><li>调用栈调用结束自然销毁，实时性高</li></ul><h3 id="堆" tabindex="-1">堆 <a class="header-anchor" href="#堆" aria-label="Permalink to &quot;堆&quot;">​</a></h3><ul><li>对象、数组、函数（引用类型）</li><li>动态的读写</li><li>不具备很高的实时性，由单独的 gc 线程控制</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/scope.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>作用域</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/this.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>This 作用域</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/javascript/this.html b/notes/javascript/this.html
index 6df4c06..be623fb 100644
--- a/notes/javascript/this.html
+++ b/notes/javascript/this.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>关于 this | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_javascript_this.md.532a6f9a.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_javascript_this.md.e080543e.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_javascript_this" data-v-6b87e69f><div><h1 id="关于-this" tabindex="-1">关于 this <a class="header-anchor" href="#关于-this" aria-label="Permalink to &quot;关于 this&quot;">​</a></h1><blockquote><p>this 提供一种优雅的方式来隐式传递一个对象的引用（自动引用合适的上下文对象）</p></blockquote><div class="tip custom-block"><p class="custom-block-title">this</p><p>this 的绑定和函数声明的位置没有任何关系，只取决函数的调用方式（当一个函数调用时，会创建一个活动记录 or 执行上下文, 这个记录会包含函数在哪里被调用、函数的调用、函数的参数等信息；this 就是记录其中的一个属性，会在函数执行的过程中调用）</p></div><h2 id="误解" tabindex="-1">误解 <a class="header-anchor" href="#误解" aria-label="Permalink to &quot;误解&quot;">​</a></h2><ul><li>❎ 指向函数（所有 JavaScript 函数都可以看成对象）本身</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 具名函数</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_javascript_this" data-v-6b87e69f><div><h1 id="关于-this" tabindex="-1">关于 this <a class="header-anchor" href="#关于-this" aria-label="Permalink to &quot;关于 this&quot;">​</a></h1><blockquote><p>this 提供一种优雅的方式来隐式传递一个对象的引用（自动引用合适的上下文对象）</p></blockquote><div class="tip custom-block"><p class="custom-block-title">this</p><p>this 的绑定和函数声明的位置没有任何关系，只取决函数的调用方式（当一个函数调用时，会创建一个活动记录 or 执行上下文, 这个记录会包含函数在哪里被调用、函数的调用、函数的参数等信息；this 就是记录其中的一个属性，会在函数执行的过程中调用）</p></div><h2 id="误解" tabindex="-1">误解 <a class="header-anchor" href="#误解" aria-label="Permalink to &quot;误解&quot;">​</a></h2><ul><li>❎ 指向函数（所有 JavaScript 函数都可以看成对象）本身</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 具名函数</span></span>
 <span class="line"><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">foo</span><span style="color:#E1E4E8;">() {</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#6A737D;">// 不可行</span></span>
 <span class="line"><span style="color:#E1E4E8;">  </span><span style="color:#79B8FF;">this</span><span style="color:#E1E4E8;">.count</span><span style="color:#F97583;">++</span><span style="color:#E1E4E8;">;</span></span>
@@ -237,8 +237,8 @@
 <span class="line"><span style="color:#24292E;">    </span><span style="color:#005CC5;">bound</span><span style="color:#24292E;">.</span><span style="color:#005CC5;">prototype</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> Object.</span><span style="color:#6F42C1;">create</span><span style="color:#24292E;">(</span><span style="color:#005CC5;">fn</span><span style="color:#24292E;">.</span><span style="color:#005CC5;">prototype</span><span style="color:#24292E;">);</span></span>
 <span class="line"><span style="color:#24292E;">    </span><span style="color:#D73A49;">return</span><span style="color:#24292E;"> bound;</span></span>
 <span class="line"><span style="color:#24292E;">  };</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h3 id="es6-箭头函数" tabindex="-1">es6 箭头函数 <a class="header-anchor" href="#es6-箭头函数" aria-label="Permalink to &quot;es6 箭头函数&quot;">​</a></h3><ul><li>不适用以上绑定方式（无效）</li><li>箭头函数会继承外层函数调用的 this 绑定（外层函数或全局作用域）</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>存储结构</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/javascript/URI.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>编码</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div><h3 id="es6-箭头函数" tabindex="-1">es6 箭头函数 <a class="header-anchor" href="#es6-箭头函数" aria-label="Permalink to &quot;es6 箭头函数&quot;">​</a></h3><ul><li>不适用以上绑定方式（无效）</li><li>箭头函数会继承外层函数调用的 this 绑定（外层函数或全局作用域）</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/storage-struct.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>存储结构</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/javascript/URI.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>编码</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/nodejs/ansi.html b/notes/nodejs/ansi.html
index 1d5a9d0..3b9f8d3 100644
--- a/notes/nodejs/ansi.html
+++ b/notes/nodejs/ansi.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>ANSI escape sequences | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_nodejs_ansi.md.b4c1b09e.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_nodejs_ansi.md.0e90e8a3.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_nodejs_ansi" data-v-6b87e69f><div><h1 id="ansi-escape-sequences" tabindex="-1">ANSI escape sequences <a class="header-anchor" href="#ansi-escape-sequences" aria-label="Permalink to &quot;ANSI escape sequences&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">C0 C1</p><p>C0 与 C1 是 ISO/IEC 2022 定义的控制字符集，C0 控制字符集的码位范围是 hex00-1F，C1 控制字符集的码位范围是 hex80-9F</p></div><p>ANSI 转义序列</p><h2 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h2><p>一种带内信号的转义序列标准，用于控制视频文本终端上的的光标位置、颜色和其他选项</p><h2 id="转义序列" tabindex="-1">转义序列 <a class="header-anchor" href="#转义序列" aria-label="Permalink to &quot;转义序列&quot;">​</a></h2><p>所有序列都以 ASCII 字符 ESC（27/十六进制 0x1b）开头，第二个字节则是 0x40-0x5F（ASCII @A-Z[\]^_）范围内的字符</p><blockquote><p>除 ESC 之外的其他 C0 代码</p></blockquote><ul><li>BEL</li><li>BS</li><li>CR</li><li>LF</li><li>FF</li><li>TAB</li><li>VT</li><li>SO</li><li>SI</li></ul><h2 id="csi-序列" tabindex="-1">CSI 序列 <a class="header-anchor" href="#csi-序列" aria-label="Permalink to &quot;CSI 序列&quot;">​</a></h2><p>CSI 序列由 <code>ESC [</code>、若干个（包括 0 个）参数字节、若干个中间字节，以及一个最终字节组成</p><blockquote><p>CSI 序列在 <code>ESC [</code>之后各个组成部分的字符范围</p></blockquote><table><thead><tr><th>组成部分</th><th>字符范围</th><th>ASCII</th></tr></thead><tbody><tr><td>参数字节</td><td>0x30–0x3F</td><td>0–9:;&lt;=&gt;?</td></tr><tr><td>中间字节</td><td>0x20–0x2F</td><td>空格、!&quot;#$%&amp;&#39;()*+,-./</td></tr><tr><td>最终字节</td><td>0x40–0x7E</td><td>@A–Z[]^_`a–z{</td></tr></tbody></table><blockquote><p>部分 ANSI 控制序列</p></blockquote><table><thead><tr><th>代码</th><th>名称</th><th>作用</th></tr></thead><tbody><tr><td>CSI n A</td><td>光标上移</td><td>光标向指定的方向移动 n 格，光标在屏幕边缘，无效</td></tr><tr><td>CSI n B</td><td>光标下移</td><td></td></tr><tr><td>CSI n C</td><td>光标前移</td><td></td></tr><tr><td>CSI n D</td><td>光标后移</td><td></td></tr><tr><td>CSI n E</td><td>光标移到下一行</td><td>光标移动到下面第 n（默认 1）行的开头</td></tr><tr><td>CSI n F</td><td>光标移到上一行</td><td>光标移动到上面第 n（默认 1）行的开头</td></tr><tr><td>CSI n G</td><td>光标后移</td><td>光标移动到第 n（默认 1）列</td></tr><tr><td>CSI n;m H</td><td>光标位置</td><td>光标移动到第 n 行、第 m 列。值从 1 开始，且默认为 1（左上角）</td></tr><tr><td>CSI n J</td><td>擦除显示</td><td>清除屏幕的部分区域（取值 0 1 2）</td></tr><tr><td>CSI n K</td><td>擦除行</td><td>清除行内的部分区域（取值 0 1 2）</td></tr><tr><td>CSI n S</td><td>向上滚动</td><td>整页向上滚动 n（默认 1）行</td></tr><tr><td>CSI n T</td><td>向下滚动</td><td>整页向下滚动 n（默认 1）行</td></tr><tr><td>CSI n m</td><td>SGR - 选择图形再现</td><td>设置 SGR 参数，包括文字颜色（CSI 0m 重置/常规）</td></tr></tbody></table><h1 id="更多" tabindex="-1">更多 <a class="header-anchor" href="#更多" aria-label="Permalink to &quot;更多&quot;">​</a></h1><p><a href="https://gist.github.com/fnky/458719343aabd01cfb17a3a4f7296797" target="_blank" rel="noreferrer">更多阅读</a></p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-04-27T13:03:10.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/es/es6.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ES6+</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>事件循环</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_nodejs_ansi" data-v-6b87e69f><div><h1 id="ansi-escape-sequences" tabindex="-1">ANSI escape sequences <a class="header-anchor" href="#ansi-escape-sequences" aria-label="Permalink to &quot;ANSI escape sequences&quot;">​</a></h1><div class="tip custom-block"><p class="custom-block-title">C0 C1</p><p>C0 与 C1 是 ISO/IEC 2022 定义的控制字符集，C0 控制字符集的码位范围是 hex00-1F，C1 控制字符集的码位范围是 hex80-9F</p></div><p>ANSI 转义序列</p><h2 id="定义" tabindex="-1">定义 <a class="header-anchor" href="#定义" aria-label="Permalink to &quot;定义&quot;">​</a></h2><p>一种带内信号的转义序列标准，用于控制视频文本终端上的的光标位置、颜色和其他选项</p><h2 id="转义序列" tabindex="-1">转义序列 <a class="header-anchor" href="#转义序列" aria-label="Permalink to &quot;转义序列&quot;">​</a></h2><p>所有序列都以 ASCII 字符 ESC（27/十六进制 0x1b）开头，第二个字节则是 0x40-0x5F（ASCII @A-Z[\]^_）范围内的字符</p><blockquote><p>除 ESC 之外的其他 C0 代码</p></blockquote><ul><li>BEL</li><li>BS</li><li>CR</li><li>LF</li><li>FF</li><li>TAB</li><li>VT</li><li>SO</li><li>SI</li></ul><h2 id="csi-序列" tabindex="-1">CSI 序列 <a class="header-anchor" href="#csi-序列" aria-label="Permalink to &quot;CSI 序列&quot;">​</a></h2><p>CSI 序列由 <code>ESC [</code>、若干个（包括 0 个）参数字节、若干个中间字节，以及一个最终字节组成</p><blockquote><p>CSI 序列在 <code>ESC [</code>之后各个组成部分的字符范围</p></blockquote><table><thead><tr><th>组成部分</th><th>字符范围</th><th>ASCII</th></tr></thead><tbody><tr><td>参数字节</td><td>0x30–0x3F</td><td>0–9:;&lt;=&gt;?</td></tr><tr><td>中间字节</td><td>0x20–0x2F</td><td>空格、!&quot;#$%&amp;&#39;()*+,-./</td></tr><tr><td>最终字节</td><td>0x40–0x7E</td><td>@A–Z[]^_`a–z{</td></tr></tbody></table><blockquote><p>部分 ANSI 控制序列</p></blockquote><table><thead><tr><th>代码</th><th>名称</th><th>作用</th></tr></thead><tbody><tr><td>CSI n A</td><td>光标上移</td><td>光标向指定的方向移动 n 格，光标在屏幕边缘，无效</td></tr><tr><td>CSI n B</td><td>光标下移</td><td></td></tr><tr><td>CSI n C</td><td>光标前移</td><td></td></tr><tr><td>CSI n D</td><td>光标后移</td><td></td></tr><tr><td>CSI n E</td><td>光标移到下一行</td><td>光标移动到下面第 n（默认 1）行的开头</td></tr><tr><td>CSI n F</td><td>光标移到上一行</td><td>光标移动到上面第 n（默认 1）行的开头</td></tr><tr><td>CSI n G</td><td>光标后移</td><td>光标移动到第 n（默认 1）列</td></tr><tr><td>CSI n;m H</td><td>光标位置</td><td>光标移动到第 n 行、第 m 列。值从 1 开始，且默认为 1（左上角）</td></tr><tr><td>CSI n J</td><td>擦除显示</td><td>清除屏幕的部分区域（取值 0 1 2）</td></tr><tr><td>CSI n K</td><td>擦除行</td><td>清除行内的部分区域（取值 0 1 2）</td></tr><tr><td>CSI n S</td><td>向上滚动</td><td>整页向上滚动 n（默认 1）行</td></tr><tr><td>CSI n T</td><td>向下滚动</td><td>整页向下滚动 n（默认 1）行</td></tr><tr><td>CSI n m</td><td>SGR - 选择图形再现</td><td>设置 SGR 参数，包括文字颜色（CSI 0m 重置/常规）</td></tr></tbody></table><h1 id="更多" tabindex="-1">更多 <a class="header-anchor" href="#更多" aria-label="Permalink to &quot;更多&quot;">​</a></h1><p><a href="https://gist.github.com/fnky/458719343aabd01cfb17a3a4f7296797" target="_blank" rel="noreferrer">更多阅读</a></p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-04-27T13:03:10.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/es/es6.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ES6+</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/nodejs/event-loop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>事件循环</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/nodejs/event-loop.html b/notes/nodejs/event-loop.html
index 41eea99..a124023 100644
--- a/notes/nodejs/event-loop.html
+++ b/notes/nodejs/event-loop.html
@@ -5,22 +5,22 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Nodejs 事件循环 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_nodejs_event-loop.md.95affbd8.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_nodejs_event-loop.md.f5078491.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_nodejs_event-loop" data-v-6b87e69f><div><h1 id="nodejs-事件循环" tabindex="-1">Nodejs 事件循环 <a class="header-anchor" href="#nodejs-事件循环" aria-label="Permalink to &quot;Nodejs 事件循环&quot;">​</a></h1><h2 id="理解" tabindex="-1">理解 <a class="header-anchor" href="#理解" aria-label="Permalink to &quot;理解&quot;">​</a></h2><h3 id="非阻塞-i-o-操作的设计机制" tabindex="-1">非阻塞 I/O 操作的设计机制 <a class="header-anchor" href="#非阻塞-i-o-操作的设计机制" aria-label="Permalink to &quot;非阻塞 I/O 操作的设计机制&quot;">​</a></h3><ul><li>Timer: 定时器运行 setTimeout setInterval</li><li>Pending Callback: 挂起的回调，执行延迟到下一个循环迭代的 I/O 回调(TCP 的错误处理延迟到这里执行)</li><li>Idle, Prepare: 仅在内部使用</li><li>Poll: 轮询，检索新的 I/O 事件，执行与 I/O 相关的回调（计时器和 setImmediated()调度之外） <ul><li>计算应该阻塞和轮询 I/O 的时间</li><li>处理轮询队列中的事件（没有被调度的计时器时） <ul><li>轮询队列为空 <ul><li>如果脚本被 setImmediate() 调度，则事件结束轮询阶段，并到 Check 阶段继续执行 setImmediate() 调度的脚本</li><li>未被 setImmediate() 调度，则事件循环将等待回调被添加到队列中，然后立即执行</li></ul></li><li>轮询队列不为空 <ul><li>事件循环将循环访问回调队列并执行他们，直到队列用尽，或者达到了与系统相关的硬性限制</li></ul></li></ul></li></ul></li><li>Check: setImmeidate 检查是否执行</li><li>Close Callback: 关闭的回调函数（socket.on(&#39;close))</li></ul><h3 id="process-nexttick-又是如何执行" tabindex="-1">process.nextTick 又是如何执行？ <a class="header-anchor" href="#process-nexttick-又是如何执行" aria-label="Permalink to &quot;process.nextTick 又是如何执行？&quot;">​</a></h3><ul><li>异步 API</li></ul><blockquote><p>任何时候再给定的阶段中调用 process.nextTick()，所以传递到 process.nextTick() 的回调将在事件循环继续之前解析。</p></blockquote><ul><li>造成任务饿死</li></ul><p>一直调用 process.nextTick() 从而导致事件循环无法到达轮询阶段（递归调用 process.nextTick() 不允许超过 V8 的最大调用堆栈大小）</p><div class="tip custom-block"><p class="custom-block-title">事件循环图</p><p>┌───────────────────────────┐ ┌─&gt;│ timers │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ │ │ pending callbacks │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ │ │ idle, prepare │ │ └─────────────┬─────────────┘ ┌───────────────┐ │ ┌─────────────┴─────────────┐ │ incoming: │ │ │ poll │&lt;─────┤ connections, │ │ └─────────────┬─────────────┘ │ data, etc. │ │ ┌─────────────┴─────────────┐ └───────────────┘ │ │ check │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ └──┤ close callbacks │ └───────────────────────────┘</p></div><h2 id="定时器-timers" tabindex="-1">定时器 timers <a class="header-anchor" href="#定时器-timers" aria-label="Permalink to &quot;定时器 timers&quot;">​</a></h2><p>本阶段执行已经被 setTimeout() 和 setInterval() 的调度回调函数</p><ul><li>执行所提供的回调的阈值，而不是用户希望其执行的确切时间（计时器回调尽可能早的运行，但是操作系统调度或其它正在运行的回调可能会存在延迟）</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 100ms !== 阈值</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_nodejs_event-loop" data-v-6b87e69f><div><h1 id="nodejs-事件循环" tabindex="-1">Nodejs 事件循环 <a class="header-anchor" href="#nodejs-事件循环" aria-label="Permalink to &quot;Nodejs 事件循环&quot;">​</a></h1><h2 id="理解" tabindex="-1">理解 <a class="header-anchor" href="#理解" aria-label="Permalink to &quot;理解&quot;">​</a></h2><h3 id="非阻塞-i-o-操作的设计机制" tabindex="-1">非阻塞 I/O 操作的设计机制 <a class="header-anchor" href="#非阻塞-i-o-操作的设计机制" aria-label="Permalink to &quot;非阻塞 I/O 操作的设计机制&quot;">​</a></h3><ul><li>Timer: 定时器运行 setTimeout setInterval</li><li>Pending Callback: 挂起的回调，执行延迟到下一个循环迭代的 I/O 回调(TCP 的错误处理延迟到这里执行)</li><li>Idle, Prepare: 仅在内部使用</li><li>Poll: 轮询，检索新的 I/O 事件，执行与 I/O 相关的回调（计时器和 setImmediated()调度之外） <ul><li>计算应该阻塞和轮询 I/O 的时间</li><li>处理轮询队列中的事件（没有被调度的计时器时） <ul><li>轮询队列为空 <ul><li>如果脚本被 setImmediate() 调度，则事件结束轮询阶段，并到 Check 阶段继续执行 setImmediate() 调度的脚本</li><li>未被 setImmediate() 调度，则事件循环将等待回调被添加到队列中，然后立即执行</li></ul></li><li>轮询队列不为空 <ul><li>事件循环将循环访问回调队列并执行他们，直到队列用尽，或者达到了与系统相关的硬性限制</li></ul></li></ul></li></ul></li><li>Check: setImmeidate 检查是否执行</li><li>Close Callback: 关闭的回调函数（socket.on(&#39;close))</li></ul><h3 id="process-nexttick-又是如何执行" tabindex="-1">process.nextTick 又是如何执行？ <a class="header-anchor" href="#process-nexttick-又是如何执行" aria-label="Permalink to &quot;process.nextTick 又是如何执行？&quot;">​</a></h3><ul><li>异步 API</li></ul><blockquote><p>任何时候再给定的阶段中调用 process.nextTick()，所以传递到 process.nextTick() 的回调将在事件循环继续之前解析。</p></blockquote><ul><li>造成任务饿死</li></ul><p>一直调用 process.nextTick() 从而导致事件循环无法到达轮询阶段（递归调用 process.nextTick() 不允许超过 V8 的最大调用堆栈大小）</p><div class="tip custom-block"><p class="custom-block-title">事件循环图</p><p>┌───────────────────────────┐ ┌─&gt;│ timers │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ │ │ pending callbacks │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ │ │ idle, prepare │ │ └─────────────┬─────────────┘ ┌───────────────┐ │ ┌─────────────┴─────────────┐ │ incoming: │ │ │ poll │&lt;─────┤ connections, │ │ └─────────────┬─────────────┘ │ data, etc. │ │ ┌─────────────┴─────────────┐ └───────────────┘ │ │ check │ │ └─────────────┬─────────────┘ │ ┌─────────────┴─────────────┐ └──┤ close callbacks │ └───────────────────────────┘</p></div><h2 id="定时器-timers" tabindex="-1">定时器 timers <a class="header-anchor" href="#定时器-timers" aria-label="Permalink to &quot;定时器 timers&quot;">​</a></h2><p>本阶段执行已经被 setTimeout() 和 setInterval() 的调度回调函数</p><ul><li>执行所提供的回调的阈值，而不是用户希望其执行的确切时间（计时器回调尽可能早的运行，但是操作系统调度或其它正在运行的回调可能会存在延迟）</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 100ms !== 阈值</span></span>
 <span class="line"><span style="color:#B392F0;">setTimeout</span><span style="color:#E1E4E8;">(</span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;">() {}, </span><span style="color:#79B8FF;">100</span><span style="color:#E1E4E8;">);</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// 100ms !== 阈值</span></span>
-<span class="line"><span style="color:#6F42C1;">setTimeout</span><span style="color:#24292E;">(</span><span style="color:#D73A49;">function</span><span style="color:#24292E;">() {}, </span><span style="color:#005CC5;">100</span><span style="color:#24292E;">);</span></span></code></pre></div><ul><li>轮询阶段控制何时定时器执行</li></ul><h2 id="待定的回调-pending-callbacks" tabindex="-1">待定的回调 pending callbacks <a class="header-anchor" href="#待定的回调-pending-callbacks" aria-label="Permalink to &quot;待定的回调 pending callbacks&quot;">​</a></h2><p>执行延迟到下一个循环迭代的 I/O 回调</p><ul><li>挂起的回调函数（持续连接 TCP 套接字在尝试连接时接收到 <code>ECONNREFUSED</code>)</li></ul><h2 id="idle-prepare" tabindex="-1">idle prepare <a class="header-anchor" href="#idle-prepare" aria-label="Permalink to &quot;idle prepare&quot;">​</a></h2><p>系统内部使用</p><h2 id="轮询-poll" tabindex="-1">轮询 poll <a class="header-anchor" href="#轮询-poll" aria-label="Permalink to &quot;轮询 poll&quot;">​</a></h2><p>检索新的 I/O 事件，执行与 I/O 相关的回调（几乎所有情况下，除了关闭的回调函数，计时器和 setImmediate() 调度的之外）其余情况 node 将在适当的时候阻塞</p><ul><li><p>计算应该阻塞和轮询 I/O 的时间</p></li><li><p>处理轮询队列里的事件</p><ul><li>轮询队列不为空，事件循环将循环访问回调队列并同步执行他们，直到队列为空，或者达到了与系统相关的硬性限制</li><li>轮询队列为空，如果脚本被 setImmediate() 调度，则事件循环将结束轮询阶段，并继续检查阶段以执行哪些被调度的脚本；如果脚本未被 setImmediate() 调度，则事件循环将等待回调被添加到队列中，然后立即执行</li></ul></li><li><p>一旦轮询队列为空，事件循环将检查已达到阈值的计时器，如果一个或多个计时器已准备就绪，则事件循环将绕回计时器阶段以执行计时器回调</p></li></ul><h2 id="检测-check" tabindex="-1">检测 check <a class="header-anchor" href="#检测-check" aria-label="Permalink to &quot;检测 check&quot;">​</a></h2><p>setImmediate() 回调函数在这里执行</p><ul><li>轮询阶段完成后立即执行回调，轮询阶段变为空闲状态，脚本使用 setImmediate() 后被排列在队列中，则事件循环可能继续到检查阶段而不是等待</li><li>setImmediate() 事件循环中的单独阶段运行的特殊及时器（libuv API 安排回调在轮询阶段完成后立即执行）</li></ul><h2 id="关闭的回调函数-close-callbacks" tabindex="-1">关闭的回调函数 close callbacks <a class="header-anchor" href="#关闭的回调函数-close-callbacks" aria-label="Permalink to &quot;关闭的回调函数 close callbacks&quot;">​</a></h2><p>一些关闭的回调函数 socket.o(&#39;close&#39;, ...)</p><ul><li>套接字或处理函数关闭（socket.destroy())，close 事件在这个阶段发出，否则（process.nextTick()) 发出</li></ul><h2 id="settimeout-vs-setimmediate" tabindex="-1">setTimeout() VS setImmediate() <a class="header-anchor" href="#settimeout-vs-setimmediate" aria-label="Permalink to &quot;setTimeout() VS setImmediate()&quot;">​</a></h2><ul><li>setImmediate() 一旦在当前轮询阶段完成，就执行脚本</li><li>setTimeout() 轮询阶段计算出来的阈值（ms）过后运行脚本</li></ul><ol><li>主模块中运行（非确定性）</li><li>运行在 I/O 循环内调用，setImmediate 总是被优先调用</li></ol><h2 id="process-nexttick" tabindex="-1">process.nextTick <a class="header-anchor" href="#process-nexttick" aria-label="Permalink to &quot;process.nextTick&quot;">​</a></h2><ul><li><p>不是事件循环的一部分，在当前操作完成后处理 nextTickQueue，<code>允许通过递归调用来阻止I/O，阻止事件到达轮询阶段</code></p></li><li><p>保证用户代码的其余部分之后在让事件循环继续进行之前，执行其回调函数</p></li><li><p>回调置于 process.nextTick() 中，脚本仍具有运行完成的能力，允许在调用回调之前初始化所有的变量、函数</p></li><li><p>不让事件循环继续的优点，适用于让事件循环继续之前，警告用户发生错误的情况</p></li></ul><h3 id="process-nexttick-vs-setimmediate" tabindex="-1">process.nextTick() VS setImmediate() <a class="header-anchor" href="#process-nexttick-vs-setimmediate" aria-label="Permalink to &quot;process.nextTick() VS setImmediate()&quot;">​</a></h3><ul><li>process.nextTick() 在同一个阶段立即执行</li><li>setImmeidate() 在事件循环的接下来的 tick 上触发</li></ul><h3 id="为什么使用-process-nexttick" tabindex="-1">为什么使用 process.nextTick() <a class="header-anchor" href="#为什么使用-process-nexttick" aria-label="Permalink to &quot;为什么使用 process.nextTick()&quot;">​</a></h3><ol><li>允许用户处理错误，清理任何不需要的资源，或者在事件循环继续之前重试请求</li><li>让回调在栈展开后，但在事件循环继续之前运行的必要</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-10-26T01:58:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/nodejs/ansi.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ANSI</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/nodejs/npm.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Npm</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6F42C1;">setTimeout</span><span style="color:#24292E;">(</span><span style="color:#D73A49;">function</span><span style="color:#24292E;">() {}, </span><span style="color:#005CC5;">100</span><span style="color:#24292E;">);</span></span></code></pre></div><ul><li>轮询阶段控制何时定时器执行</li></ul><h2 id="待定的回调-pending-callbacks" tabindex="-1">待定的回调 pending callbacks <a class="header-anchor" href="#待定的回调-pending-callbacks" aria-label="Permalink to &quot;待定的回调 pending callbacks&quot;">​</a></h2><p>执行延迟到下一个循环迭代的 I/O 回调</p><ul><li>挂起的回调函数（持续连接 TCP 套接字在尝试连接时接收到 <code>ECONNREFUSED</code>)</li></ul><h2 id="idle-prepare" tabindex="-1">idle prepare <a class="header-anchor" href="#idle-prepare" aria-label="Permalink to &quot;idle prepare&quot;">​</a></h2><p>系统内部使用</p><h2 id="轮询-poll" tabindex="-1">轮询 poll <a class="header-anchor" href="#轮询-poll" aria-label="Permalink to &quot;轮询 poll&quot;">​</a></h2><p>检索新的 I/O 事件，执行与 I/O 相关的回调（几乎所有情况下，除了关闭的回调函数，计时器和 setImmediate() 调度的之外）其余情况 node 将在适当的时候阻塞</p><ul><li><p>计算应该阻塞和轮询 I/O 的时间</p></li><li><p>处理轮询队列里的事件</p><ul><li>轮询队列不为空，事件循环将循环访问回调队列并同步执行他们，直到队列为空，或者达到了与系统相关的硬性限制</li><li>轮询队列为空，如果脚本被 setImmediate() 调度，则事件循环将结束轮询阶段，并继续检查阶段以执行哪些被调度的脚本；如果脚本未被 setImmediate() 调度，则事件循环将等待回调被添加到队列中，然后立即执行</li></ul></li><li><p>一旦轮询队列为空，事件循环将检查已达到阈值的计时器，如果一个或多个计时器已准备就绪，则事件循环将绕回计时器阶段以执行计时器回调</p></li></ul><h2 id="检测-check" tabindex="-1">检测 check <a class="header-anchor" href="#检测-check" aria-label="Permalink to &quot;检测 check&quot;">​</a></h2><p>setImmediate() 回调函数在这里执行</p><ul><li>轮询阶段完成后立即执行回调，轮询阶段变为空闲状态，脚本使用 setImmediate() 后被排列在队列中，则事件循环可能继续到检查阶段而不是等待</li><li>setImmediate() 事件循环中的单独阶段运行的特殊及时器（libuv API 安排回调在轮询阶段完成后立即执行）</li></ul><h2 id="关闭的回调函数-close-callbacks" tabindex="-1">关闭的回调函数 close callbacks <a class="header-anchor" href="#关闭的回调函数-close-callbacks" aria-label="Permalink to &quot;关闭的回调函数 close callbacks&quot;">​</a></h2><p>一些关闭的回调函数 socket.o(&#39;close&#39;, ...)</p><ul><li>套接字或处理函数关闭（socket.destroy())，close 事件在这个阶段发出，否则（process.nextTick()) 发出</li></ul><h2 id="settimeout-vs-setimmediate" tabindex="-1">setTimeout() VS setImmediate() <a class="header-anchor" href="#settimeout-vs-setimmediate" aria-label="Permalink to &quot;setTimeout() VS setImmediate()&quot;">​</a></h2><ul><li>setImmediate() 一旦在当前轮询阶段完成，就执行脚本</li><li>setTimeout() 轮询阶段计算出来的阈值（ms）过后运行脚本</li></ul><ol><li>主模块中运行（非确定性）</li><li>运行在 I/O 循环内调用，setImmediate 总是被优先调用</li></ol><h2 id="process-nexttick" tabindex="-1">process.nextTick <a class="header-anchor" href="#process-nexttick" aria-label="Permalink to &quot;process.nextTick&quot;">​</a></h2><ul><li><p>不是事件循环的一部分，在当前操作完成后处理 nextTickQueue，<code>允许通过递归调用来阻止I/O，阻止事件到达轮询阶段</code></p></li><li><p>保证用户代码的其余部分之后在让事件循环继续进行之前，执行其回调函数</p></li><li><p>回调置于 process.nextTick() 中，脚本仍具有运行完成的能力，允许在调用回调之前初始化所有的变量、函数</p></li><li><p>不让事件循环继续的优点，适用于让事件循环继续之前，警告用户发生错误的情况</p></li></ul><h3 id="process-nexttick-vs-setimmediate" tabindex="-1">process.nextTick() VS setImmediate() <a class="header-anchor" href="#process-nexttick-vs-setimmediate" aria-label="Permalink to &quot;process.nextTick() VS setImmediate()&quot;">​</a></h3><ul><li>process.nextTick() 在同一个阶段立即执行</li><li>setImmeidate() 在事件循环的接下来的 tick 上触发</li></ul><h3 id="为什么使用-process-nexttick" tabindex="-1">为什么使用 process.nextTick() <a class="header-anchor" href="#为什么使用-process-nexttick" aria-label="Permalink to &quot;为什么使用 process.nextTick()&quot;">​</a></h3><ol><li>允许用户处理错误，清理任何不需要的资源，或者在事件循环继续之前重试请求</li><li>让回调在栈展开后，但在事件循环继续之前运行的必要</li></ol></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2023-10-26T01:58:04.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/nodejs/ansi.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>ANSI</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/nodejs/npm.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Npm</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/nodejs/npm.html b/notes/nodejs/npm.html
index b1ad448..1ff044d 100644
--- a/notes/nodejs/npm.html
+++ b/notes/nodejs/npm.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>package.json | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_nodejs_npm.md.794dc498.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_nodejs_npm.md.990b6f83.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_nodejs_npm" data-v-6b87e69f><div><h1 id="package-json" tabindex="-1">package.json <a class="header-anchor" href="#package-json" aria-label="Permalink to &quot;package.json&quot;">​</a></h1><p>package.json 中的配置</p><h2 id="json-配置" tabindex="-1">json 配置 <a class="header-anchor" href="#json-配置" aria-label="Permalink to &quot;json 配置&quot;">​</a></h2><ul><li><p>name 包名</p></li><li><p>version 版本号</p></li><li><p>description 描述</p></li><li><p>keywords 关键词</p></li><li><p>homepage 主页</p></li><li><p>bugs 发布包 bug 日志</p><ul><li>{url: &#39;xxx&#39;, email: &#39;xxx&#39;} or [] or string</li></ul></li><li><p>license 凭证</p><ul><li>{type: &#39;ISC&#39;, url: &#39;xxx&#39;} or [] or string</li></ul></li><li><p>people fields: author contributors</p><ul><li>name, email, url</li></ul></li><li><p>funding 更新日志信息</p><ul><li>{type: &#39;xxx&#39;, url: &#39;xxx&#39;} or []</li></ul></li><li><p>files 指定哪些文件需要上传到包中（include files)</p><ul><li>exclude files === .gitignore .npmignore</li></ul></li><li><p>main 入口文件</p></li><li><p>browser 指定运行环境</p></li><li><p>bin 可执行命令</p><ul><li>{myapp: &#39;./cli.js&#39;} 默认命令为包名 npm 安装时会在 node_modules/.bin/myapp</li><li>cli.js 文件开头加入以下代码 !#/usr/bin/env node 指定运行环境变量</li></ul></li><li><p>man 手册帮助</p></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>事件循环</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/typescript/basic.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>基础</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_nodejs_npm" data-v-6b87e69f><div><h1 id="package-json" tabindex="-1">package.json <a class="header-anchor" href="#package-json" aria-label="Permalink to &quot;package.json&quot;">​</a></h1><p>package.json 中的配置</p><h2 id="json-配置" tabindex="-1">json 配置 <a class="header-anchor" href="#json-配置" aria-label="Permalink to &quot;json 配置&quot;">​</a></h2><ul><li><p>name 包名</p></li><li><p>version 版本号</p></li><li><p>description 描述</p></li><li><p>keywords 关键词</p></li><li><p>homepage 主页</p></li><li><p>bugs 发布包 bug 日志</p><ul><li>{url: &#39;xxx&#39;, email: &#39;xxx&#39;} or [] or string</li></ul></li><li><p>license 凭证</p><ul><li>{type: &#39;ISC&#39;, url: &#39;xxx&#39;} or [] or string</li></ul></li><li><p>people fields: author contributors</p><ul><li>name, email, url</li></ul></li><li><p>funding 更新日志信息</p><ul><li>{type: &#39;xxx&#39;, url: &#39;xxx&#39;} or []</li></ul></li><li><p>files 指定哪些文件需要上传到包中（include files)</p><ul><li>exclude files === .gitignore .npmignore</li></ul></li><li><p>main 入口文件</p></li><li><p>browser 指定运行环境</p></li><li><p>bin 可执行命令</p><ul><li>{myapp: &#39;./cli.js&#39;} 默认命令为包名 npm 安装时会在 node_modules/.bin/myapp</li><li>cli.js 文件开头加入以下代码 !#/usr/bin/env node 指定运行环境变量</li></ul></li><li><p>man 手册帮助</p></li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/nodejs/event-loop.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>事件循环</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/typescript/basic.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>基础</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/regexp/base.html b/notes/regexp/base.html
index 8eb0daa..d3ae954 100644
--- a/notes/regexp/base.html
+++ b/notes/regexp/base.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>正则表达式 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_regexp_base.md.5f3b85d0.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_regexp_base.md.80469b71.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_regexp_base" data-v-6b87e69f><div><h1 id="正则表达式" tabindex="-1">正则表达式 <a class="header-anchor" href="#正则表达式" aria-label="Permalink to &quot;正则表达式&quot;">​</a></h1><table><thead><tr><th>元字符</th><th>描述</th></tr></thead><tbody><tr><td>\</td><td>将下一个字符标记符、或一个向后引用、或一个八进制转义符。</td></tr></tbody></table></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/javascript/URI.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>编码</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/regexp/unknown.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>扩展</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_regexp_base" data-v-6b87e69f><div><h1 id="正则表达式" tabindex="-1">正则表达式 <a class="header-anchor" href="#正则表达式" aria-label="Permalink to &quot;正则表达式&quot;">​</a></h1><table><thead><tr><th>元字符</th><th>描述</th></tr></thead><tbody><tr><td>\</td><td>将下一个字符标记符、或一个向后引用、或一个八进制转义符。</td></tr></tbody></table></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/javascript/URI.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>编码</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/regexp/unknown.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>扩展</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/regexp/unknown.html b/notes/regexp/unknown.html
index 19dfd41..3c1995b 100644
--- a/notes/regexp/unknown.html
+++ b/notes/regexp/unknown.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>你不知道的正则表达式 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_regexp_unknown.md.40d387f2.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_regexp_unknown.md.ffcfd74a.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_regexp_unknown" data-v-6b87e69f><div><h1 id="你不知道的正则表达式" tabindex="-1">你不知道的正则表达式 <a class="header-anchor" href="#你不知道的正则表达式" aria-label="Permalink to &quot;你不知道的正则表达式&quot;">​</a></h1><h2 id="逗号分隔千分位" tabindex="-1">逗号分隔千分位 <a class="header-anchor" href="#逗号分隔千分位" aria-label="Permalink to &quot;逗号分隔千分位&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;1234567890&#39;</span><span style="color:#E1E4E8;">;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_regexp_unknown" data-v-6b87e69f><div><h1 id="你不知道的正则表达式" tabindex="-1">你不知道的正则表达式 <a class="header-anchor" href="#你不知道的正则表达式" aria-label="Permalink to &quot;你不知道的正则表达式&quot;">​</a></h1><h2 id="逗号分隔千分位" tabindex="-1">逗号分隔千分位 <a class="header-anchor" href="#逗号分隔千分位" aria-label="Permalink to &quot;逗号分隔千分位&quot;">​</a></h2><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> a </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;1234567890&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#F97583;">var</span><span style="color:#E1E4E8;"> reg </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">/</span><span style="color:#F97583;">\B</span><span style="color:#DBEDFF;">(?=(</span><span style="color:#79B8FF;">\d</span><span style="color:#F97583;">{3}</span><span style="color:#DBEDFF;">)</span><span style="color:#F97583;">+$</span><span style="color:#DBEDFF;">)</span><span style="color:#9ECBFF;">/</span><span style="color:#F97583;">g</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// 分隔</span></span>
 <span class="line"><span style="color:#E1E4E8;">a.</span><span style="color:#B392F0;">replace</span><span style="color:#E1E4E8;">(reg, </span><span style="color:#9ECBFF;">&#39;,&#39;</span><span style="color:#E1E4E8;">);</span></span>
@@ -27,8 +27,8 @@
 <span class="line"><span style="color:#6A737D;">// 分隔</span></span>
 <span class="line"><span style="color:#24292E;">a.</span><span style="color:#6F42C1;">replace</span><span style="color:#24292E;">(reg, </span><span style="color:#032F62;">&#39;,&#39;</span><span style="color:#24292E;">);</span></span>
 <span class="line"><span style="color:#6A737D;">// output</span></span>
-<span class="line"><span style="color:#6A737D;">// &#39;1,234,567,890&#39;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/regexp/base.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>基础</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/es/es6.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ES6+</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#6A737D;">// &#39;1,234,567,890&#39;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/regexp/base.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>基础</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/es/es6.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>ES6+</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/typescript/advanced.html b/notes/typescript/advanced.html
index 361474a..aa46f69 100644
--- a/notes/typescript/advanced.html
+++ b/notes/typescript/advanced.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Typescript 高级 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_typescript_advanced.md.d0ace6b6.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_typescript_advanced.md.13baaa4d.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_typescript_advanced" data-v-6b87e69f><div><h1 id="typescript-高级" tabindex="-1">Typescript 高级 <a class="header-anchor" href="#typescript-高级" aria-label="Permalink to &quot;Typescript 高级&quot;">​</a></h1><h2 id="advanced-type" tabindex="-1">Advanced Type <a class="header-anchor" href="#advanced-type" aria-label="Permalink to &quot;Advanced Type&quot;">​</a></h2><ul><li>用户指定类型 user-defined <ul><li>标识符 is</li></ul></li><li>in 关键字</li><li>typeof 关键字</li><li>null/undefined types <ul><li>null undefined 是两种不同的类型</li><li>可选参数或者属性 --strictNullChecks 参数或者属性可以为 undefined 不能为 null</li></ul></li><li>类型断言 type-assertion <ul><li>?? = a ? &#39;&#39; : &#39;&#39;;</li><li>! = user!.id!.length = undefined</li></ul></li><li>类型别名 type-aliases <ul><li>树形结构</li></ul></li><li>interface VS type <ul><li>接口可以继承 type 可以使用交叉类型实现 &amp;</li><li>接口可以重复定义（相当于增加新的属性类型定义）type 不能重复定义会报错</li></ul></li><li>索引类型 <ul><li>keyof 关键字</li></ul></li><li>索引类型 索引签名 <ul><li>对象键指定为 string = string | number, 指定为 number, 只能为 number 类型</li></ul></li><li>映射类型 mapped types <ul><li>封装</li><li>类似 for...in 操作符，对一个已定义的类型遍历操作</li><li>不能添加新的属性定义，如果需要使用交叉类型 &amp;</li></ul></li><li>条件类型 conditional types <ul><li>?</li><li>可以配合映射类型使用</li></ul></li><li>推断类型 infer <ul><li>infer 关键字配合 extends 使用</li></ul></li></ul><h2 id="utility-types" tabindex="-1">Utility types <a class="header-anchor" href="#utility-types" aria-label="Permalink to &quot;Utility types&quot;">​</a></h2><p>实体类型</p><ul><li>Partial&lt;Type&gt; 部分属性</li><li>Readonly&lt;Type&gt; 只读属性</li><li>Record&lt;Keys, Type&gt; 记录一组 Type 类型存在 keys 的集合当中</li><li>Pick&lt;Type, Keys&gt; 选择 Type 类型中需要存在的 keys 集合</li><li>Omit&lt;Type, Keys&gt; 反向选择 Type 类型中存在的 keys 集合</li><li>Exclude&lt;Type, ExcludedUnion&gt; 排除 Type 类型中存在 ExcludedUnion 组合类型的值</li><li>Extract&lt;Type, Union&gt; 并集</li><li>NonNullable&lt;Type&gt; 去除 Type 类型中的 null undefined</li><li>Parameters&lt;Type&gt; 构造一组元组类型使用在函数参数当中</li><li>ConstructorParameters&lt;Type&gt; 构造一组元组类型或者数组类型使用在构造函数当中</li><li>ReturnType&lt;Type&gt; 返回类型</li><li>InstanceType&lt;Type&gt; 实例类型</li><li>Required&lt;Type&gt; 与 Partial 相反</li><li>ThisParameterType&lt;Type&gt; 用于 this 作为函数参数时使用</li><li>OmitThisParameter&lt;Type&gt; 如果没有 this 的绑定，可以使用此类型用作绑定 this</li><li>ThisType&lt;Type&gt; --noImplicitThis 如果没有指定规则，必须指定 this 强绑定</li></ul><h2 id="modules" tabindex="-1">Modules <a class="header-anchor" href="#modules" aria-label="Permalink to &quot;Modules&quot;">​</a></h2><p>import/export</p><blockquote><p>commonjs/requirejs(amd)/umd/system/es2015/esnext</p></blockquote><h3 id="import-a-moudle-from-side-effects-only" tabindex="-1">Import a moudle from side-effects only <a class="header-anchor" href="#import-a-moudle-from-side-effects-only" aria-label="Permalink to &quot;Import a moudle from side-effects only&quot;">​</a></h3><blockquote><p>有些模块使用了其他模块设置了一些全局状态（没有明显的导出 exports）</p></blockquote><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./my-module.js&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">import</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;./my-module.js&#39;</span><span style="color:#24292E;">;</span></span></code></pre></div><h3 id="importing-types" tabindex="-1">Importing Types <a class="header-anchor" href="#importing-types" aria-label="Permalink to &quot;Importing Types&quot;">​</a></h3><blockquote><p>typescript 3.8 可以使用 import type（为了配合 babel isolatedModules 配置）</p></blockquote><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// before</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_typescript_advanced" data-v-6b87e69f><div><h1 id="typescript-高级" tabindex="-1">Typescript 高级 <a class="header-anchor" href="#typescript-高级" aria-label="Permalink to &quot;Typescript 高级&quot;">​</a></h1><h2 id="advanced-type" tabindex="-1">Advanced Type <a class="header-anchor" href="#advanced-type" aria-label="Permalink to &quot;Advanced Type&quot;">​</a></h2><ul><li>用户指定类型 user-defined <ul><li>标识符 is</li></ul></li><li>in 关键字</li><li>typeof 关键字</li><li>null/undefined types <ul><li>null undefined 是两种不同的类型</li><li>可选参数或者属性 --strictNullChecks 参数或者属性可以为 undefined 不能为 null</li></ul></li><li>类型断言 type-assertion <ul><li>?? = a ? &#39;&#39; : &#39;&#39;;</li><li>! = user!.id!.length = undefined</li></ul></li><li>类型别名 type-aliases <ul><li>树形结构</li></ul></li><li>interface VS type <ul><li>接口可以继承 type 可以使用交叉类型实现 &amp;</li><li>接口可以重复定义（相当于增加新的属性类型定义）type 不能重复定义会报错</li></ul></li><li>索引类型 <ul><li>keyof 关键字</li></ul></li><li>索引类型 索引签名 <ul><li>对象键指定为 string = string | number, 指定为 number, 只能为 number 类型</li></ul></li><li>映射类型 mapped types <ul><li>封装</li><li>类似 for...in 操作符，对一个已定义的类型遍历操作</li><li>不能添加新的属性定义，如果需要使用交叉类型 &amp;</li></ul></li><li>条件类型 conditional types <ul><li>?</li><li>可以配合映射类型使用</li></ul></li><li>推断类型 infer <ul><li>infer 关键字配合 extends 使用</li></ul></li></ul><h2 id="utility-types" tabindex="-1">Utility types <a class="header-anchor" href="#utility-types" aria-label="Permalink to &quot;Utility types&quot;">​</a></h2><p>实体类型</p><ul><li>Partial&lt;Type&gt; 部分属性</li><li>Readonly&lt;Type&gt; 只读属性</li><li>Record&lt;Keys, Type&gt; 记录一组 Type 类型存在 keys 的集合当中</li><li>Pick&lt;Type, Keys&gt; 选择 Type 类型中需要存在的 keys 集合</li><li>Omit&lt;Type, Keys&gt; 反向选择 Type 类型中存在的 keys 集合</li><li>Exclude&lt;Type, ExcludedUnion&gt; 排除 Type 类型中存在 ExcludedUnion 组合类型的值</li><li>Extract&lt;Type, Union&gt; 并集</li><li>NonNullable&lt;Type&gt; 去除 Type 类型中的 null undefined</li><li>Parameters&lt;Type&gt; 构造一组元组类型使用在函数参数当中</li><li>ConstructorParameters&lt;Type&gt; 构造一组元组类型或者数组类型使用在构造函数当中</li><li>ReturnType&lt;Type&gt; 返回类型</li><li>InstanceType&lt;Type&gt; 实例类型</li><li>Required&lt;Type&gt; 与 Partial 相反</li><li>ThisParameterType&lt;Type&gt; 用于 this 作为函数参数时使用</li><li>OmitThisParameter&lt;Type&gt; 如果没有 this 的绑定，可以使用此类型用作绑定 this</li><li>ThisType&lt;Type&gt; --noImplicitThis 如果没有指定规则，必须指定 this 强绑定</li></ul><h2 id="modules" tabindex="-1">Modules <a class="header-anchor" href="#modules" aria-label="Permalink to &quot;Modules&quot;">​</a></h2><p>import/export</p><blockquote><p>commonjs/requirejs(amd)/umd/system/es2015/esnext</p></blockquote><h3 id="import-a-moudle-from-side-effects-only" tabindex="-1">Import a moudle from side-effects only <a class="header-anchor" href="#import-a-moudle-from-side-effects-only" aria-label="Permalink to &quot;Import a moudle from side-effects only&quot;">​</a></h3><blockquote><p>有些模块使用了其他模块设置了一些全局状态（没有明显的导出 exports）</p></blockquote><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./my-module.js&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#D73A49;">import</span><span style="color:#24292E;"> </span><span style="color:#032F62;">&#39;./my-module.js&#39;</span><span style="color:#24292E;">;</span></span></code></pre></div><h3 id="importing-types" tabindex="-1">Importing Types <a class="header-anchor" href="#importing-types" aria-label="Permalink to &quot;Importing Types&quot;">​</a></h3><blockquote><p>typescript 3.8 可以使用 import type（为了配合 babel isolatedModules 配置）</p></blockquote><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// before</span></span>
 <span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> { apiResponseType } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./api&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#6A737D;">// now</span></span>
 <span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">type</span><span style="color:#E1E4E8;"> { apiResponseType } </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;./api&#39;</span><span style="color:#E1E4E8;">;</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// before</span></span>
@@ -191,8 +191,8 @@
 <span class="line"><span style="color:#24292E;">    </span><span style="color:#D73A49;">return</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">C</span><span style="color:#24292E;">;</span></span>
 <span class="line"><span style="color:#24292E;">  })();</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#005CC5;">exports</span><span style="color:#24292E;">.</span><span style="color:#005CC5;">C</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">C</span><span style="color:#24292E;">;</span></span>
-<span class="line"><span style="color:#24292E;">});</span></span></code></pre></div><ul><li>amd-dependency 已遗弃</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/typescript/basic.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>基础</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>包结构</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">});</span></span></code></pre></div><ul><li>amd-dependency 已遗弃</li></ul></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/typescript/basic.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>基础</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/typescript/lib-struct.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>包结构</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/typescript/basic.html b/notes/typescript/basic.html
index c68c7ee..c3892f1 100644
--- a/notes/typescript/basic.html
+++ b/notes/typescript/basic.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Typescript 基础 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_typescript_basic.md.75a51f21.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_typescript_basic.md.7f81406b.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_typescript_basic" data-v-6b87e69f><div><h1 id="typescript-基础" tabindex="-1">Typescript 基础 <a class="header-anchor" href="#typescript-基础" aria-label="Permalink to &quot;Typescript 基础&quot;">​</a></h1><h2 id="tsconfig-json-jsconfig-json-文件" tabindex="-1">tsconfig.json/jsconfig.json 文件 <a class="header-anchor" href="#tsconfig-json-jsconfig-json-文件" aria-label="Permalink to &quot;tsconfig.json/jsconfig.json 文件&quot;">​</a></h2><h3 id="配置参数" tabindex="-1">配置参数 <a class="header-anchor" href="#配置参数" aria-label="Permalink to &quot;配置参数&quot;">​</a></h3><div class="language-md vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#79B8FF;font-weight:bold;"># compilerOptions</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_typescript_basic" data-v-6b87e69f><div><h1 id="typescript-基础" tabindex="-1">Typescript 基础 <a class="header-anchor" href="#typescript-基础" aria-label="Permalink to &quot;Typescript 基础&quot;">​</a></h1><h2 id="tsconfig-json-jsconfig-json-文件" tabindex="-1">tsconfig.json/jsconfig.json 文件 <a class="header-anchor" href="#tsconfig-json-jsconfig-json-文件" aria-label="Permalink to &quot;tsconfig.json/jsconfig.json 文件&quot;">​</a></h2><h3 id="配置参数" tabindex="-1">配置参数 <a class="header-anchor" href="#配置参数" aria-label="Permalink to &quot;配置参数&quot;">​</a></h3><div class="language-md vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">md</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#79B8FF;font-weight:bold;"># compilerOptions</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#85E89D;">&gt; 常见配置介绍</span></span>
 <span class="line"></span>
@@ -387,8 +387,8 @@
 <span class="line"><span style="color:#E1E4E8;">}</span></span></code></pre><pre class="shiki github-light vp-code-light"><code><span class="line"><span style="color:#6A737D;">// create</span></span>
 <span class="line"><span style="color:#D73A49;">function</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">create</span><span style="color:#24292E;">&lt;</span><span style="color:#6F42C1;">T</span><span style="color:#24292E;">&gt;(</span><span style="color:#E36209;">c</span><span style="color:#D73A49;">:</span><span style="color:#24292E;"> { </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> ()</span><span style="color:#D73A49;">:</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">T</span><span style="color:#24292E;"> })</span><span style="color:#D73A49;">:</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">T</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#D73A49;">return</span><span style="color:#24292E;"> </span><span style="color:#D73A49;">new</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">c</span><span style="color:#24292E;">();</span></span>
-<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/nodejs/npm.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Npm</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/notes/typescript/advanced.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>高级基础</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">}</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/nodejs/npm.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Npm</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/notes/typescript/advanced.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>高级基础</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/notes/typescript/lib-struct.html b/notes/typescript/lib-struct.html
index e849ad4..1d07e0e 100644
--- a/notes/typescript/lib-struct.html
+++ b/notes/typescript/lib-struct.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Typescript 文件结构定义 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/notes_typescript_lib-struct.md.04de5da6.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/notes_typescript_lib-struct.md.214381a8.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_notes_typescript_lib-struct" data-v-6b87e69f><div><h1 id="typescript-文件结构定义" tabindex="-1">Typescript 文件结构定义 <a class="header-anchor" href="#typescript-文件结构定义" aria-label="Permalink to &quot;Typescript 文件结构定义&quot;">​</a></h1><blockquote><p>如何定义 typescript 类型文件（记录一些定义文件的细节）</p></blockquote><h2 id="模块化" tabindex="-1">模块化 <a class="header-anchor" href="#模块化" aria-label="Permalink to &quot;模块化&quot;">​</a></h2><p>es6/nodejs/umd/amd/SystemJs</p><h2 id="模块模板" tabindex="-1">模块模板 <a class="header-anchor" href="#模块模板" aria-label="Permalink to &quot;模块模板&quot;">​</a></h2><p>module.d.ts/module-class.d.ts/module-functon.d.ts/module-plugin.d.ts</p><h3 id="module-d-ts" tabindex="-1">module.d.ts <a class="header-anchor" href="#module-d-ts" aria-label="Permalink to &quot;module.d.ts&quot;">​</a></h3><ul><li>export = &amp; import xx = require()</li></ul><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// tsconfig.json =&gt; esModuleInterop: true</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>笔记</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>阅读前瞻</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>HTML</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/seo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>SEO</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/esmodule.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES Module</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/html/unusual.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>CSS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>CSS 知识</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/bfc.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>BFC</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/box.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>盒模型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/flex.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Flex 扩展</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/float.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Float 注意</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/inline.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>行内元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/pseudo.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>伪元素伪类</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/replaced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>可替换元素</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/text-character.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>文字特性</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/css/visibility.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Visibility 属性</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>JavaScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/addEventListener.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件监听</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/dom.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>DOM 类型</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/equal.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>相等性检查</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/jsop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>运算符</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/mutationObserver.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>MutationObserver</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/prototype.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>原型 原型链</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/scope.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/storage-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>存储结构</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/this.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>This 作用域</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/javascript/URI.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>编码</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>正则表达式</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/base.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/regexp/unknown.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>扩展</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>ES Features</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/es/es6.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ES6+</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>NodeJS</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/ansi.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>ANSI</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/event-loop.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>事件循环</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/nodejs/npm.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Npm</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>TypeScript</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/basic.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/advanced.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>高级基础</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/notes/typescript/lib-struct.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>包结构</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _notes_typescript_lib-struct" data-v-6b87e69f><div><h1 id="typescript-文件结构定义" tabindex="-1">Typescript 文件结构定义 <a class="header-anchor" href="#typescript-文件结构定义" aria-label="Permalink to &quot;Typescript 文件结构定义&quot;">​</a></h1><blockquote><p>如何定义 typescript 类型文件（记录一些定义文件的细节）</p></blockquote><h2 id="模块化" tabindex="-1">模块化 <a class="header-anchor" href="#模块化" aria-label="Permalink to &quot;模块化&quot;">​</a></h2><p>es6/nodejs/umd/amd/SystemJs</p><h2 id="模块模板" tabindex="-1">模块模板 <a class="header-anchor" href="#模块模板" aria-label="Permalink to &quot;模块模板&quot;">​</a></h2><p>module.d.ts/module-class.d.ts/module-functon.d.ts/module-plugin.d.ts</p><h3 id="module-d-ts" tabindex="-1">module.d.ts <a class="header-anchor" href="#module-d-ts" aria-label="Permalink to &quot;module.d.ts&quot;">​</a></h3><ul><li>export = &amp; import xx = require()</li></ul><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// tsconfig.json =&gt; esModuleInterop: true</span></span>
 <span class="line"><span style="color:#F97583;">declare</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">function</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">a</span><span style="color:#E1E4E8;">()</span><span style="color:#F97583;">:</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">string</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"><span style="color:#F97583;">export</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">default</span><span style="color:#E1E4E8;"> a;</span></span>
 <span class="line"><span style="color:#6A737D;">// or</span></span>
@@ -61,8 +61,8 @@
 <span class="line"><span style="color:#6A737D;">// OK</span></span>
 <span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> y </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> </span><span style="color:#005CC5;">C</span><span style="color:#24292E;">.x;</span></span>
 <span class="line"><span style="color:#6A737D;">// OK</span></span>
-<span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> y</span><span style="color:#D73A49;">:</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">C</span><span style="color:#24292E;">.</span><span style="color:#6F42C1;">D</span><span style="color:#24292E;">;</span></span></code></pre></div><ul><li>namespace 可以嵌套 namespace</li><li>type &amp; namespace</li></ul><p>type 和 namespace 使用会出现多种不同的合并</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/notes/typescript/advanced.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>高级基础</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#D73A49;">let</span><span style="color:#24292E;"> y</span><span style="color:#D73A49;">:</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">C</span><span style="color:#24292E;">.</span><span style="color:#6F42C1;">D</span><span style="color:#24292E;">;</span></span></code></pre></div><ul><li>namespace 可以嵌套 namespace</li><li>type &amp; namespace</li></ul><p>type 和 namespace 使用会出现多种不同的合并</p></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/notes/typescript/advanced.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>高级基础</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/source-code/index.html b/source-code/index.html
index 8328efb..39df46e 100644
--- a/source-code/index.html
+++ b/source-code/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>导航 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/source-code_index.md.3b974e67.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/source-code_index.md.c3b56127.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>导航</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>目录</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>React</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><section class="VPSidebarItem level-1" data-v-e31bd47b data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h3 class="text" data-v-e31bd47b>API</h3><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/react/api/context.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Context</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/react/api/ref.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Ref</p><!--]--></a><!----></div><!----></div><!--]--></div></section><!--]--></div></section></div><div class="group" data-v-b00e2fdd><div class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><p class="text" data-v-e31bd47b>Vue</p><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><!----></div></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_source-code_" data-v-6b87e69f><div><h1 id="导航" tabindex="-1">导航 <a class="header-anchor" href="#导航" aria-label="Permalink to &quot;导航&quot;">​</a></h1></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/source-code/react/api/context.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Context</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink active" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>导航</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>目录</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>React</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><section class="VPSidebarItem level-1" data-v-e31bd47b data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h3 class="text" data-v-e31bd47b>API</h3><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/react/api/context.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Context</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/react/api/ref.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Ref</p><!--]--></a><!----></div><!----></div><!--]--></div></section><!--]--></div></section></div><div class="group" data-v-b00e2fdd><div class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><p class="text" data-v-e31bd47b>Vue</p><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><!----></div></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _source-code_" data-v-6b87e69f><div><h1 id="导航" tabindex="-1">导航 <a class="header-anchor" href="#导航" aria-label="Permalink to &quot;导航&quot;">​</a></h1></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/source-code/react/api/context.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Context</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/source-code/react/api/context.html b/source-code/react/api/context.html
index 770dbbd..4f88387 100644
--- a/source-code/react/api/context.html
+++ b/source-code/react/api/context.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Context | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/source-code_react_api_context.md.f71ef236.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/source-code_react_api_context.md.cb6576d9.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>导航</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>目录</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>React</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><section class="VPSidebarItem level-1 has-active" data-v-e31bd47b data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h3 class="text" data-v-e31bd47b>API</h3><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/react/api/context.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Context</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/react/api/ref.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Ref</p><!--]--></a><!----></div><!----></div><!--]--></div></section><!--]--></div></section></div><div class="group" data-v-b00e2fdd><div class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><p class="text" data-v-e31bd47b>Vue</p><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><!----></div></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_source-code_react_api_context" data-v-6b87e69f><div><h1 id="context" tabindex="-1">Context <a class="header-anchor" href="#context" aria-label="Permalink to &quot;Context&quot;">​</a></h1><ul><li>15.3</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> PropTypes </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;prop-types&#39;</span><span style="color:#E1E4E8;">;</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>导航</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>目录</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>React</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><section class="VPSidebarItem level-1 has-active" data-v-e31bd47b data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h3 class="text" data-v-e31bd47b>API</h3><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/react/api/context.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Context</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/react/api/ref.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Ref</p><!--]--></a><!----></div><!----></div><!--]--></div></section><!--]--></div></section></div><div class="group" data-v-b00e2fdd><div class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><p class="text" data-v-e31bd47b>Vue</p><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><!----></div></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _source-code_react_api_context" data-v-6b87e69f><div><h1 id="context" tabindex="-1">Context <a class="header-anchor" href="#context" aria-label="Permalink to &quot;Context&quot;">​</a></h1><ul><li>15.3</li></ul><div class="language-js vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">js</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#F97583;">import</span><span style="color:#E1E4E8;"> PropTypes </span><span style="color:#F97583;">from</span><span style="color:#E1E4E8;"> </span><span style="color:#9ECBFF;">&#39;prop-types&#39;</span><span style="color:#E1E4E8;">;</span></span>
 <span class="line"></span>
 <span class="line"><span style="color:#6A737D;">/* parents component */</span></span>
 <span class="line"><span style="color:#F97583;">class</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">Parent</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">extends</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">React</span><span style="color:#E1E4E8;">.</span><span style="color:#B392F0;">Component</span><span style="color:#E1E4E8;"> {</span></span>
@@ -93,8 +93,8 @@
 <span class="line"><span style="color:#24292E;">  }</span></span>
 <span class="line"><span style="color:#24292E;">&lt;/</span><span style="color:#005CC5;">Context.Consumer</span><span style="color:#24292E;">&gt;</span></span>
 <span class="line"><span style="color:#6A737D;">//or</span></span>
-<span class="line"><span style="color:#24292E;">Child.ContextType </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> Context;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/source-code/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>目录</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/source-code/react/api/ref.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Ref</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">Child.ContextType </span><span style="color:#D73A49;">=</span><span style="color:#24292E;"> Context;</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/source-code/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>目录</span></a></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/source-code/react/api/ref.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>Ref</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/source-code/react/api/ref.html b/source-code/react/api/ref.html
index 815b903..fd57b76 100644
--- a/source-code/react/api/ref.html
+++ b/source-code/react/api/ref.html
@@ -5,19 +5,19 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>Ref | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/source-code_react_api_ref.md.041146b3.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/source-code_react_api_ref.md.955d1f79.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>导航</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>目录</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>React</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><section class="VPSidebarItem level-1 has-active" data-v-e31bd47b data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h3 class="text" data-v-e31bd47b>API</h3><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/react/api/context.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Context</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/react/api/ref.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Ref</p><!--]--></a><!----></div><!----></div><!--]--></div></section><!--]--></div></section></div><div class="group" data-v-b00e2fdd><div class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><p class="text" data-v-e31bd47b>Vue</p><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><!----></div></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_source-code_react_api_ref" data-v-6b87e69f><div><h1 id="ref" tabindex="-1">Ref <a class="header-anchor" href="#ref" aria-label="Permalink to &quot;Ref&quot;">​</a></h1><p><code>react ref</code></p><ul><li><ol><li>使用 ref 在具体的 dom 元素上或者 class 组件上</li></ol></li></ul><div class="language-jsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 1. 直接创建</span></span>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>导航</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>目录</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible has-active" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>React</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><section class="VPSidebarItem level-1 has-active" data-v-e31bd47b data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h3 class="text" data-v-e31bd47b>API</h3><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/react/api/context.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Context</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/react/api/ref.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Ref</p><!--]--></a><!----></div><!----></div><!--]--></div></section><!--]--></div></section></div><div class="group" data-v-b00e2fdd><div class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><p class="text" data-v-e31bd47b>Vue</p><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><!----></div></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _source-code_react_api_ref" data-v-6b87e69f><div><h1 id="ref" tabindex="-1">Ref <a class="header-anchor" href="#ref" aria-label="Permalink to &quot;Ref&quot;">​</a></h1><p><code>react ref</code></p><ul><li><ol><li>使用 ref 在具体的 dom 元素上或者 class 组件上</li></ol></li></ul><div class="language-jsx vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">jsx</span><pre class="shiki github-dark vp-code-dark"><code><span class="line"><span style="color:#6A737D;">// 1. 直接创建</span></span>
 <span class="line"><span style="color:#F97583;">const</span><span style="color:#E1E4E8;"> </span><span style="color:#79B8FF;">ref</span><span style="color:#E1E4E8;"> </span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;"> React.</span><span style="color:#B392F0;">createRef</span><span style="color:#E1E4E8;">();</span></span>
 <span class="line"><span style="color:#6A737D;">// ref ==&gt; { currnt: dom }</span></span>
 <span class="line"><span style="color:#E1E4E8;">&lt;</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;"> </span><span style="color:#B392F0;">ref</span><span style="color:#F97583;">=</span><span style="color:#E1E4E8;">{ref}&gt;&lt;/</span><span style="color:#85E89D;">div</span><span style="color:#E1E4E8;">&gt;</span></span>
@@ -57,8 +57,8 @@
 <span class="line"><span style="color:#6A737D;"> */</span></span>
 <span class="line"><span style="color:#24292E;">React.</span><span style="color:#6F42C1;">forwareRef</span><span style="color:#24292E;">((</span><span style="color:#E36209;">props</span><span style="color:#24292E;">, </span><span style="color:#E36209;">ref</span><span style="color:#24292E;">) </span><span style="color:#D73A49;">=&gt;</span><span style="color:#24292E;"> {</span></span>
 <span class="line"><span style="color:#24292E;">  </span><span style="color:#D73A49;">return</span><span style="color:#24292E;"> &lt;</span><span style="color:#005CC5;">Component</span><span style="color:#24292E;"> </span><span style="color:#6F42C1;">ref</span><span style="color:#D73A49;">=</span><span style="color:#24292E;">{ref} {</span><span style="color:#D73A49;">...</span><span style="color:#24292E;">props}&gt;;</span></span>
-<span class="line"><span style="color:#24292E;">})</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/learning-docs2/source-code/react/api/context.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Context</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+<span class="line"><span style="color:#24292E;">})</span></span></code></pre></div></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><a class="pager-link prev" href="/source-code/react/api/context.html" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Previous page</span><span class="title" data-v-ef5dee53>Context</span></a></div><div class="pager" data-v-ef5dee53><!----></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file
diff --git a/source-code/vue/index.html b/source-code/vue/index.html
index dab6edb..95a41da 100644
--- a/source-code/vue/index.html
+++ b/source-code/vue/index.html
@@ -5,20 +5,20 @@
     <meta name="viewport" content="width=device-width,initial-scale=1">
     <title>开始 | LEARNING DOCS</title>
     <meta name="description" content="Learning Docs by LIUeng">
-    <link rel="preload stylesheet" href="/learning-docs2/assets/style.1381d0e1.css" as="style">
+    <link rel="preload stylesheet" href="/assets/style.9a9f46c7.css" as="style">
     
-    <script type="module" src="/learning-docs2/assets/app.eb6611c3.js"></script>
-    <link rel="preload" href="/learning-docs2/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/framework.7c0fadea.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/chunks/theme.668a0457.js">
-    <link rel="modulepreload" href="/learning-docs2/assets/source-code_vue_index.md.55141804.lean.js">
-    <link rel="icon" href="/learning-docs2/logo.ico">
+    <script type="module" src="/assets/app.2b2e5b4f.js"></script>
+    <link rel="preload" href="/assets/inter-roman-latin.2ed14f66.woff2" as="font" type="font/woff2" crossorigin="">
+    <link rel="modulepreload" href="/assets/chunks/framework.0e8ae64e.js">
+    <link rel="modulepreload" href="/assets/chunks/theme.c533df5a.js">
+    <link rel="modulepreload" href="/assets/source-code_vue_index.md.59347e5f.lean.js">
+    <link rel="icon" href="/logo.ico">
     <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
     <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
   </head>
   <body>
-    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/learning-docs2/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/learning-docs2/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>导航</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>目录</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>React</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><section class="VPSidebarItem level-1" data-v-e31bd47b data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h3 class="text" data-v-e31bd47b>API</h3><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/react/api/context.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Context</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/learning-docs2/source-code/react/api/ref.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Ref</p><!--]--></a><!----></div><!----></div><!--]--></div></section><!--]--></div></section></div><div class="group" data-v-b00e2fdd><div class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><p class="text" data-v-e31bd47b>Vue</p><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><!----></div></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _learning-docs2_source-code_vue_" data-v-6b87e69f><div><h1 id="开始" tabindex="-1">开始 <a class="header-anchor" href="#开始" aria-label="Permalink to &quot;开始&quot;">​</a></h1></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/learning-docs2/source-code/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>目录</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
-    <script>window.__VP_HASH_MAP__=JSON.parse("{\"architecture_standard_comp-mod.md\":\"f6f9cedd\",\"alogrithm_interview_self.md\":\"f2953867\",\"architecture_standard_a-yz.md\":\"bd642461\",\"articles_advanced_knowledge.js.md\":\"4f4856e0\",\"alogrithm_basic_red_black_tree.md\":\"1fb89df7\",\"architecture_standard_performance.md\":\"c952558a\",\"alogrithm_index.md\":\"2b9ae594\",\"architecture_index.md\":\"d9230efd\",\"articles_advanced_devserver.md\":\"7df25eb4\",\"articles_advanced_mutationobserver.md\":\"cb0eb7f3\",\"architecture_websecure_xss.md\":\"63b7ea5b\",\"alogrithm_basic_bit.md\":\"1b0e2756\",\"articles_advanced_v8-code.md\":\"40cd5ff2\",\"articles_advanced_transitionanimation.md\":\"f629e671\",\"articles_advanced_debounce.md\":\"5bbfcaa3\",\"alogrithm_basic_o.md\":\"efeb357c\",\"articles_advanced_htmlwebpackplugin.md\":\"4a93efb9\",\"notes_css_inline.md\":\"ed702657\",\"notes_css_replaced.md\":\"ceaac847\",\"notes_css_text-character.md\":\"ab74a92c\",\"notes_es_es6.md\":\"cb465ca1\",\"notes_html_esmodule.md\":\"ddda8566\",\"notes_nodejs_ansi.md\":\"b4c1b09e\",\"notes_nodejs_event-loop.md\":\"95affbd8\",\"notes_nodejs_npm.md\":\"794dc498\",\"notes_regexp_base.md\":\"5f3b85d0\",\"notes_regexp_unknown.md\":\"40d387f2\",\"notes_typescript_advanced.md\":\"d0ace6b6\",\"notes_typescript_lib-struct.md\":\"04de5da6\",\"source-code_react_api_context.md\":\"f71ef236\",\"source-code_index.md\":\"3b974e67\",\"source-code_react_api_ref.md\":\"041146b3\",\"source-code_vue_index.md\":\"55141804\",\"network_webrtc.md\":\"5adc7068\",\"notes_css_bfc.md\":\"cf27ad88\",\"notes_css_box.md\":\"b41a02c1\",\"editor_index.md\":\"b924593a\",\"architecture_standard_project-design.md\":\"1e6aae9a\",\"notes_css_flex.md\":\"2119380d\",\"architecture_standard_monitor.md\":\"ff5a8411\",\"articles_basic_clipboard.md\":\"b53c3e95\",\"articles_advanced_virtuallist.md\":\"6b763d2e\",\"articles_basic_ieee.md\":\"f4f18348\",\"articles_basic_color_convert.md\":\"8302e80d\",\"articles_basic_git.md\":\"abbfc6c6\",\"notes_css_visibility.md\":\"4ed2886f\",\"notes_javascript_equal.md\":\"392568f0\",\"notes_html_seo.md\":\"15c47690\",\"articles_basic_dom_events.md\":\"6bad1c68\",\"articles_basic_eslint.md\":\"8aa0db41\",\"articles_problem_css.md\":\"d109b0e6\",\"articles_servers_ecs.md\":\"f94f1bda\",\"articles_basic_module.md\":\"e77ca7a2\",\"interview_crp.md\":\"7942c988\",\"articles_basic_history.md\":\"4e7d878f\",\"index.md\":\"d75d9507\",\"interview_metrics.md\":\"e083096b\",\"network_cookie.md\":\"14ec33fe\",\"network_cors.md\":\"974416e8\",\"interview_index.md\":\"e4e6acc5\",\"articles_advanced_docs.md\":\"74a9328e\",\"notes_javascript_jsop.md\":\"2e56b764\",\"notes_typescript_basic.md\":\"75a51f21\",\"notes_javascript_this.md\":\"532a6f9a\",\"articles_basic_script_link.md\":\"78aa867d\",\"notes_javascript_addeventlistener.md\":\"1f4fe8a5\",\"notes_html_unusual.md\":\"a78f96eb\",\"notes_javascript_dom.md\":\"00aacf49\",\"notes_javascript_scope.md\":\"9b63d680\",\"notes_css_index.md\":\"9165b88b\",\"interview_browser.md\":\"007efedd\",\"notes_javascript_event-loop.md\":\"15fccb5b\",\"editor_markdown_vuepress.md\":\"95e9a581\",\"network_ip_addr.md\":\"c87e2877\",\"network_layer.md\":\"75f275a2\",\"network_methods.md\":\"d5348171\",\"network_noun.md\":\"e1eac5d1\",\"network_special_addr.md\":\"8b6962a9\",\"network_socket.md\":\"5f45c373\",\"network_status_code.md\":\"3f54f40a\",\"network_subnet_mask.md\":\"9eb6788c\",\"notes_css_float.md\":\"88996ca7\",\"notes_css_pseudo.md\":\"65d61dd8\",\"network_osi.md\":\"3b1c2623\",\"network_dhcp.md\":\"2beb2a5b\",\"notes_javascript_prototype.md\":\"b24cb541\",\"notes_javascript_storage-struct.md\":\"43266820\",\"network_index.md\":\"ac3e7452\",\"network_tls_ssl.md\":\"1b14e38d\",\"notes_javascript_uri.md\":\"aa38219c\",\"notes_javascript_mutationobserver.md\":\"a535a188\",\"articles_basic_syslink.md\":\"ba8c5ece\",\"articles_problem_yarn.md\":\"3bf099db\",\"notes_index.md\":\"778f192c\",\"articles_index.md\":\"2805f70b\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/learning-docs2/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
+    <div id="app"><div class="Layout" data-v-5a346dfe><!--[--><!--]--><!--[--><span tabindex="-1" data-v-0f60ec36></span><a href="#VPContent" class="VPSkipLink visually-hidden" data-v-0f60ec36> Skip to content </a><!--]--><!----><header class="VPNav" data-v-5a346dfe data-v-ae24b3ad><div class="VPNavBar has-sidebar" data-v-ae24b3ad data-v-a0fd61f4><div class="container" data-v-a0fd61f4><div class="title" data-v-a0fd61f4><div class="VPNavBarTitle has-sidebar" data-v-a0fd61f4 data-v-86d1bed8><a class="title" href="/" data-v-86d1bed8><!--[--><!--]--><!----><!--[-->LEARNING DOCS<!--]--><!--[--><!--]--></a></div></div><div class="content" data-v-a0fd61f4><div class="curtain" data-v-a0fd61f4></div><div class="content-body" data-v-a0fd61f4><!--[--><!--]--><div class="VPNavBarSearch search" data-v-a0fd61f4><!--[--><!----><div id="local-search"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search"><span class="DocSearch-Button-Container"><svg class="DocSearch-Search-Icon" width="20" height="20" viewBox="0 0 20 20" aria-label="search icon"><path d="M14.386 14.386l4.0877 4.0877-4.0877-4.0877c-2.9418 2.9419-7.7115 2.9419-10.6533 0-2.9419-2.9418-2.9419-7.7115 0-10.6533 2.9418-2.9419 7.7115-2.9419 10.6533 0 2.9419 2.9418 2.9419 7.7115 0 10.6533z" stroke="currentColor" fill="none" fill-rule="evenodd" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"><kbd class="DocSearch-Button-Key"></kbd><kbd class="DocSearch-Button-Key">K</kbd></span></button></div><!--]--></div><nav aria-labelledby="main-nav-aria-label" class="VPNavBarMenu menu" data-v-a0fd61f4 data-v-7f418b0f><span id="main-nav-aria-label" class="visually-hidden" data-v-7f418b0f>Main Navigation</span><!--[--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/notes/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>基础</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/articles/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文章</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/network/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>网络</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/alogrithm/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>算法</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/source-code/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>源码</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/architecture/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>架构</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/interview/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>面试</span><!--]--></a><!--]--><!--[--><a class="VPLink link VPNavBarMenuLink" href="/editor/" tabindex="0" data-v-7f418b0f data-v-42ef59de><!--[--><span data-v-42ef59de>文档/编辑器</span><!--]--></a><!--]--><!--]--></nav><!----><div class="VPNavBarAppearance appearance" data-v-a0fd61f4 data-v-e6aabb21><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-e6aabb21 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div><!----><div class="VPFlyout VPNavBarExtra extra" data-v-a0fd61f4 data-v-40855f84 data-v-9c007e85><button type="button" class="button" aria-haspopup="true" aria-expanded="false" aria-label="extra navigation" data-v-9c007e85><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="icon" data-v-9c007e85><circle cx="12" cy="12" r="2"></circle><circle cx="19" cy="12" r="2"></circle><circle cx="5" cy="12" r="2"></circle></svg></button><div class="menu" data-v-9c007e85><div class="VPMenu" data-v-9c007e85 data-v-e7ea1737><!----><!--[--><!--[--><!----><div class="group" data-v-40855f84><div class="item appearance" data-v-40855f84><p class="label" data-v-40855f84>Appearance</p><div class="appearance-action" data-v-40855f84><button class="VPSwitch VPSwitchAppearance" type="button" role="switch" title="toggle dark mode" aria-checked="false" data-v-40855f84 data-v-ce54a7d1 data-v-b1685198><span class="check" data-v-b1685198><span class="icon" data-v-b1685198><!--[--><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="sun" data-v-ce54a7d1><path d="M12,18c-3.3,0-6-2.7-6-6s2.7-6,6-6s6,2.7,6,6S15.3,18,12,18zM12,8c-2.2,0-4,1.8-4,4c0,2.2,1.8,4,4,4c2.2,0,4-1.8,4-4C16,9.8,14.2,8,12,8z"></path><path d="M12,4c-0.6,0-1-0.4-1-1V1c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,3.6,12.6,4,12,4z"></path><path d="M12,24c-0.6,0-1-0.4-1-1v-2c0-0.6,0.4-1,1-1s1,0.4,1,1v2C13,23.6,12.6,24,12,24z"></path><path d="M5.6,6.6c-0.3,0-0.5-0.1-0.7-0.3L3.5,4.9c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C6.2,6.5,5.9,6.6,5.6,6.6z"></path><path d="M19.8,20.8c-0.3,0-0.5-0.1-0.7-0.3l-1.4-1.4c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l1.4,1.4c0.4,0.4,0.4,1,0,1.4C20.3,20.7,20,20.8,19.8,20.8z"></path><path d="M3,13H1c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S3.6,13,3,13z"></path><path d="M23,13h-2c-0.6,0-1-0.4-1-1s0.4-1,1-1h2c0.6,0,1,0.4,1,1S23.6,13,23,13z"></path><path d="M4.2,20.8c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C4.7,20.7,4.5,20.8,4.2,20.8z"></path><path d="M18.4,6.6c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l1.4-1.4c0.4-0.4,1-0.4,1.4,0s0.4,1,0,1.4l-1.4,1.4C18.9,6.5,18.6,6.6,18.4,6.6z"></path></svg><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="moon" data-v-ce54a7d1><path d="M12.1,22c-0.3,0-0.6,0-0.9,0c-5.5-0.5-9.5-5.4-9-10.9c0.4-4.8,4.2-8.6,9-9c0.4,0,0.8,0.2,1,0.5c0.2,0.3,0.2,0.8-0.1,1.1c-2,2.7-1.4,6.4,1.3,8.4c2.1,1.6,5,1.6,7.1,0c0.3-0.2,0.7-0.3,1.1-0.1c0.3,0.2,0.5,0.6,0.5,1c-0.2,2.7-1.5,5.1-3.6,6.8C16.6,21.2,14.4,22,12.1,22zM9.3,4.4c-2.9,1-5,3.6-5.2,6.8c-0.4,4.4,2.8,8.3,7.2,8.7c2.1,0.2,4.2-0.4,5.8-1.8c1.1-0.9,1.9-2.1,2.4-3.4c-2.5,0.9-5.3,0.5-7.5-1.1C9.2,11.4,8.1,7.7,9.3,4.4z"></path></svg><!--]--></span></span></button></div></div></div><!----><!--]--><!--]--></div></div></div><!--[--><!--]--><button type="button" class="VPNavBarHamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="VPNavScreen" data-v-a0fd61f4 data-v-e5dd9c1c><span class="container" data-v-e5dd9c1c><span class="top" data-v-e5dd9c1c></span><span class="middle" data-v-e5dd9c1c></span><span class="bottom" data-v-e5dd9c1c></span></span></button></div></div></div></div><!----></header><div class="VPLocalNav reached-top" data-v-5a346dfe data-v-79c8c1df><button class="menu" aria-expanded="false" aria-controls="VPSidebarNav" data-v-79c8c1df><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="menu-icon" data-v-79c8c1df><path d="M17,11H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,11,17,11z"></path><path d="M21,7H3C2.4,7,2,6.6,2,6s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,7,21,7z"></path><path d="M21,15H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h18c0.6,0,1,0.4,1,1S21.6,15,21,15z"></path><path d="M17,19H3c-0.6,0-1-0.4-1-1s0.4-1,1-1h14c0.6,0,1,0.4,1,1S17.6,19,17,19z"></path></svg><span class="menu-text" data-v-79c8c1df>Menu</span></button><div class="VPLocalNavOutlineDropdown" style="--vp-vh:0px;" data-v-79c8c1df data-v-1c15a60a><button data-v-1c15a60a>Return to top</button><!----></div></div><aside class="VPSidebar" data-v-5a346dfe data-v-b00e2fdd><div class="curtain" data-v-b00e2fdd></div><nav class="nav" id="VPSidebarNav" aria-labelledby="sidebar-aria-label" tabindex="-1" data-v-b00e2fdd><span class="visually-hidden" id="sidebar-aria-label" data-v-b00e2fdd> Sidebar Navigation </span><!--[--><!--]--><!--[--><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>导航</h2><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-1 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>目录</p><!--]--></a><!----></div><!----></div><!--]--></div></section></div><div class="group" data-v-b00e2fdd><section class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h2 class="text" data-v-e31bd47b>React</h2><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><div class="items" data-v-e31bd47b><!--[--><section class="VPSidebarItem level-1" data-v-e31bd47b data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><h3 class="text" data-v-e31bd47b>API</h3><!----></div><div class="items" data-v-e31bd47b><!--[--><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/react/api/context.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Context</p><!--]--></a><!----></div><!----></div><div class="VPSidebarItem level-2 is-link" data-v-e31bd47b data-v-e31bd47b><div class="item" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><a class="VPLink link link" href="/source-code/react/api/ref.html" data-v-e31bd47b><!--[--><p class="text" data-v-e31bd47b>Ref</p><!--]--></a><!----></div><!----></div><!--]--></div></section><!--]--></div></section></div><div class="group" data-v-b00e2fdd><div class="VPSidebarItem level-0 collapsible collapsed" data-v-b00e2fdd data-v-e31bd47b><div class="item" role="button" tabindex="0" data-v-e31bd47b><div class="indicator" data-v-e31bd47b></div><p class="text" data-v-e31bd47b>Vue</p><div class="caret" role="button" aria-label="toggle section" tabindex="0" data-v-e31bd47b><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" viewbox="0 0 24 24" class="caret-icon" data-v-e31bd47b><path d="M9,19c-0.3,0-0.5-0.1-0.7-0.3c-0.4-0.4-0.4-1,0-1.4l5.3-5.3L8.3,6.7c-0.4-0.4-0.4-1,0-1.4s1-0.4,1.4,0l6,6c0.4,0.4,0.4,1,0,1.4l-6,6C9.5,18.9,9.3,19,9,19z"></path></svg></div></div><!----></div></div><!--]--><!--[--><!--]--></nav></aside><div class="VPContent has-sidebar" id="VPContent" data-v-5a346dfe data-v-669faec9><div class="VPDoc has-sidebar has-aside" data-v-669faec9 data-v-6b87e69f><!--[--><!--]--><div class="container" data-v-6b87e69f><div class="aside" data-v-6b87e69f><div class="aside-curtain" data-v-6b87e69f></div><div class="aside-container" data-v-6b87e69f><div class="aside-content" data-v-6b87e69f><div class="VPDocAside" data-v-6b87e69f data-v-3f215769><!--[--><!--]--><!--[--><!--]--><div class="VPDocAsideOutline" role="navigation" data-v-3f215769 data-v-d330b1bb><div class="content" data-v-d330b1bb><div class="outline-marker" data-v-d330b1bb></div><div class="outline-title" role="heading" aria-level="2" data-v-d330b1bb>On this page</div><nav aria-labelledby="doc-outline-aria-label" data-v-d330b1bb><span class="visually-hidden" id="doc-outline-aria-label" data-v-d330b1bb> Table of Contents for current page </span><ul class="root" data-v-d330b1bb data-v-d0ee3533><!--[--><!--]--></ul></nav></div></div><!--[--><!--]--><div class="spacer" data-v-3f215769></div><!--[--><!--]--><!----><!--[--><!--]--><!--[--><!--]--></div></div></div></div><div class="content" data-v-6b87e69f><div class="content-container" data-v-6b87e69f><!--[--><!--]--><!----><main class="main" data-v-6b87e69f><div style="position:relative;" class="vp-doc _source-code_vue_" data-v-6b87e69f><div><h1 id="开始" tabindex="-1">开始 <a class="header-anchor" href="#开始" aria-label="Permalink to &quot;开始&quot;">​</a></h1></div></div></main><footer class="VPDocFooter" data-v-6b87e69f data-v-ef5dee53><!--[--><!--]--><div class="edit-info" data-v-ef5dee53><!----><div class="last-updated" data-v-ef5dee53><p class="VPLastUpdated" data-v-ef5dee53 data-v-7e05ebdb>Last updated: <time datetime="2022-12-06T12:47:28.000Z" data-v-7e05ebdb></time></p></div></div><nav class="prev-next" data-v-ef5dee53><div class="pager" data-v-ef5dee53><!----></div><div class="pager" data-v-ef5dee53><a class="pager-link next" href="/source-code/" data-v-ef5dee53><span class="desc" data-v-ef5dee53>Next page</span><span class="title" data-v-ef5dee53>目录</span></a></div></nav></footer><!--[--><!--]--></div></div></div><!--[--><!--]--></div></div><footer class="VPFooter has-sidebar" data-v-5a346dfe data-v-e03eb2e1><div class="container" data-v-e03eb2e1><p class="message" data-v-e03eb2e1>Released under the MIT License.</p><p class="copyright" data-v-e03eb2e1>Copyright © 2019-present LIUeng</p></div></footer><!--[--><!--]--></div></div>
+    <script>window.__VP_HASH_MAP__=JSON.parse("{\"alogrithm_interview_self.md\":\"c8309eff\",\"alogrithm_basic_red_black_tree.md\":\"55eb2555\",\"architecture_index.md\":\"678a0502\",\"architecture_standard_a-yz.md\":\"a0e51b94\",\"architecture_standard_comp-mod.md\":\"e027bdb0\",\"architecture_standard_monitor.md\":\"6a6f7341\",\"alogrithm_basic_bit.md\":\"f90bc13d\",\"architecture_standard_project-design.md\":\"491238a5\",\"alogrithm_basic_o.md\":\"7641dd85\",\"articles_advanced_devserver.md\":\"adf19849\",\"articles_advanced_docs.md\":\"501fd43f\",\"architecture_websecure_xss.md\":\"b68d323d\",\"alogrithm_index.md\":\"67f8b108\",\"architecture_standard_performance.md\":\"5df854dc\",\"articles_advanced_knowledge.js.md\":\"8a7fac43\",\"articles_advanced_debounce.md\":\"c37622c0\",\"articles_advanced_transitionanimation.md\":\"e283b702\",\"articles_basic_dom_events.md\":\"70d1d757\",\"editor_index.md\":\"f69469c7\",\"network_layer.md\":\"e12ef59e\",\"articles_basic_git.md\":\"8f01f6d4\",\"interview_index.md\":\"d69cf835\",\"network_cors.md\":\"597b0a96\",\"articles_basic_history.md\":\"bb6472e8\",\"articles_basic_script_link.md\":\"eb8f70cc\",\"notes_css_index.md\":\"97c1211d\",\"notes_css_pseudo.md\":\"8a522478\",\"notes_css_replaced.md\":\"3cd3cdf4\",\"notes_css_inline.md\":\"5f3b894b\",\"network_tls_ssl.md\":\"e0605f70\",\"index.md\":\"43ab226b\",\"articles_servers_ecs.md\":\"3a2f60fe\",\"interview_crp.md\":\"20bcf17d\",\"articles_basic_clipboard.md\":\"a48ade2d\",\"articles_problem_css.md\":\"5cdc7adf\",\"articles_problem_yarn.md\":\"6c3a7206\",\"articles_index.md\":\"16646c0c\",\"articles_advanced_mutationobserver.md\":\"1d6f3539\",\"notes_html_esmodule.md\":\"8d06acba\",\"notes_html_seo.md\":\"17a408c9\",\"notes_html_unusual.md\":\"76389d1b\",\"articles_basic_syslink.md\":\"8ff4f41d\",\"notes_css_flex.md\":\"d5fb90fd\",\"articles_basic_module.md\":\"67706ce5\",\"notes_css_box.md\":\"b1484cf4\",\"network_webrtc.md\":\"06b0eb25\",\"network_methods.md\":\"a8694107\",\"network_noun.md\":\"b1b4cd32\",\"notes_css_visibility.md\":\"36af78c5\",\"articles_basic_eslint.md\":\"bea7edfe\",\"network_osi.md\":\"021cfe3c\",\"network_special_addr.md\":\"deb0827e\",\"network_subnet_mask.md\":\"7a58406b\",\"notes_css_text-character.md\":\"567549b3\",\"network_socket.md\":\"a2e885ec\",\"interview_browser.md\":\"a89a4d9b\",\"network_status_code.md\":\"b6f517ca\",\"editor_markdown_vuepress.md\":\"8bf6ae13\",\"notes_css_float.md\":\"74e6557b\",\"articles_advanced_htmlwebpackplugin.md\":\"b19e7406\",\"network_ip_addr.md\":\"7e144e39\",\"articles_advanced_virtuallist.md\":\"0c9b0049\",\"network_cookie.md\":\"9860852e\",\"network_dhcp.md\":\"36ba0d0c\",\"notes_es_es6.md\":\"c70b9687\",\"articles_basic_color_convert.md\":\"2cce2798\",\"articles_advanced_v8-code.md\":\"aa1e9c3f\",\"notes_css_bfc.md\":\"d9623d35\",\"network_index.md\":\"a4ce8b20\",\"notes_nodejs_npm.md\":\"990b6f83\",\"source-code_react_api_context.md\":\"cb6576d9\",\"source-code_react_api_ref.md\":\"955d1f79\",\"articles_basic_ieee.md\":\"04dcfb91\",\"notes_regexp_unknown.md\":\"ffcfd74a\",\"notes_javascript_jsop.md\":\"a97810f8\",\"notes_javascript_uri.md\":\"0675aa7b\",\"notes_javascript_scope.md\":\"be39322f\",\"notes_index.md\":\"0f4dfe42\",\"interview_metrics.md\":\"6cc2fc75\",\"notes_javascript_event-loop.md\":\"bdac45df\",\"source-code_vue_index.md\":\"59347e5f\",\"notes_nodejs_event-loop.md\":\"f5078491\",\"notes_javascript_mutationobserver.md\":\"1d6ee92e\",\"notes_typescript_lib-struct.md\":\"214381a8\",\"notes_javascript_equal.md\":\"0278cdef\",\"source-code_index.md\":\"c3b56127\",\"notes_javascript_storage-struct.md\":\"0cab0c00\",\"notes_typescript_basic.md\":\"7f81406b\",\"notes_regexp_base.md\":\"80469b71\",\"notes_typescript_advanced.md\":\"13baaa4d\",\"notes_javascript_this.md\":\"e080543e\",\"notes_javascript_dom.md\":\"0af651ba\",\"notes_javascript_addeventlistener.md\":\"6026f065\",\"notes_javascript_prototype.md\":\"36c69f43\",\"notes_nodejs_ansi.md\":\"0e90e8a3\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"LEARNING DOCS\",\"description\":\"Learning Docs by LIUeng\",\"base\":\"/\",\"head\":[],\"appearance\":true,\"themeConfig\":{\"nav\":[{\"text\":\"基础\",\"link\":\"/notes/\"},{\"text\":\"文章\",\"link\":\"/articles/\"},{\"text\":\"网络\",\"link\":\"/network/\"},{\"text\":\"算法\",\"link\":\"/alogrithm/\"},{\"text\":\"源码\",\"link\":\"/source-code/\"},{\"text\":\"架构\",\"link\":\"/architecture/\"},{\"text\":\"面试\",\"link\":\"/interview/\"},{\"text\":\"文档/编辑器\",\"link\":\"/editor/\"}],\"sidebar\":{\"/notes/\":[{\"text\":\"笔记\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/notes/\"}]},{\"text\":\"HTML\",\"collapsed\":true,\"items\":[{\"text\":\"SEO\",\"link\":\"/notes/html/seo\"},{\"text\":\"ES Module\",\"link\":\"/notes/html/esmodule\"},{\"text\":\"扩展\",\"link\":\"/notes/html/unusual\"}]},{\"text\":\"CSS\",\"collapsed\":true,\"items\":[{\"text\":\"CSS 知识\",\"link\":\"/notes/css/\"},{\"text\":\"BFC\",\"link\":\"/notes/css/bfc\"},{\"text\":\"盒模型\",\"link\":\"/notes/css/box\"},{\"text\":\"Flex 扩展\",\"link\":\"/notes/css/flex\"},{\"text\":\"Float 注意\",\"link\":\"/notes/css/float\"},{\"text\":\"行内元素\",\"link\":\"/notes/css/inline\"},{\"text\":\"伪元素伪类\",\"link\":\"/notes/css/pseudo\"},{\"text\":\"可替换元素\",\"link\":\"/notes/css/replaced\"},{\"text\":\"文字特性\",\"link\":\"/notes/css/text-character\"},{\"text\":\"Visibility 属性\",\"link\":\"/notes/css/visibility\"}]},{\"text\":\"JavaScript\",\"collapsed\":true,\"items\":[{\"text\":\"事件监听\",\"link\":\"/notes/javascript/addEventListener\"},{\"text\":\"DOM 类型\",\"link\":\"/notes/javascript/dom\"},{\"text\":\"相等性检查\",\"link\":\"/notes/javascript/equal\"},{\"text\":\"事件循环\",\"link\":\"/notes/javascript/event-loop\"},{\"text\":\"运算符\",\"link\":\"/notes/javascript/jsop\"},{\"text\":\"MutationObserver\",\"link\":\"/notes/javascript/mutationObserver\"},{\"text\":\"原型 原型链\",\"link\":\"/notes/javascript/prototype\"},{\"text\":\"作用域\",\"link\":\"/notes/javascript/scope\"},{\"text\":\"存储结构\",\"link\":\"/notes/javascript/storage-struct\"},{\"text\":\"This 作用域\",\"link\":\"/notes/javascript/this\"},{\"text\":\"编码\",\"link\":\"/notes/javascript/URI\"}]},{\"text\":\"正则表达式\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/regexp/base\"},{\"text\":\"扩展\",\"link\":\"/notes/regexp/unknown\"}]},{\"text\":\"ES Features\",\"collapsed\":true,\"items\":[{\"text\":\"ES6+\",\"link\":\"/notes/es/es6\"}]},{\"text\":\"NodeJS\",\"collapsed\":true,\"items\":[{\"text\":\"ANSI\",\"link\":\"/notes/nodejs/ansi\"},{\"text\":\"事件循环\",\"link\":\"/notes/nodejs/event-loop\"},{\"text\":\"Npm\",\"link\":\"/notes/nodejs/npm\"}]},{\"text\":\"TypeScript\",\"collapsed\":true,\"items\":[{\"text\":\"基础\",\"link\":\"/notes/typescript/basic\"},{\"text\":\"高级基础\",\"link\":\"/notes/typescript/advanced\"},{\"text\":\"包结构\",\"link\":\"/notes/typescript/lib-struct\"}]}],\"/articles/\":[{\"text\":\"文章\",\"items\":[{\"text\":\"阅读前瞻\",\"link\":\"/articles/\"}]},{\"text\":\"基础型\",\"collapsed\":true,\"items\":[{\"text\":\"复制粘贴\",\"link\":\"/articles/basic/clipboard\"},{\"text\":\"颜色转换\",\"link\":\"/articles/basic/color_convert\"},{\"text\":\"DOM 事件流\",\"link\":\"/articles/basic/dom_events\"},{\"text\":\"ESlint 配置\",\"link\":\"/articles/basic/eslint\"},{\"text\":\"Git 操作\",\"link\":\"/articles/basic/git\"},{\"text\":\"History 路由\",\"link\":\"/articles/basic/history\"},{\"text\":\"IEEE 标准\",\"link\":\"/articles/basic/ieee\"},{\"text\":\"模块化演变\",\"link\":\"/articles/basic/module\"},{\"text\":\"Script 标签\",\"link\":\"/articles/basic/script_link\"},{\"text\":\"Soft/Hard Links\",\"link\":\"/articles/basic/syslink\"}]},{\"text\":\"进阶型\",\"collapsed\":true,\"items\":[{\"text\":\"防抖节流\",\"link\":\"/articles/advanced/debounce\"},{\"text\":\"热重载\",\"link\":\"/articles/advanced/devServer\"},{\"text\":\"前端文档\",\"link\":\"/articles/advanced/docs\"},{\"text\":\"HtmlWebpackPlugin 解析\",\"link\":\"/articles/advanced/htmlWebpackPlugin\"},{\"text\":\"前端不知道的扩展\",\"link\":\"/articles/advanced/knowledge.js\"},{\"text\":\"MutationObserver\",\"link\":\"/articles/advanced/mutationObserver\"},{\"text\":\"V8 解析\",\"link\":\"/articles/advanced/v8-code\"},{\"text\":\"虚拟列表\",\"link\":\"/articles/advanced/virtualList\"}]},{\"text\":\"服务器型\",\"collapsed\":true,\"items\":[{\"text\":\"ECS\",\"link\":\"/articles/servers/ecs\"}]},{\"text\":\"问题型\",\"collapsed\":true,\"items\":[{\"text\":\"Css 问题\",\"link\":\"/articles/problem/css\"},{\"text\":\"Yarn 问题\",\"link\":\"/articles/problem/yarn\"}]}],\"/network/\":[{\"text\":\"认识网络\",\"items\":[{\"text\":\"基础\",\"link\":\"/network/\"}]},{\"text\":\"网络相关\",\"collapsed\":true,\"items\":[{\"text\":\"Cookie\",\"link\":\"/network/cookie\"},{\"text\":\"Cors\",\"link\":\"/network/cors\"},{\"text\":\"DHCP\",\"link\":\"/network/dhcp\"},{\"text\":\"IP 地址\",\"link\":\"/network/ip_addr\"},{\"text\":\"网络分层\",\"link\":\"/network/layer\"},{\"text\":\"HTTP 请求方式\",\"link\":\"/network/methods\"},{\"text\":\"网络名词\",\"link\":\"/network/noun\"},{\"text\":\"OSI 模型\",\"link\":\"/network/osi\"},{\"text\":\"Socket\",\"link\":\"/network/socket\"},{\"text\":\"特殊地址\",\"link\":\"/network/special_addr\"},{\"text\":\"HTTP 状态码\",\"link\":\"/network/status_code\"},{\"text\":\"子网掩码\",\"link\":\"/network/subnet_mask\"},{\"text\":\"TLS SSL\",\"link\":\"/network/tls_ssl\"},{\"text\":\"WebRTC\",\"link\":\"/network/webrtc\"}]}],\"/alogrithm/\":[{\"text\":\"算法篇\",\"items\":[{\"text\":\"前言\",\"link\":\"/alogrithm/\"}]},{\"text\":\"基础\",\"collapsed\":true,\"items\":[{\"text\":\"大(O)表示法\",\"link\":\"/alogrithm/basic/O\"},{\"text\":\"位运算\",\"link\":\"/alogrithm/basic/bit\"},{\"text\":\"红黑树\",\"link\":\"/alogrithm/basic/red_black_tree\"}]},{\"text\":\"面试算法\",\"collapsed\":true,\"items\":[{\"text\":\"数据结构辅助记忆\",\"link\":\"/alogrithm/interview/self\"}]}],\"/source-code/\":[{\"text\":\"导航\",\"items\":[{\"text\":\"目录\",\"link\":\"/source-code/\"}]},{\"text\":\"React\",\"collapsed\":true,\"items\":[{\"text\":\"API\",\"items\":[{\"text\":\"Context\",\"link\":\"/source-code/react/api/context\"},{\"text\":\"Ref\",\"link\":\"/source-code/react/api/ref\"}]}]},{\"text\":\"Vue\",\"collapsed\":true,\"items\":[]}],\"/architecture/\":[{\"text\":\"架构\",\"items\":[{\"text\":\"思考\",\"link\":\"/architecture/\"}]},{\"text\":\"业界标准\",\"collapsed\":true,\"items\":[{\"text\":\"标准 - 模板1\",\"link\":\"/architecture/standard/A-YZ\"},{\"text\":\"组件化与模块化\",\"link\":\"/architecture/standard/comp-mod\"},{\"text\":\"前端监控\",\"link\":\"/architecture/standard/monitor\"},{\"text\":\"前端性能\",\"link\":\"/architecture/standard/performance\"},{\"text\":\"项目设计\",\"link\":\"/architecture/standard/project-design\"}]},{\"text\":\"网页安全\",\"collapsed\":true,\"items\":[{\"text\":\"XSS\",\"link\":\"/architecture/websecure/xss\"}]}],\"/interview/\":[{\"text\":\"面试指南\",\"items\":[{\"text\":\"写在前面\",\"link\":\"/interview/\"}]},{\"text\":\"面试相关\",\"items\":[{\"text\":\"浏览器渲染流水线\",\"link\":\"/interview/browser\"},{\"text\":\"性能指标\",\"link\":\"/interview/metrics\"},{\"text\":\"关键路径渲染 CRP\",\"link\":\"/interview/crp\"}]}],\"/editor/\":[{\"text\":\"文档/编辑器\",\"items\":[{\"text\":\"说明\",\"link\":\"/editor/\"}]},{\"text\":\"Markdown\",\"collapsed\":true,\"items\":[{\"text\":\"Vue/VitePress\",\"link\":\"/editor/markdown/vuepress\"}]}]},\"footer\":{\"message\":\"Released under the MIT License.\",\"copyright\":\"Copyright © 2019-present LIUeng\"},\"search\":{\"provider\":\"local\"}},\"locales\":{},\"scrollOffset\":90,\"cleanUrls\":false}");</script>
     
   </body>
 </html>
\ No newline at end of file